Android development----generate Android bottom navigation bar

Android uses android studio to automatically generate the bottom navigation bar

Use Bottom Navigation Activity+Fragment+ViewPager to realize the bottom navigation bar

1. Create a new project and select Bottom Navigation Activity

The automatically generated bottom navigation bar is shown in the figure below:

The automatically generated file structure is shown in the figure below.

2. Change the name of the bottom navigation bar

The name of the bottom navigation bar is a string resource, directly change the required string resource in [values]-[strings], here I use 4 fragments and then go to the
bottom navigation bar resource [navigation]-[mobile_navigation] to change The string resource called

3. Change the bottom navigation bar icon

1) I use the icon automatically generated by android studio
In the [drawable] resource, right-click – new – Vector Asset
2) Click the icon in the figure below to select the icon. (In this part, I have read a lot of information that you can also draw icons in the pathData of the xml file by yourself, or add icons in png format yourself.) Delete the

original icons, and follow the above steps to create all the icons you need. (generally no more than 5)

3) The rest is to change the package name, class name, fragment resource name, and the path name of the call. Note the following files. Just change everything.

4. Change theme color

colorPrimary is the color of the main image
colorPrimaryVariant is the color of the status bar where the top camera line is located,

as shown in the figure below

5. Analyze the layout of the automatically generated MainActivity.xml ConstrainLayout layout

The generated bottom navigation bar and Fragment both use the ConstrainLayout layout

<?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/nav_view"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:background="?android:attr/windowBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu" />

<!--    在这里调整fragment的布局 -->
    <fragment
        android:id="@+id/nav_host_fragment_activity_main"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toTopOf="@id/nav_view"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0"
        app:navGraph="@navigation/mobile_navigation" />

</androidx.constraintlayout.widget.ConstraintLayout>

<!-- 基本方向约束 -->
<!-- 我的什么位置在谁的什么位置 -->
app:layout_constraintTop_toTopOf=""           我的顶部和谁的顶部对齐
app:layout_constraintBottom_toBottomOf=""     我的底部和谁的底部对齐
app:layout_constraintLeft_toLeftOf=""         我的左边和谁的左边对齐
app:layout_constraintRight_toRightOf=""       我的右边和谁的右边对齐
app:layout_constraintStart_toStartOf=""       我的开始位置和谁的开始位置对齐
app:layout_constraintEnd_toEndOf=""           我的结束位置和谁的结束位置对齐
app:layout_constraintTop_toBottomOf=""        我的顶部位置在谁的底部位置
app:layout_constraintStart_toEndOf=""         我的开始位置在谁的结束为止
<!-- ...以此类推 -->