كيفية وضع UIScrollView في تطبيقك

marwaalgethamiمنذ 7 سنوات

بسم الله الرحمن الرحيم

 

في هذا الشرح سوف نتعلم كيف نضع أداة التمرير( scroll view )الى مشروعك . سوف أشرح التمرير العامودي الى الاعلى و الاسفل ( vertical scrolling).

اذا اتقنت هذه الطريقة البسيطه ستتمكن من اتقان الطرق المتقدمه والتي تعتمد على مفهوم ال  auto layout

(ربما سأتمكن من شرحه المرات القادمه)

 

في البداية نبدأ بانشاء المشروع في xcode كالتالي 

596f615ccc385_ScreenShot1438-10-25at3_32_49PM.png.4cbbe7e6862f918c555134ca71b4cc11.png

 

نذهب الى storybord  ونقوم بإضافة  UIScrollView الى ViewController

كالتالي

596f66101b755_ScreenShot1438-10-25at3_36_16PM.thumb.png.4070afac4945cb613946287103a1834d.png

 

 

الان نضع القيود هذه القيود تعمل كقيد على أداة التمرير بحيث تقوم بتثبيتها على الواجهة( نضغط على الخطوط الحمراء المتقطعة )كالتالي:

 

596f666d3e756_ScreenShot1438-10-25at3_38_20PM.png.b7bd5f114a00b136a210667fa406c375.png

 

 

الان نحدد ال View Controller ونذهب الى القائمة في اليمين size inspector

ونغير simulated size الى Freeform ونضع الارتفاع ١٠٠٠.

 الهدف من هذه الخطوة حتى نتمكن من رؤية الواجهة بطولها الكامل ونتمكن من وضع الادوات بحرية تامه الى اداة التمرير .  

596f67686224f_ScreenShot1438-10-25at3_42_44PM.thumb.png.d0e20859e61a33064be4e535ddfa9cb3.png

 

الان نضع labels في اماكنها  ونغير الخلفية لهما والقيود مثل الصورتين التاليه حتى نختبر هل تعمل أداة التمرير.

 

596f69296c9cf_ScreenShot1438-10-25at3_45_12PM.png.930e2b32704a2545e15435da13875e01.png

 

596f694549ee6_ScreenShot1438-10-25at5_12_41PM.thumb.png.e18b4ddd331f0fcc382ce570b07d7f70.png

 

ليكون الشكل النهائي لهما هكذا

596f697e9b705_ScreenShot1438-10-25at4_34_31PM.png.66f9f64f09a5cd7bdab9cbd6f47d1adc.png

 

الان نبدا مرحلة كتابة الاكواد  woow

 نقوم بسحب وافلات scroll view عن طريق الضغط على الماوس و control من لوحه المفاتيح الى واجهة الكود لتكوين outlet يسمى myScroll 

596f6a0429fb9_ScreenShot1438-10-25at3_50_36PM.thumb.png.b47b74b722e57561aadae01cc4e2e2b2.png

 

الان نضيف هذا الكود الى دالة viewDidLoad كما في الصوره

contentSize تحدد الاتجاهات التي ممكن أن تقوم أداه التمرير بالوصول اليها فاداة التمرير تستطيع الذهاب الى الاعلى والاسفل بارتفاع ١٠٠٠ كما وضعناها في   storyboard . أما العرض فهو ثابت وهو بعرض شاشة الايفون.

596f6a8898baf_ScreenShot1438-10-25at3_51_54PM.thumb.png.0afd64d91653d4f662392eaf3a181165.png

 

الان نقوم بتشغيل ورؤية النتيجه 

 

596f6aafc813d_scrollviewvideo.gif.bc92f97f9b7558a183296992a797c5bf.gif

 

شكرا لموقع عالم البرمجه لاتاحه الفرصه لمشاركه العطاء مع  المبرمجين الرائعين :)

كلمات دليلية:
0
إعجاب
2062
مشاهدات
0
مشاركة
0
متابع
متميز
محتوى رهيب

التعليقات (0)

لايوجد لديك حساب في عالم البرمجة؟

تحب تنضم لعالم البرمجة؟ وتنشئ عالمك الخاص، تنشر المقالات، الدورات، تشارك المبرمجين وتساعد الآخرين، اشترك الآن بخطوات يسيرة !