BottomNavigation
直接用navigation组件来实现底部的导航栏,而不是借助第三方组件。其本身还是要控制多个fragment之间的切换,只不过这些fragment之间本身并没有父子关系。
现在有一个有三个fragment的demo,每一个fragment都对应着一个viewModel,这直接用as生成即可。
创建三个底部导航栏图标所要用到的矢量图:
创一个menu类型的资源文件,拖动三个Menu Item到其中,并且设置图标。
注意:item的id一定要和navigation文件中的fragment的id相同。
代码如下:
//menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/firstFragment"
android:icon="@drawable/ic_baseline_filter_1_24"
android:title="旋转" />
<item
android:id="@+id/secondFragment"
android:icon="@drawable/ic_baseline_filter_2_24"
android:title="缩放" />
<item
android:id="@+id/thirdFragment"
android:icon="@drawable/ic_baseline_filter_3_24"
android:title="移动" />
</menu>
创建一个navigation的资源文件,用于实现三个fragment之间的切换(尽管目前彼此并没有相互联系):
//navigation.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/navigation"
app:startDestination="@id/firstFragment">
<fragment
android:id="@+id/firstFragment"
android:name="com.shopkeeper.bottomnavigationdemo.FirstFragment"
android:label="旋转"
tools:layout="@layout/first_fragment" />
<fragment
android:id="@+id/secondFragment"
android:name="com.shopkeeper.bottomnavigationdemo.SecondFragment"
android:label="缩放"
tools:layout="@layout/second_fragment" />
<fragment
android:id="@+id/thirdFragment"
android:name="com.shopkeeper.bottomnavigationdemo.ThirdFragment"
android:label="移动"
tools:layout="@layout/third_fragment" />
</navigation>
在activity中配置这个导航栏(暂不知道工作原理):
//mainActivity.java
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
BottomNavigationView bottomNavigationView=findViewById(R.id.bottomNavigationView);
NavController navController= Navigation.findNavController(this,R.id.fragment2);
// AppBarConfiguration configuration=new AppBarConfiguration.Builder(navController.getGraph()).build();
AppBarConfiguration configuration=new AppBarConfiguration.Builder(bottomNavigationView.getMenu()).build();
NavigationUI.setupActionBarWithNavController(this,navController,configuration);
NavigationUI.setupWithNavController(bottomNavigationView,navController);
}