This gist shows an example of how to implement tablayout with viewpager

TabLayout with view pager

Layout

````
 <android.support.design.widget.TabLayout
            android:id="@+id/tabOrderStatus"
            android:layout_width="match_parent"
            android:layout_height="56dp"
            android:background="@color/colorPrimary"
            app:tabGravity="fill"
            app:tabIndicatorColor="@color/colorAccent"
            app:tabIndicatorHeight="2dp"
            app:tabMaxWidth="0dp"
            app:tabMode="scrollable"
            app:tabSelectedTextColor="@color/black_87_percent"
            app:tabTextColor="@color/black_54_percent" />

        <android.support.v4.view.ViewPager
            android:id="@+id/vpOrders"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/mat_bg_color" />
````

Kotlin code

Use same frament multiple times

````
  private lateinit var menuTypeFrags: ArrayList<MenuTypeFragment>
  private lateinit var menusPagerAdapter: FragmentStatePagerAdapter
  
  menuTypeFrags = ArrayList()
  
````
````
     private fun addingTabAndViewPager() {
        menusPagerAdapter = object : FragmentStatePagerAdapter(supportFragmentManager) {
            override fun getItem(position: Int): Fragment {
                return if (position < menuTypeFrags.size) menuTypeFrags[position]
                else MenuTypeFragment.newInstance(MenuType(0, "Invalid", 0, 0, null))
            }

            override fun getCount(): Int {
                return menuTypeFrags.size
            }

            override fun getPageTitle(position: Int): CharSequence? {
                return if (position > -1 && position < menuTypeFrags.size)
                    menuTypeFrags[position].getTitle() else "Invalid Position"
            }

        }
        vpMenus.adapter = menusPagerAdapter
        tabMenuTypes.setupWithViewPager(vpMenus)
    }

````

Mutiple frament per tab

````
private fun addViewPager() {
        val vpFood = findViewById<ViewPager>(R.id.vpFood)

        val adapter = MyFoodPagerAdapter(supportFragmentManager)

        vpFood.adapter = adapter

        vpFood.addOnPageChangeListener(object : ViewPager.OnPageChangeListener {
            override fun onPageScrolled(position: Int, positionOffset: Float, positionOffsetPixels: Int) {}

            override fun onPageSelected(position: Int) {
                vpFoodBottomPane.currentItem = position
            }

            override fun onPageScrollStateChanged(state: Int) {

            }
        })
       
        val tabLayout = findViewById<TabLayout>(R.id.tabsFood)
        tabLayout.setupWithViewPager(vpFood)
    }
    
    private inner class MyFoodPagerAdapter(fm: FragmentManager) : FragmentPagerAdapter(fm) {

        override fun getItem(position: Int): Fragment? {
            when (position) {
                0 -> return FoodDetailsFragment.newInstance()
                1 -> return FoodReviewsFragment.newInstance()
            }
            return null
        }

        override fun getCount(): Int {
            return 2
        }

        override fun getPageTitle(position: Int): CharSequence? {
            when (position) {
                0 -> return getString(R.string.details)
                1 -> return getString(R.string.reviews)
            }
            return null
        }
    }

````