常用UI架构
第一步:布局文件如下
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<fragment
android:id="@+id/my_nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginBottom="10dp"
android:layout_weight="1"
app:defaultNavHost="true"
app:navGraph="@navigation/main_navigation" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/nv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:itemIconTint="@drawable/main_bottom_navigation"
app:itemTextColor="@drawable/main_bottom_navigation"
app:menu="@menu/navigation" />
</LinearLayout>
其中、main_navigation 如下
内部主要是几个Fragment
<?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/main_navigation.xml"
app:startDestination="@id/fragment_info">
<fragment
android:id="@+id/fragment_info"
android:name="com.example.jetpackdemo.fragment.ShoeFragment"
android:label="fagment_info"
tools:layout="@layout/fragment_shoe" />
<fragment
android:id="@+id/fragment_market"
android:name="com.example.jetpackdemo.fragment.MarketFragment"
android:label="fragment_market3"
tools:layout="@layout/fragment_market" />
<fragment
android:id="@+id/fragment_me"
android:name="com.example.jetpackdemo.fragment.MeFragment"
android:label="fragment_me"
tools:layout="@layout/fragment_me" />
</navigation>
其中、main_bottom_navigation如下:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/colorPrimary" android:state_checked="true"/>
<item android:color="@color/textPrimary" android:state_checked="false"/>
</selector>
其中、menu_main 如下
关键:每一个item的id必须和fragment的id进行对应,这样才可以进行切换。
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/fragment_info"
android:icon="@android:drawable/ic_dialog_info"
android:title="首页" />
<item
android:id="@+id/fragment_market"
android:icon="@android:drawable/ic_dialog_info"
android:title="圈子" />
<item
android:id="@+id/fragment_me"
android:icon="@android:drawable/ic_dialog_info"
android:title="个人中心" />
</menu>
第二步:MainActivity的逻辑如下:
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main2)
// 获取Fragment的导航栏
val navHostFragment =
supportFragmentManager.findFragmentById(R.id.my_nav_host_fragment) as NavHostFragment
val navController = navHostFragment.navController
// 获取底部导航栏
val bottomNavigationView = findViewById<BottomNavigationView>(R.id.nv)
// 底部导航栏和Fragment导航绑定起来
bottomNavigationView.setupWithNavController(navController)
}
}