ViewPager থেকে ViewPager2 এ স্থানান্তর করুন

ViewPager2 হল ViewPager লাইব্রেরির একটি উন্নত সংস্করণ যা উন্নত কার্যকারিতা অফার করে এবং ViewPager ব্যবহার করার ক্ষেত্রে সাধারণ অসুবিধাগুলি সমাধান করে। যদি আপনার অ্যাপ ইতিমধ্যেই ViewPager ব্যবহার করে, তাহলে ViewPager2 এ স্থানান্তরিত করার বিষয়ে আরও জানতে এই পৃষ্ঠাটি পড়ুন।

আপনি যদি আপনার অ্যাপে ViewPager2 ব্যবহার করতে চান এবং বর্তমানে ViewPager ব্যবহার করছেন না, তাহলে আরও তথ্যের জন্য ViewPager2 ব্যবহার করে খণ্ডের মধ্যে স্লাইড পড়ুন এবং ViewPager2 ব্যবহার করে ট্যাবগুলির সাথে সোয়াইপ ভিউ তৈরি করুন ।

ViewPager2 এ স্থানান্তরিত করার সুবিধা

মাইগ্রেট করার প্রাথমিক কারণ হল ViewPager2 সক্রিয় ডেভেলপমেন্ট সাপোর্ট পাচ্ছে এবং ViewPager পাচ্ছে না। যাইহোক, ViewPager2 এছাড়াও অন্যান্য নির্দিষ্ট সুবিধা প্রদান করে।

উল্লম্ব অভিযোজন সমর্থন

ViewPager2 ঐতিহ্যগত অনুভূমিক পেজিং ছাড়াও উল্লম্ব পেজিং সমর্থন করে। আপনি একটি ViewPager2 উপাদানের জন্য android:orientation বৈশিষ্ট্য সেট করে উল্লম্ব পেজিং সক্ষম করতে পারেন:

<androidx.viewpager2.widget.ViewPager2
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/pager"
    android:orientation="vertical" />

আপনি setOrientation() পদ্ধতি ব্যবহার করে প্রোগ্রামগতভাবে এই বৈশিষ্ট্যটি সেট করতে পারেন।

ডান থেকে বামে সমর্থন

ViewPager2 ডান-থেকে-বামে (RTL) পেজিং সমর্থন করে। RTL পেজিং স্বয়ংক্রিয়ভাবে সক্রিয় করা হয় যেখানে লোকেলের উপর ভিত্তি করে উপযুক্ত হয়, কিন্তু আপনি নিজেও একটি ViewPager2 উপাদানের জন্য এটির android:layoutDirection বৈশিষ্ট্য সেট করে RTL পেজিং সক্ষম করতে পারেন:

<androidx.viewpager2.widget.ViewPager2
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/pager"
    android:layoutDirection="rtl" />

আপনি setLayoutDirection() পদ্ধতি ব্যবহার করে প্রোগ্রাম্যাটিকভাবে এই বৈশিষ্ট্যটি সেট করতে পারেন।

পরিবর্তনযোগ্য খণ্ড সংগ্রহ

ViewPager2 খণ্ডের একটি পরিবর্তনযোগ্য সংগ্রহের মাধ্যমে পেজিং সমর্থন করে, যখন অন্তর্নিহিত সংগ্রহ পরিবর্তন হয় তখন UI আপডেট করতে notifyDatasetChanged() কল করে।

এর মানে হল যে আপনার অ্যাপ রানটাইমে খণ্ড সংগ্রহকে গতিশীলভাবে পরিবর্তন করতে পারে এবং ViewPager2 সঠিকভাবে পরিবর্তিত সংগ্রহ প্রদর্শন করবে।

ডিফইউটিল

ViewPager2 RecyclerView তে তৈরি করা হয়েছে, যার মানে এটি DiffUtil ইউটিলিটি ক্লাসে অ্যাক্সেস করেছে। এর ফলে বেশ কিছু সুবিধা পাওয়া যায়, কিন্তু সবচেয়ে উল্লেখযোগ্যভাবে এর মানে হল যে ViewPager2 অবজেক্টগুলি নেটিভভাবে RecyclerView ক্লাস থেকে ডেটাসেট পরিবর্তন অ্যানিমেশনের সুবিধা নেয়।

আপনার অ্যাপটি ViewPager2 এ স্থানান্তর করুন

