Gatonito
Gatonito

Reputation: 2174

How to create ViewPager tabs in Android (modern way)

I sucessfully created my first ViewPager slider. When I went to the creation of the tabs, I've found that this article iws deprecated. I also found that I can use PagerTitleStrip, which worked but its too ugly. I've found a library for customizing it but I needed to learn how to do it the hard way, because I want to understand how Android works. Could somebody help me understanding how it works?

Upvotes: 0

Views: 6692

Answers (3)

Jagjit Singh
Jagjit Singh

Reputation: 1969

try this

TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
        tabLayout.setupWithViewPager(viewPager);

       private void setUpViewPager(ViewPager viewPager)
        {
            Adapter adapter=new Adapter(getSupportFragmentManager());
            adapter.addFragment(new About(),"Article 1");
            adapter.addFragment(new About(),"Article 2");
            adapter.addFragment(new About(),"Article 3");
            viewPager.setAdapter(adapter);
           }

Refer here:https://coderzpassion.com/working-appbarlayout-like-whatsapp/

Upvotes: 1

user1978019
user1978019

Reputation: 3336

Here is a guide on Google's suggested usage of tabs in Material Design.

In particular, the TabLayout class from the support design libraries might be what you're after.

Its defaults are very natural, like shown below (taken from the Material Design link above).

enter image description here

Upvotes: 1

Paras Jain
Paras Jain

Reputation: 49

Try this :- Add the PageTabStrip element as a child of your ViewPager

<android.support.v4.view.ViewPager
    android:id="@+id/myViewPager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_below="@+id/navigation_toolbar">

    <android.support.v4.view.PagerTabStrip
        android:id="@+id/pager_tab"
        style="@style/AppToolbar"
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize"/>

</android.support.v4.view.ViewPager>

Make sure you implement the below method in your Custom Adapter extending FragmentPagerAdapter :

@Override
public CharSequence getPageTitle(int position) {

    switch (position){
        case 0:
            return "Title 1";
        case 1:
            return "Title 2";
        default:
            return "null";
    }

}

Upvotes: 0

Related Questions