Android BottomNavigationView的最新用法
Android 的技术更新的太快了，比如：kotlin、jetpack 等等，要学习的东西实在是太多了，今天我就来介绍一下 BottomNavigationView 的最新用法以及注意事项。
先来看一下效果图吧：
一、导入需要的依赖包
在 app 的 build.gradle 文件中导入以下依赖包：
implementation 'com.google.android.material:material:1.2.1'implementation 'androidx.navigation:navigation-fragment-ktx:2.3.1'
implementation 'androidx.navigation:navigation-ui-ktx:2.3.1'二、创建 activity_main.xml
在 res 目录下的 layout 目录创建 activity_main.xml，如：
<?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"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="?attr/actionBarSize">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/bottom_nav_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="?android:attr/windowBackground"
app:labelVisibilityMode="labeled"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="@menu/bottom_nav_menu" />
<androidx.fragment.app.FragmentContainerView
android:id="@+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="@id/bottom_nav_view"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="@navigation/nav_graph" />
</androidx.constraintlayout.widget.ConstraintLayout>app:menu="@menu/bottom_nav_menu" 需要添加一个导航菜单布局（即：底部导航）
app:navGraph="@navigation/nav_graph" 需要添加一个导航图布局（即：所有的fragment）
> 注意：
> BottomNavigationView 中 labelVisibilityMode 属性的用法，设置 app:labelVisibilityMode="labeled" 可以将图标和文字全部展示出来。
三、创建 bottom_nav_menu.xml
在 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_24"
android:title="首页" />
<item
android:id="@+id/navigation_contact"
android:icon="@drawable/ic_contact"
android:title="联系人" />
<item
android:id="@+id/navigation_find"
android:icon="@drawable/ic_find_24"
android:title="发现" />
<item
android:id="@+id/navigation_mine"
android:icon="@drawable/ic_mine_24"
android:title="我" />
</menu>> 注意：
> item 的 id 名称 一定要和 nav_graph.xml 中 fragment 的 id 名称保持一致，否则无法切换 tab
四、创建 nav_graph.xml
在 res 目录下的 navigation 目录创建 nav_graph.xml，如：
<?xml version="1.0" encoding="utf-8"?>
<navigation 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/mobile_navigation"
app:startDestination="@+id/navigation_home">
<fragment
android:id="@+id/navigation_home"
android:name="com.pzj.android_bottomnavigationview.ui.home.HomeFragment"
android:label="首页"
tools:layout="@layout/fragment_home" />
<fragment
android:id="@+id/navigation_contact"
android:name="com.pzj.android_bottomnavigationview.ui.contact.ContactFragment"
android:label="联系人"
tools:layout="@layout/fragment_contact" />
<fragment
android:id="@+id/navigation_find"
android:name="com.pzj.android_bottomnavigationview.ui.find.FindFragment"
android:label="发现"
tools:layout="@layout/fragment_find" />
<fragment
android:id="@+id/navigation_mine"
android:name="com.pzj.android_bottomnavigationview.ui.mine.MineFragment"
android:label="我"
tools:layout="@layout/fragment_mine" />
</navigation>> 注意：
> fragment 的 id 名称 一定要和 bottom_nav_menu.xml 中 item 的 id 名称保持一致，否则无法切换 tab
五、创建 MainActivity.kt
package com.pzj.android_bottomnavigationview
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import androidx.navigation.fragment.NavHostFragment
import androidx.navigation.ui.AppBarConfiguration
import androidx.navigation.ui.setupActionBarWithNavController
import androidx.navigation.ui.setupWithNavController
import kotlinx.android.synthetic.main.activity_main.*
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
// 获取 NavHostFragment
val navHostFragment: NavHostFragment =
supportFragmentManager.findFragmentById(R.id.nav_host_fragment) as NavHostFragment
// 获取 NavController
val navController = navHostFragment.navController
// 配置 AppBar
val appBarConfiguration = AppBarConfiguration(
setOf(
R.id.navigation_home,
R.id.navigation_contact,
R.id.navigation_find,
R.id.navigation_mine
)
)
// 将 ActionBar 与导航控制器进行关联，使之到达切换 tab 的时候标题跟随改变的效果
setupActionBarWithNavController(navController, appBarConfiguration)
// 设置导航控制器
bottom_nav_view.setupWithNavController(navController)
}
}六、总结注意事项
- 注意 BottomNavigationView 中 labelVisibilityMode 属性的用法，设置 app:labelVisibilityMode=“labeled” 可以将图标和文字全部展示出来。
- 注意 bottom_nav_menu.xml 中 item 的 id 名称一定要和 nav_graph.xml 中 fragment 的 id 名称保持一致，否则无法切换 tab。
- 注意 nav_graph.xml 中 fragment 的 id 名称一定要和 bottom_nav_menu.xml 中 item 的 id 名称保持一致，否则无法切换 tab。
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2020-11-01，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录
腾讯云开发者
