تاریخ انتشار :     15 دی 1397

از ViewPager برای جابجایی فرگمنت ها بصورت اسکرول، استفاده می شود.برای ساخت ViewPager در اندروید لازم است از Fragment و TabLayout استفاده کنید.

یک پروژه ی جدید ایجاد کرده و کتابخانه ی design را  در گردل اد کنید:

ساخت Fragment

ابتدا دو فرگمنت ایجاد می کنیم تا با استفاده از ViewPager، آن ها را نمایش دهیم.در قدم اول باید ظاهر فرگمنت ها را طراحی کنیم.

دو layout بنام های fragment_one و fragment_two ایجاد کنید و سورس کدهای زیر را در آن ها وارد کنید:

fragment_one:

fragment_two:

 

پس هر فرگمنت شامل یک TextView می باشد.

حالا میریم سراغ کد جاوای فرگمنت.دو کلاس بنام های OneFragment و TwoFragment ایجاد کرده و سورس کدهای زیر را در آن ها وارد کنید:

OneFragment:

TwoFragment:

توضیح کد جاوای فرگمنت

ابتدا باید کلاس راextends کنیم به Fragment.سپس متدهای لازم برای فرگمنت را وارد کنیم که این متدها عبارتند از:

newInstance

onCreateView

onViewCreated

برای نوشتن متدها کافیست نام آن ها را وارد کنید. بصورت خودکار متدها ایمپورت می شوند.

متد newInstance، رابط بین کلاس و اکتیویتی است.

متد onCreateView، برای واکشی کردن ظاهر فرگمنت است.

متد onViewCreated، برای هر کاری است که می خواهیم روی فرگمنت انجام دهیم که چون در اینجا، فرگمنت شامل یک Textview است نیاز به کد نوشتن در این قسمت نداریم.

ساخت TabLayout  و ViewPager

یک اکتیویتی ایجاد  کرده و در xml آن سورس کد زیر را وارد کنید:

توضیح کد بالا:

ابتدا یک LinearLayout با طول و عرض match_parent ایجاد کرده سپس یک لایه ی TabLayout و یک لایه ی ViewPager در آن قرار می دهیم.

در لایه ی  TabLayout از tabTextColor، برای مشخص کردن رنگ متن TabLayout ، از tabSelectedTextColor، برای مشخص کردن رنگ متن تب انتخاب شده، از tabIndicatorColor، برای مشخص کردن رنگ خط زیر هر تب(indicator) و از tabIndicatorHeight، برای مشخص کردن ضخامت indicator ، استفاده می شود.

ساخت آداپتر برای ViewPager

برای ساخت ViewPager ابتدا لازم است یک adapter برای آن ایجاد کنیم.بدین منظور یک کلاس ایجاد کنید و سورس کد زیر را در آن وارد کنید:

توضیح کد بالا:

ابتدا کلاس را به FragmentPagerAdapter ، extends می کنیم که یک چراغ قرمز رنگ ظاهر می شود و از ما می خواهد متدهای آن را ایمپورت کنیم.بعد از ایمپورت کردن متدها از ما می خواهد متد constructor را وارد کنیم.قبل از وارد کردن constructor، یک لیست از Fragment ها و یک آرایه از جنس String (برای عناوین TabLayout ها) ایجاد کرده و آن ها را به ورودی constructor ، پاس دهید.

متد getItem ، برای مشخص کردن آیتم های ViewPager می باشد که ما در اینجا مشخص کردیم این آیتم ها همان فرگمنت ها هستند.

متد getCount، برای مشخص کردن تعداد  آیتم ها می باشد که همان تعداد فرگمنت ها است.

متد getPageTitle، نیز برای ممشخص کردن عنوان هر ViewPager یا به عبارتی عنوان هر TabLayout، است.توجه داشته باشید که در هنگام ایمپورت کردن متد ها، این متد وارد نمی شود و باید آن را بنویسیم که کافیست اسم آن را وارد کنید تا متد را براتون بیاره.

کد جاوای Activity

داخل اکتیویتی که قرار است ViewPager در آن نمایش داده شود، سورس کد زیر را وارد کنید:

توضیح کد بالا:

ابتدا Context،TabLayout،ViewPager، لیست فرگمنت ها و لیست عناوین را تعریف می کنیم:

 

سپس برای نظم بیشتر کدها، دو متد initView() و  initViewPager() را ایجاد کرده و در onCreate فراخوانی می کنیم.

داخل متد initView، TabLayout و ViewPager را findViewById می کنیم:

 

داخل متد initViewPager، کدهای مربوط به ViewPager را قرار می دهیم.ابتدا لیست فرگمنت ها را تعریف کرده ، سپس دو فرگمنتی که از قبل ساختیم داخل این لیست اد می کنیم.

 

حالا لیست عناوین را در آرایه ی  titlesمشخص می کنیم :

 

و در آخر آداپتر را برای ViewPager و ViewPager را برای TabLayout ست می کنیم:

 

ساخت ViewPager به پایان رسید.با اجرا کردن پروژه، صفحه ی زیر را میبینید که با اسکرول کردن روی هر تب، فرگمنت مربوط به آن نشان داده میشود.

 

 

نویسنده: الهه ابراهیمی

  • امتیاز :
    1 ستاره2 ستاره3 ستاره4 ستاره5 ستاره
    Loading...
  • نظرات