ViewPager2 के साथ कैसे काम करें

7 फरवरी, 2019 को ज्यादा समय नहीं हुआ है, Google ने Android ViewPager2 का अल्फा संस्करण जारी किया। इस रिलीज के बारे में अधिक जानकारी यहां पाई जा सकती है । अब देखते हैं कि ViewPager2 क्या है।

नई सुविधाएँ

• दाएं से बाएं तक का समर्थन लेआउट,
• समर्थन ऊर्ध्वाधर अभिविन्यास,
• बेहतर PageChangeListener ।

क्या बदल गया है?

• PagerAdapter को RecyclerView.Adapter द्वारा प्रतिस्थापित किया गया,
• FragmentStatePagerAdapter द्वारा प्रतिस्थापित FragmentStateAdapter।

ViewPager2 Android X के लिए जारी किया गया है, इसलिए यदि आप इसका उपयोग करना चाहते हैं, तो आपके प्रोजेक्ट को Android X का उपयोग करना चाहिए। आइए देखें कि हम इस नए ViewPager2 का उपयोग कैसे कर सकते हैं।

निर्भरता जोड़ें

निम्न निर्भरता अनुप्रयोग स्तर build.gradle फ़ाइल में जोड़ें:

 dependencies { implementation "androidx.viewpager2:viewpager2:1.0.0-alpha01" } 

उसके बाद, अपने प्रोजेक्ट को सिंक्रनाइज़ करें।

समायोजन

अपनी गतिविधि या टुकड़े में ViewPager2 विजेट जोड़ें:

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

चलिए उस पेज के लिए एक लेआउट बनाएँ जो ViewPager2 में प्रदर्शित किया जाएगा:

item_page.xml

 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent"> <androidx.appcompat.widget.AppCompatTextView android:id="@+id/tvTitle" android:textColor="@android:color/white" android:layout_width="wrap_content" android:layout_centerInParent="true" tools:text= "item" android:textSize="32sp" android:layout_height="wrap_content" /> </RelativeLayout> 

अगला हमें ViewPager2 के लिए एक एडेप्टर बनाने की आवश्यकता है। यह सबसे दिलचस्प है। इसके लिए हम RecyclerView.Adapter उपयोग कर सकते हैं। क्या यह अच्छा नहीं है?

ViewPagerAdapter.kt

 class ViewPagerAdapter : RecyclerView.Adapter<PagerVH>() { private val colors = intArrayOf( android.R.color.black, android.R.color.holo_red_light, android.R.color.holo_blue_dark, android.R.color.holo_purple ) override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): PagerVH = PagerVH(LayoutInflater.from(parent.context).inflate(R.layout.item_page, parent, false)) override fun getItemCount(): Int = colors.size override fun onBindViewHolder(holder: PagerVH, position: Int) = holder.itemView.run { tvTitle.text = "item $position" container.setBackgroundResource(colors[position]) } } class PagerVH(itemView: View) : RecyclerView.ViewHolder(itemView) 

यह एक ही एडेप्टर है जिसे हम एक नियमित RecyclerView के लिए उपयोग करते हैं, और यह सिर्फ ViewPager2 के साथ काम करता है।

अंतिम चरण, ViewPager2 के लिए एडेप्टर स्थापित करें:

 class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) viewPager2.adapter = ViewPagerAdapter() } } 

वह सब है! PagerAdapter के साथ पुराने ViewPager का उपयोग करते समय हमें वही परिणाम मिलता है:

लंबवत स्क्रॉलिंग

पहले, आपको ऊर्ध्वाधर स्क्रॉलिंग को लागू करने के लिए तीसरे पक्ष के पुस्तकालयों का उपयोग करना था, क्योंकि अब तक, Google ने इस तरह का अवसर प्रदान नहीं किया है। इस नए ViewPager2 में अब वर्टिकल स्क्रॉलिंग के लिए सपोर्ट है। बस ViewPager2 में अभिविन्यास बदलें और ऊर्ध्वाधर स्क्रॉलिंग सक्षम हो जाएगी। बहुत आसान है!

 viewPager2.orientation = ViewPager2.ORIENTATION_VERTICAL 

