Tablayout with viewpager in kotlin

It is in android for swipe the tabs smoothly

Creating activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context=".activity.OrdersScreen">
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">


        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/rounded_corners_background"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" >
            <com.google.android.material.tabs.TabLayout
                android:id="@+id/tabs"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="40dp"
                android:layout_marginEnd="12dp"
                app:tabIndicatorColor="@color/white"
                android:background="#2178AE"
                app:tabSelectedTextColor="@color/white"
                app:tabTextColor="@android:color/white" />
        </androidx.appcompat.widget.Toolbar>


    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/toolbar">
    </androidx.viewpager.widget.ViewPager>


    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomnavigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        app:itemBackground="@color/white"
        app:itemIconTint="@color/black"
        app:itemTextColor="@android:color/black"
        app:menu="@menu/bottom_navigation_menu" />

</RelativeLayout>
</layout>


Creating Framents like Instants fragment,generaldelivery fragment,self pickup fragment

Instants fragment.xml

general delivery fragment.xml

self pickup fragment.xml

Creating ViewPager adapter

package com.example.vendorapp.adapters
import androidx.fragment.app.Fragment
import androidx.fragment.app.FragmentManager
import androidx.fragment.app.FragmentStatePagerAdapter

class ViewPagerAdapter(supportFragmentManager: FragmentManager) :
    FragmentStatePagerAdapter(supportFragmentManager) {

    // declare arrayList to contain fragments and its title
    private val mFragmentList = ArrayList<Fragment>()
    private val mFragmentTitleList = ArrayList<String>()

    override fun getItem(position: Int): Fragment {
        // return a particular fragment page
        return mFragmentList[position]
    }

    override fun getCount(): Int {
        // return the number of tabs
        return mFragmentList.size
    }

    override fun getPageTitle(position: Int): CharSequence{
        // return title of the tab
        return mFragmentTitleList[position]
    }

    fun addFragment(fragment: Fragment, title: String) {
        // add each fragment and its title to the array list
        mFragmentList.add(fragment)
        mFragmentTitleList.add(title)
    }
}


Main activity code in Kotlin


package com.example.vendorapp.activity

import android.annotation.SuppressLint
import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.appcompat.widget.Toolbar
import androidx.viewpager.widget.ViewPager
import com.example.vendorapp.R
import com.example.vendorapp.adapters.ViewPagerAdapter
import com.example.vendorapp.databinding.ActivityOrdersScreenBinding
import com.example.vendorapp.fragements.GeneralDeliveryFragment
import com.example.vendorapp.fragements.InstantsFragment
import com.example.vendorapp.fragements.SelfPickupFragment
import com.example.vendorapp.utils.SharedPreference
import com.google.android.material.tabs.TabLayout

@SuppressLint("Registered")
private lateinit var ordersBinding: ActivityOrdersScreenBinding
class OrdersScreen : AppCompatActivity() {
    private lateinit var sharedPreference: SharedPreference
    private lateinit var pager: ViewPager // creating object of ViewPager
    private lateinit var tab: TabLayout  // creating object of TabLayout
    private lateinit var bar: Toolbar   // creating object of ToolBar

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
       // sharedPreference = SharedPreference(this)
        ordersBinding = ActivityOrdersScreenBinding.inflate(layoutInflater)
        setContentView(ordersBinding.root)
        pager = findViewById(R.id.viewPager)
        tab = findViewById(R.id.tabs)
        bar = findViewById(R.id.toolbar)
        // To make our toolbar show the application
        // we need to give it to the ActionBar
        setSupportActionBar(bar)
        // Initializing the ViewPagerAdapter
        val adapter = ViewPagerAdapter(supportFragmentManager)
        // add fragment to the list
        adapter.addFragment(InstantsFragment(), "Instant")
        adapter.addFragment(GeneralDeliveryFragment(), "General Delivery")
        adapter.addFragment(SelfPickupFragment(), "Self Pickup")


        // Adding the Adapter to the ViewPager
        pager.adapter = adapter
        // bind the viewPager with the TabLayout.
        tab.setupWithViewPager(pager)
    }
}


Sign In or Register to comment.