আপনার অ্যাপের ViewPager অবজেক্টগুলিকে ViewPager2 তে আপডেট করতে এই পদক্ষেপগুলি অনুসরণ করুন:

XML লেআউট ফাইল আপডেট করুন

প্রথমে, আপনার XML লেআউট ফাইলের ViewPager উপাদানগুলিকে ViewPager2 উপাদান দিয়ে প্রতিস্থাপন করুন: 

<!-- A ViewPager element -->
<android.support.v4.view.ViewPager
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<!-- A ViewPager2 element -->
<androidx.viewpager2.widget.ViewPager2
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

অ্যাডাপ্টারের ক্লাস আপডেট করুন

ViewPager ব্যবহার করার সময়, আপনাকে অ্যাডাপ্টার ক্লাস প্রসারিত করতে হয়েছিল যা বস্তুতে নতুন পৃষ্ঠাগুলি সরবরাহ করে। ব্যবহারের ক্ষেত্রে নির্ভর করে, ViewPager তিনটি ভিন্ন বিমূর্ত ক্লাস ব্যবহার করেছে। ViewPager2 শুধুমাত্র দুটি বিমূর্ত ক্লাস ব্যবহার করে।

প্রতিটি ViewPager অবজেক্টের জন্য আপনি একটি ViewPager2 অবজেক্টে রূপান্তর করছেন, নিম্নরূপ উপযুক্ত বিমূর্ত শ্রেণী প্রসারিত করতে অ্যাডাপ্টার ক্লাস আপডেট করুন:

  • ViewPager যখন ভিউয়ের মাধ্যমে পেজে PagerAdapter ব্যবহার করে, তখন ViewPager2 এর সাথে RecyclerView.Adapter ব্যবহার করুন।
  • যখন ViewPager একটি ছোট, নির্দিষ্ট সংখ্যক খণ্ডের মাধ্যমে পৃষ্ঠায় FragmentPagerAdapter ব্যবহার করে, ViewPager2 এর সাথে FragmentStateAdapter ব্যবহার করুন।
  • যখন ViewPager একটি বড় বা অজানা সংখ্যক ফ্র্যাগমেন্টের মাধ্যমে পৃষ্ঠায় FragmentStatePagerAdapter ব্যবহার করে, ViewPager2 এর সাথে FragmentStateAdapter ব্যবহার করুন।

কনস্ট্রাক্টর পরামিতি

FragmentPagerAdapter বা FragmentStatePagerAdapter থেকে উত্তরাধিকারসূত্রে পাওয়া ফ্র্যাগমেন্ট-ভিত্তিক অ্যাডাপ্টার ক্লাস সবসময় একটি একক FragmentManager অবজেক্টকে কনস্ট্রাক্টর প্যারামিটার হিসেবে গ্রহণ করে। আপনি যখন একটি ViewPager2 অ্যাডাপ্টার ক্লাসের জন্য FragmentStateAdapter প্রসারিত করেন, আপনার পরিবর্তে কনস্ট্রাক্টর প্যারামিটারগুলির জন্য নিম্নলিখিত বিকল্পগুলি থাকে:

  • FragmentActivity অবজেক্ট বা Fragment অবজেক্ট যেখানে ViewPager2 অবজেক্ট থাকে। বেশিরভাগ ক্ষেত্রে, এটি আরও ভাল বিকল্প।
  • একটি FragmentManager অবজেক্ট এবং একটি Lifecycle অবজেক্ট।

RecyclerView.Adapter থেকে সরাসরি প্রাপ্ত ভিউ-ভিত্তিক অ্যাডাপ্টার ক্লাসের জন্য কনস্ট্রাক্টর প্যারামিটারের প্রয়োজন হয় না।

ওভাররাইড পদ্ধতি

আপনার অ্যাডাপ্টার ক্লাসগুলিকে ViewPager2 এর জন্য বিভিন্ন পদ্ধতি ওভাররাইড করতে হবে যা তারা ViewPager এর জন্য করেছিল:

  • getCount() এর পরিবর্তে getItemCount() ওভাররাইড করুন। নাম ব্যতীত, এই পদ্ধতি অপরিবর্তিত।
  • getItem() এর পরিবর্তে, ফ্র্যাগমেন্ট-ভিত্তিক অ্যাডাপ্টার ক্লাসে createFragment() ওভাররাইড করুন। নিশ্চিত করুন যে আপনার নতুন createFragment() পদ্ধতিটি প্রতিবার দৃষ্টান্ত পুনঃব্যবহারের পরিবর্তে ফাংশনটি কল করার সময় সর্বদা একটি নতুন খণ্ড দৃষ্টান্ত সরবরাহ করে।

