Tab Activiti in ANDROID STUDIO

TAB ACTIVITY USED IN WHATSAPP

to create this kind of activity in android studio

1)tablayout

2)viewpager

3) pageradapter thats it.

in xml file put tablayout having appbarlayout as parent. as shown below

and add the tab items how much you wanted to like below.

and after appbarlayout add a viewpager(placed below the appbar layout)

<com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
      

        <com.google.android.material.tabs.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/colorPrimary"
            app:tabTextColor="@color/white"
            >
            <com.google.android.material.tabs.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="PROGRAM"
                android:id="@+id/pro"
                android:layout_marginStart="10dp"
                />
            <com.google.android.material.tabs.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="THEORY"
                android:id="@+id/the"
                android:layout_marginStart="10dp"
                />
        </com.google.android.material.tabs.TabLayout>
    </com.google.android.material.appbar.AppBarLayout>
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

now create the pager adapter

it is a class which extends the class FragmentPagerAdapter

for tabbed activity you need to implement two member function of this class which are

1)fun getitem(position:int):Fragment{}=it will return the specified fragment according to the tab’s position

2)fun getcount():Int{}=it will return the total number of tabs

we will pass context ,fragment manager and number of tabs as value parameters

class PagerAdapter(private val myContext: Context, fm: FragmentManager, internal var totalTabs: Int) : FragmentPagerAdapter(fm) {
    // this is for fragment tabs
    override fun getItem(position: Int): Fragment {
        when (position) {
            0 -> {
                return Program()
            }
            1 -> {
                return Theorey()
            }
            else->return Theorey()
        }
    }
    // this counts total number of tabs
    override fun getCount(): Int {
        return totalTabs
    }
}

finally the main activity where we iniatilze the tablayout and viewpager

and set the adapter to the viewpager.

then call the addonpagechangelistener function which will update the tabs whenever you swipe the fragment.

also call the addontabselectedlistener this listener will help to mention what will happen when we update the tab.

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val viewPager: ViewPager = findViewById(R.id.view_pager)
        val tabs: TabLayout = findViewById(R.id.tabs)
        viewPager.adapter = MyAdapter(this, supportFragmentManager,tabs.tabCount)
        viewPager.addOnPageChangeListener(TabLayout.TabLayoutOnPageChangeListener(tabs))
        tabs.addOnTabSelectedListener(object : TabLayout.OnTabSelectedListener{
            override fun onTabReselected(tab: TabLayout.Tab?) {
            }
            override fun onTabUnselected(tab: TabLayout.Tab?) {
            }
            override fun onTabSelected(tab: TabLayout.Tab?) {
                viewPager.currentItem=tab!!.position
            }

        })
}

now create the fragments as shown in exapmle i have two fragments

Program and theory