Kotlin Android TabLayout — это макет, который используется для создания горизонтальных вкладок. Вкладки для TabLayout создаются с помощью метода newTab(). Чтобы отобразить эту вкладку поверх макета, нам нужно добавить ее с помощью метода addTab(Tab).
С помощью методов setText(int) и setIcon(int) мы устанавливаем заголовок и иконку TabLayout соответственно.
Мы также можем интегрировать ViewPager с Android TabLayout в Kotlin. ViewPager обеспечивает плавное скольжение вкладок по макету.
Содержание
Пример Kotlin Android TabLayout с ViewPager
В этом примере мы создадим TabLayout с ViewPager в Котлин.
build.gradle
Добавьте следующую зависимость в файл build.gradle.
implementation 'com.android.support:design:26.1.0' implementation 'com.android.support:support-v4:26.1.0'
Activity_main.xml
Добавьте TabLayout и ViewPager в файл activity_main.xml.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="example.javatpoint.com.kotlintablayoutexample.MainActivity">
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#00a294"
app:tabTextColor="@android:color/background_light">
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="@+id/tabLayout">
</android.support.v4.view.ViewPager>
</android.support.constraint.ConstraintLayout>
strings.xml
<resources>
<string name="app_name">Kotlin TabLayout Example</string>
<!-- TODO: Remove or change this placeholder text -->
<string name="home_fragment">Home Fragment</string>
<string name="sport_fragment">Sport Fragment</string>
<string name="movie_fragment">Movie Fragment</string>
</resources>
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="colorPrimary">#03DAC6</color>
<color name="colorPrimaryDark">#aeded9</color>
<color name="colorAccent">#00a294</color>
</resources>
MainActivity.kt
Добавьте следующий код в класс MainActivity.kt. В этом классе новая вкладка создается с помощью метода tabLayout!!.newTab(), и эта вкладка добавляется поверх TabLayout с помощью tabLayout!!.addTab(Tab).
Вызовите прослушиватель addOnPageChangeListener() ViewPager, чтобы загрузить вкладки при изменении страницы.
package example.javatpoint.com.kotlintablayoutexample
import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.support.design.widget.TabLayout
import android.support.v4.view.ViewPager
class MainActivity : AppCompatActivity() {
var tabLayout: TabLayout? = null
var viewPager: ViewPager? = null
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
tabLayout = findViewById<TabLayout>(R.id.tabLayout)
viewPager = findViewById<ViewPager>(R.id.viewPager)
tabLayout!!.addTab(tabLayout!!.newTab().setText("Home"))
tabLayout!!.addTab(tabLayout!!.newTab().setText("Sport"))
tabLayout!!.addTab(tabLayout!!.newTab().setText("Movie"))
tabLayout!!.tabGravity = TabLayout.GRAVITY_FILL
val adapter = MyAdapter(this, supportFragmentManager, tabLayout!!.tabCount)
viewPager!!.adapter = adapter
viewPager!!.addOnPageChangeListener(TabLayout.TabLayoutOnPageChangeListener(tabLayout))
tabLayout!!.addOnTabSelectedListener(object : TabLayout.OnTabSelectedListener {
override fun onTabSelected(tab: TabLayout.Tab) {
viewPager!!.currentItem = tab.position
}
override fun onTabUnselected(tab: TabLayout.Tab) {
}
override fun onTabReselected(tab: TabLayout.Tab) {
}
})
}
}
MyAdapter.kt
Создайте класс адаптера MyAdapter.kt, расширите класс FragmentPagerAdapter() и верните фрагмент. Добавьте этот класс адаптера поверх ViewPager.
package example.javatpoint.com.kotlintablayoutexample
import android.support.v4.app.FragmentPagerAdapter
import android.content.Context;
import android.support.v4.app.Fragment
import android.support.v4.app.FragmentManager
class MyAdapter(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 -> {
// val homeFragment: HomeFragment = HomeFragment()
return HomeFragment()
}
1 -> {
return SportFragment()
}
2 -> {
// val movieFragment = MovieFragment()
return MovieFragment()
}
else -> return null
}
}
// this counts total number of tabs
override fun getCount(): Int {
return totalTabs
}
}
Создайте фрагмент как New -> Fragment -> Fragment(Blank).
fragment_home.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textSize="20sp"
android:text="@string/home_fragment" />
</FrameLayout>
HomeFragment.kt
package example.javatpoint.com.kotlintablayoutexample
import android.os.Bundle
import android.support.v4.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
class HomeFragment : Fragment() {
override fun onCreateView(inflater: LayoutInflater?, container: ViewGroup?,
savedInstanceState: Bundle?): View? {
// Inflate the layout for this fragment
return inflater!!.inflate(R.layout.fragment_home, container, false)
}
}// Required empty public constructor
fragment_sport.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textSize="20sp"
android:text="@string/sport_fragment" />
</FrameLayout>
SportFragment.kt
package example.javatpoint.com.kotlintablayoutexample
import android.os.Bundle
import android.support.v4.app.Fragment
import android.view.ViewGroup
import android.view.LayoutInflater
import android.view.View
class SportFragment : Fragment() {
override fun onCreateView(inflater: LayoutInflater?, container: ViewGroup?,
savedInstanceState: Bundle?): View? {
// Inflate the layout for this fragment
return inflater!!.inflate(R.layout.fragment_sport, container, false)
}
}// Required empty public constructor Required empty public constructor
fragment_movie.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="example.javatpoint.com.kotlintablayoutexample.MovieFragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textSize="20sp"
android:text="@string/movie_fragment" />
</FrameLayout>
MovieFragment.kt
package example.javatpoint.com.kotlintablayoutexample
import android.os.Bundle
import android.support.v4.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
class MovieFragment : Fragment() {
override fun onCreateView(inflater: LayoutInflater?, container: ViewGroup?,
savedInstanceState: Bundle?): View? {
// Inflate the layout for this fragment
return inflater!!.inflate(R.layout.fragment_movie, container, false)
}
}// Required empty public constructor
Вывод:
