android BottomNavigationView 简单使用
首先需要在(app)build.gradle 的dependencies里面引入
implementation 'com.google.android.material:material:1.0.0'
新建MainActivity找到对应的xml 加入viewpager 和 BottomNavigationView
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.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:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <androidx.viewpager.widget.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toTopOf="@id/nav_view"/> <com.google.android.material.bottomnavigation.BottomNavigationView android:id="@+id/nav_view" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginEnd="0dp" android:layout_marginStart="0dp" android:background="?android:attr/windowBackground" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:menu="@menu/bottom_nav_menu"/> </androidx.constraintlayout.widget.ConstraintLayout>
在res-menu 文件夹下新建 bottom_nav_menu.xml
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/navigation_home" android:icon="@drawable/ic_home_black_24dp" android:title="@string/title_home"/> <item android:id="@+id/navigation_dashboard" android:icon="@drawable/ic_dashboard_black_24dp" android:title="@string/title_dashboard"/> <item android:id="@+id/navigation_notifications" android:icon="@drawable/ic_notifications_black_24dp" android:title="@string/title_notifications"/> </menu>
重写 MyPagerAdapter
import androidx.fragment.app.Fragment import androidx.fragment.app.FragmentManager import androidx.fragment.app.FragmentPagerAdapter class MyPagerAdapter(fm: FragmentManager,val fts:List<Fragment>) : FragmentPagerAdapter(fm) { override fun getItem(position: Int): Fragment { return fts[position] } override fun getCount(): Int { return fts.size } }
新建fragment 页面xml 就一个TextView就不贴了(这里就用一个fragment模拟一下,实际应该建立多个fragment类)
class HomeFragment : Fragment() { private var param: String? = null private lateinit var baseView:View override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) arguments?.let { param = it.getString("param") } } override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? { baseView = inflater.inflate(R.layout.fragment_home, container, false) baseView.text.text = param return baseView } }
现在开始在 MainActivity 写代码了
class MainActivity : AppCompatActivity() { private val onNavigationItemSelectedListener = BottomNavigationView.OnNavigationItemSelectedListener { when(it.itemId){ R.id.navigation_home -> { viewpager.currentItem = 0 return@OnNavigationItemSelectedListener true } R.id.navigation_dashboard -> { viewpager.currentItem = 1 return@OnNavigationItemSelectedListener true } R.id.navigation_notifications -> { viewpager.currentItem = 2 return@OnNavigationItemSelectedListener true } } false } private val onPageChangeListener = object : ViewPager.OnPageChangeListener { override fun onPageScrollStateChanged(state: Int) { } override fun onPageScrolled(position: Int, positionOffset: Float, positionOffsetPixels: Int) { } override fun onPageSelected(position: Int) { when(position){ 0 -> {nav_view.selectedItemId = R.id.navigation_home} 1 -> {nav_view.selectedItemId = R.id.navigation_dashboard} 2 -> {nav_view.selectedItemId = R.id.navigation_notifications} } } } override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) nav_view.setOnNavigationItemSelectedListener(onNavigationItemSelectedListener) val f1 = HomeFragment() var args = Bundle() args.putString("param",getString(R.string.title_home)) f1.arguments = args val f2 = HomeFragment() args = Bundle() args?.putString("param",getString(R.string.title_dashboard)) f2.arguments = args val f3 = HomeFragment() args = Bundle() args?.putString("param",getString(R.string.title_notifications)) f3.arguments = args val fts = listOf(f1, f2, f3) val fm = supportFragmentManager viewpager.adapter = MyPagerAdapter(fm,fts) viewpager.addOnPageChangeListener(onPageChangeListener) } }
你现在可以用app:labelVisibilityMode="[labeled, unlabeled, selected, auto]
不设置默认就是 auto
labeled 所有的标签都是可见的。
unlabeled 只显示图标。
selected 将只显示选定项和移位项的标签。
auto 将根据您拥有的项目数选择“标记”或“选定”。标记为1-3项,选择为3+项。