حسام رسولیان
ViewPager2

آشنایی با کامپوننت ViewPager2 در اندروید

یکی از کامپوننت های قدیمی اندروید که برای ساخت اسلاید ها و تب ها از آن استفاده میکردیم کامپوننت ViewPager بود.

گوگل به تازگی این کامپوننت با ارائه نسخه جدیدی به نام ViewPager2 بروزرسانی کرده و امکانات بسیار زیادی را برای بهینه تر شدن اپلیکیشن ارائه داده است.

بزرگترین تغییر ViewPager2 نسبت به نسل قبلی خود استفاده از رسایکلر ویو برای پیاده سازی هستش که این کار باعث شده از نظر امکانات و کمتر شدن کد های خود کلاس ViewPager2 تغییرات زیادی پیدا کند.

خب اما برای استفاده شما اول باید به AndroidX مهاجرت کنید چون ViewPager2 فقط در این کتابخونه و پکیج در دسترس هست.

بهتره که اول نگاهی به امکانات ViewPager2 باهم بیاندازیم.

  • پشتیبانی از چینش راست به چپ صفحات RTL که برای اپلیکیشن های ایرانی بسیار کاربرد دارد
  • طراحی بر اساس رسایکلر ویو
  • پشتیبانی از LayoutManager
  • بهبود اطلاع رسانی تغییر اطلاعات
  • ایجاد قابلیت اسکرول از طریق برنامه نویسی بصورت دستی
  • ایجاد فاصله (مارجین) بین صفحات
  • پشتیبانی از Diff Util

Layout manager

این کلاس همان کلاس Layout manager است که در پیاده سازی رسایکلر ویو دقیقا ما استفاده می کنیم و از طریق این قابلیت ما میتونیم وضعیت افقی یا عمودی بودن Viewpager خودمون و تعیین کنیم.

این کا با استفاده از متد setOrientation() به راحتی قابل انجام است.

پیاده سازی ViewPager2

implementation 'androidx.viewpager2:viewpager2:1.0.0-alpha01'

برای استفاده از این کتابخانه خط بالا را در فایل گریدل پروژه خودتون اضافه کنید و منتظر سینک شدن آن بمانید.

بعد از اضافه کردن کتابخانه وارد فایل xml خود شوید و از تگ زیر برای نمایش viewpager2 استفاده کنید.

<androidx.viewpager2.widget.ViewPager2
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

حالا که viewpager2  و داخل فایل لایه تعریف کردیم نیاز داریم که کمی اطلاعات به آن اضافه کنیم برای نمایش دادن.

این کار و با ساخت یک کلاس و ارث بری از کلاس RecyclerView.Adapter انجام میدیم. بعد از پیاده سازی کلاس نحوه استفاده از آن به شکل زیر است.

val adapter = WelcomeAdapter()
adapter.welcomeItems = listOf(WelcomeItem.WELCOME_ONE, WelcomeItem.WELCOME_TWO, WelcomeItem.WELCOME_THREE)
view_pager.adapter = adapter

برای تغییر حالت عمودی و افقی بودن صفحه هم میتونید از دستور زیر استفاده کنید.

view_pager.orientation = ORIENTATION_VERTICAL

 

پیام بگذارید

هجده − 3 =