Exploring all about ViewPager in Android

What is Viewpager?

ViewPager in Android allows the user to flip left and right through pages of data. In our android ViewPager application, we’ll implement a ViewPager that swipes through three views.

Now things are that ViewPager has been in the market for a long time but Now what latest we use is ViewPager2 .Although the purpose is the same there are various points that one should consider as updates and user ViewPager2.Here are listed a few

• ViewPager2 now based on a RecyclerView, so we should get better efficiency.
• Vertical orientation support, thanks to LayoutManagers from RecyclerView.
• There is only one type of adapter now called FragmentStateAdapter, which corresponds to FragmentStatePagerAdapter from old ViewPager.
• DiffUtil for dataset changes in views.
• RTL support out of the box.
• ItemDecoration from RecyclerView is also available.
• MarginPageTransformer and CompositePageTransformer should ease the application of custom page transformations.
• With LinearSnapHelper and custom PageTransformer it is much easier to create a carousel view with the next and previous items partially visible.

Now let’s understand with a simple example

Setting Up

Make sure your project is migrated to AndroidX. Add viewpager2 dependency in your app build.gradle file.

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

Next, add the ViewPager2 widget to your layout file.

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

ViewPager2 needs an adapter. For this, we can either use RecyclerView.Adapter or FragmentStateAdapter which supports fragments out of the box. We will use FragmentStateAdapter for now.

class UserAdapter(private val userList: ArrayList<String>,                fragmentManger: FragmentManager): FragmentStateAdapter(fragmentManger) {    override fun getItem(position: Int): Fragment {
        return UserFragment.getInstance(userList[position])
    }    override fun getItemCount(): Int {
        return userList.size
    }}

Now we need to create a fragment that our Adapter will use. We will pass a name to UserFragment as an argument.

class UserFragment : Fragment() {
    private var mUserView: TextView? = null
    companion object {
        fun getInstance(name: String): Fragment {
           val fragment = UserFragment()
           val arg = Bundle()
           arg.putString("name", name)
           fragment.arguments = arg
            return fragment
        }
    }
    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.fragment_user, container, false)
    }    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        mUserView = view.findViewById(R.id.user_name)
        val name = arguments?.getString("name")
        mUserView?.text = "Hello $name"
    }
}

The last step is to attach the adapter to our viewpager2 earlier.

class MainActivity : AppCompatActivity() {    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val viewPager = findViewById<ViewPager2>(R.id.view_pager)
        val userList = arrayListOf("John", "Doe", "Foo", "Bar")
        viewPager.orientation = ViewPager2.ORIENTATION_HORIZONTAL
        viewPager.adapter = UserAdapter(userList, supportFragmentManager)
    }
}

Ta-da!! that was a simple and latest way of using Viewpager in your app .SO try it and have fun. keep Coding!!