यहाँ परिणाम है:

FragmentStateAdapter का उपयोग करना

आप पृष्ठों के रूप में पुराने व्यू पेजर में भी टुकड़ों का उपयोग कर सकते हैं। इसके लिए एक FragmentStateAdapter है। आइए देखें कि हम इसका उपयोग कैसे कर सकते हैं।

सबसे पहले, हमें एक टुकड़ा बनाने की जरूरत है:

 class PagerFragment : Fragment() { override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? { return inflater.inflate(R.layout.item_page, container, false) } override fun onViewCreated(view: View, savedInstanceState: Bundle?) { arguments?.let { container.setBackgroundResource(it.getInt("color")) tvTitle.text = "Item ${it.getInt("position")}" } } } 

अब हम ViewPager2 के लिए एक एडेप्टर बनाएंगे। हम FragmentManager को इसके निर्माता के पास भेजेंगे, जो टुकड़ों का प्रबंधन करेगा:

 class ViewPagerFragmentStateAdapter(fm: FragmentManager) : FragmentStateAdapter(fm) { private val colors = intArrayOf( android.R.color.black, android.R.color.holo_red_light, android.R.color.holo_blue_dark, android.R.color.holo_purple ) override fun getItem(position: Int): Fragment = PagerFragment().apply { arguments = bundleOf( "color" to colors[position], "position" to position ) } override fun getItemCount(): Int = colors.size } 

अब ViewPager2 में इस नए एडेप्टर को स्थापित करें, और आप कर रहे हैं:

 viewPager2.adapter = ViewPagerFragmentStateAdapter(supportFragmentManager) 

बेहतर OnPageChangeCallback

पुराने ViewPager में, OnPageChangeListner इंटरफ़ेस को पेज परिवर्तन / स्क्रॉल ईवेंट प्राप्त करने के लिए डिज़ाइन किया गया था। और यह बहुत असुविधाजनक था, क्योंकि हम सभी तीन तरीकों ( onPageScrollStateChanged , onPageScrolled , onPageSelected ) को ओवरराइड करना चाहते थे, भले ही हम नहीं करना चाहते थे।

 oldViewPager.addOnPageChangeListener(object:ViewPager.OnPageChangeListener{ override fun onPageScrollStateChanged(state: Int) { //   } override fun onPageScrolled(position: Int, positionOffset: Float, positionOffsetPixels: Int) { //   } override fun onPageSelected(position: Int) { // ,    } }) 

अब हमारे पास OnPageChangeCallback , एक अमूर्त वर्ग है जिसमें गैर-अमूर्त विधियां हैं। जिसका शाब्दिक अर्थ है कि हमें इन सभी तरीकों को फिर से परिभाषित करने की आवश्यकता नहीं है, हम केवल उन लोगों को फिर से परिभाषित कर सकते हैं जिनकी हमें आवश्यकता है या जिन्हें हम उपयोग करना चाहते हैं। इसलिए, उदाहरण के लिए, हम पृष्ठ परिवर्तन की घटनाओं को ट्रैक कर सकते हैं:

 viewPager2.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() { override fun onPageSelected(position: Int) { super.onPageSelected(position) //    } }) 

चेतावनी!

चूंकि ViewPager2 अल्फा संस्करण में है, इसलिए पुराने ViewPager के कुछ कार्य हैं जो अभी तक लागू नहीं हुए हैं या इस संस्करण में ठीक से काम नहीं करते हैं।

प्रलेखन के अनुसार ज्ञात मुद्दे:

• ClipToPadding,
• TabLayout के साथ कोई एकीकरण नहीं,
• स्क्रीन के बाहर कोई नियंत्रण नहीं है,
• पृष्ठ की चौड़ाई सेट नहीं की जा सकती (डिफ़ॉल्ट रूप से 100%)

ज्ञात मुद्दों के बारे में अधिक जानकारी यहाँ है । मुझे उम्मीद है कि यह सब अगले अपडेट में तय हो जाएगा। मैं इस नए ViewPager2 के एक स्थिर संस्करण का इंतजार कर रहा हूं। तब तक, सभी के लिए अच्छा कोड!