সারাংশ

সংক্ষেপে, ViewPager2 এর সাথে ব্যবহারের জন্য একটি ViewPager অ্যাডাপ্টার ক্লাস রূপান্তর করতে, আপনাকে অবশ্যই নিম্নলিখিত পরিবর্তনগুলি করতে হবে:

  1. ভিউ এর মাধ্যমে পেজ করার জন্য সুপারক্লাস RecyclerView.Adapter এ পরিবর্তন করুন অথবা ফ্র্যাগমেন্টের মাধ্যমে পেজ করার জন্য FragmentStateAdapter এ পরিবর্তন করুন।
  2. ফ্র্যাগমেন্ট-ভিত্তিক অ্যাডাপ্টার ক্লাসে কনস্ট্রাক্টর প্যারামিটার পরিবর্তন করুন।
  3. getCount() এর পরিবর্তে getItemCount() ওভাররাইড করুন।
  4. ফ্র্যাগমেন্ট-ভিত্তিক অ্যাডাপ্টার ক্লাসে getItem() এর পরিবর্তে createFragment() ওভাররাইড করুন।

কোটলিন 

// A simple ViewPager adapter class for paging through fragments
class ScreenSlidePagerAdapter(fm: FragmentManager) : FragmentStatePagerAdapter(fm) {
    override fun getCount(): Int = NUM_PAGES

    override fun getItem(position: Int): Fragment = ScreenSlidePageFragment()
}

// An equivalent ViewPager2 adapter class
class ScreenSlidePagerAdapter(fa: FragmentActivity) : FragmentStateAdapter(fa) {
    override fun getItemCount(): Int = NUM_PAGES

    override fun createFragment(position: Int): Fragment = ScreenSlidePageFragment()
}

জাভা 

// A simple ViewPager adapter class for paging through fragments
public class ScreenSlidePagerAdapter extends FragmentStatePagerAdapter {
    public ScreenSlidePagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        return new ScreenSlidePageFragment();
    }

    @Override
    public int getCount() {
        return NUM_PAGES;
    }
}

// An equivalent ViewPager2 adapter class
private class ScreenSlidePagerAdapter extends FragmentStateAdapter {
    public ScreenSlidePagerAdapter(FragmentActivity fa) {
        super(fa);
    }

    @Override
    public Fragment createFragment(int position) {
        return new ScreenSlidePageFragment();
    }

    @Override
    public int getItemCount() {
        return NUM_PAGES;
    }
}

রিফ্যাক্টর ট্যাবলেআউট ইন্টারফেস

ViewPager2 TabLayout ইন্টিগ্রেশনে পরিবর্তন আনে। আপনি যদি বর্তমানে নেভিগেশনের জন্য অনুভূমিক ট্যাবগুলি প্রদর্শন করতে একটি TabLayout অবজেক্টের সাথে একটি ViewPager ব্যবহার করেন, তাহলে ViewPager2 এর সাথে একীকরণের জন্য আপনাকে TabLayout অবজেক্টটিকে রিফ্যাক্টর করতে হবে।

TabLayout ViewPager2 থেকে ডিকপল করা হয়েছে এবং এখন উপাদান উপাদানের অংশ হিসেবে উপলব্ধ। এর মানে হল এটি ব্যবহার করার জন্য, আপনাকে আপনার build.gradle ফাইলে উপযুক্ত নির্ভরতা যোগ করতে হবে:

গ্রোভি 

implementation "com.google.android.material:material:1.1.0-beta01"

কোটলিন

implementation("com.google.android.material:material:1.1.0-beta01")

এছাড়াও আপনাকে আপনার XML বিন্যাস ফাইলের অনুক্রমের মধ্যে TabLayout উপাদানের অবস্থান পরিবর্তন করতে হবে। ViewPager এর সাথে, TabLayout উপাদানটিকে ViewPager এলিমেন্টের একটি চাইল্ড হিসেবে ঘোষণা করা হয়; কিন্তু ViewPager2 এর সাথে, TabLayout উপাদানটি একই স্তরে ViewPager2 উপাদানের উপরে সরাসরি ঘোষণা করা হয়:

<!-- A ViewPager element with a TabLayout -->
<androidx.viewpager.widget.ViewPager
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</androidx.viewpager.widget.ViewPager>

<!-- A ViewPager2 element with a TabLayout -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

</LinearLayout>

অবশেষে, আপনাকে অবশ্যই সেই কোডটি আপডেট করতে হবে যা ViewPager অবজেক্টে TabLayout অবজেক্টকে সংযুক্ত করে। ViewPager সাথে সংহত করার জন্য TabLayout তার নিজস্ব setupWithViewPager() পদ্ধতি ব্যবহার করলে, ViewPager2 সাথে সংহত করার জন্য এটির একটি TabLayoutMediator উদাহরণ প্রয়োজন।

TabLayoutMediator অবজেক্ট TabLayout অবজেক্টের জন্য পৃষ্ঠা শিরোনাম তৈরি করার কাজটিও পরিচালনা করে, যার মানে হল অ্যাডাপ্টার ক্লাসের getPageTitle() ওভাররাইড করার প্রয়োজন নেই :

কোটলিন 

// Integrating TabLayout with ViewPager
class CollectionDemoFragment : Fragment() {
    ...
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        val tabLayout = view.findViewById(R.id.tab_layout)
        tabLayout.setupWithViewPager(viewPager)
    }
    ...
}

class DemoCollectionPagerAdapter(fm: FragmentManager) : FragmentStatePagerAdapter(fm) {

    override fun getCount(): Int  = 4

    override fun getPageTitle(position: Int): CharSequence {
        return "OBJECT ${(position + 1)}"
    }
    ...
}

// Integrating TabLayout with ViewPager2
class CollectionDemoFragment : Fragment() {
    ...
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        val tabLayout = view.findViewById(R.id.tab_layout)
        TabLayoutMediator(tabLayout, viewPager) { tab, position ->
            tab.text = "OBJECT ${(position + 1)}"
        }.attach()
    }
    ...
}

জাভা 

// Integrating TabLayout with ViewPager
public class CollectionDemoFragment extends Fragment {
    ...
    @Override
    public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
        TabLayout tabLayout = view.findViewById(R.id.tab_layout);
        tabLayout.setupWithViewPager(viewPager);
    }
    ...
}

public class DemoCollectionPagerAdapter extends FragmentStatePagerAdapter {
    ...
    @Override
    public int getCount() {
        return 4;
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return "OBJECT " + (position + 1);
    }
    ...
}

// Integrating TabLayout with ViewPager2
public class CollectionDemoFragment : Fragment() {
    ...
    @Override
    public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
        TabLayout tabLayout = view.findViewById(R.id.tab_layout);
        new TabLayoutMediator(tabLayout, viewPager,
                (tab, position) -> tab.setText("OBJECT " + (position + 1))
        ).attach();
    }
    ...
}

নেস্টেড স্ক্রোলযোগ্য উপাদান সমর্থন করে

ViewPager2 নেটিভভাবে নেস্টেড স্ক্রোল ভিউ সমর্থন করে না এমন ক্ষেত্রে যেখানে স্ক্রোল ভিউতে ViewPager2 অবজেক্টের মতো একই অভিযোজন রয়েছে যা এটি ধারণ করে। উদাহরণস্বরূপ, একটি উল্লম্ব-ভিত্তিক ViewPager2 অবজেক্টের ভিতরে উল্লম্ব স্ক্রোল দৃশ্যের জন্য স্ক্রলিং কাজ করবে না।

একই স্থিতিবিন্যাস সহ একটি ViewPager2 অবজেক্টের ভিতরে একটি স্ক্রোল ভিউ সমর্থন করতে, আপনি যখন এর পরিবর্তে নেস্টেড উপাদানটি স্ক্রোল করার আশা করেন তখন আপনাকে ViewPager2 অবজেক্টে requestDisallowInterceptTouchEvent() কল করতে হবে। ViewPager2 নেস্টেড স্ক্রোলিং নমুনা একটি বহুমুখী কাস্টম র‍্যাপার বিন্যাসের সাথে এই সমস্যাটি সমাধান করার একটি উপায় প্রদর্শন করে।

অতিরিক্ত সম্পদ

ViewPager2 সম্পর্কে আরও জানতে, নিম্নলিখিত অতিরিক্ত সংস্থানগুলি দেখুন৷

নমুনা

ভিডিও