android實現簡單底部導航欄
本文實例為大傢分享瞭android實現底部導航欄的具體代碼,供大傢參考,具體內容如下
常見的底部導航欄
動態效果
實現步驟
1.底部導航欄樣式
我們應該在項目的res文件夾下新建一個menu文件夾,用來裝menu佈局文件
<?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/international_1" android:title="主頁" /> <item android:id="@+id/navigation_edit" android:icon="@drawable/edit_0" android:title="發佈" /> <item android:id="@+id/navigation_view" android:icon="@drawable/view_0" android:title="關註" /> <item android:id="@+id/navigation_user" android:icon="@drawable/user_0" android:title="我的" /> </menu>
2.新建四個fragment組件
每一個fragment的組件內容相同
四個fragement對應的layout
四個fragment佈局文件的內容也相同,寫上內容以區別是哪個頁面
<?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:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/text_home" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginStart="8dp" android:layout_marginTop="8dp" android:layout_marginEnd="8dp" android:textAlignment="center" android:textSize="20sp" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" android:text="this is homebar" /> </androidx.constraintlayout.widget.ConstraintLayout>
3.建議navigation佈局文件(至關重要)
這個文件指定瞭頁面上顯式那些fragment組件
在項目res下新建一個文件夾專門用來存放此文件
id取值一定要與底部導航欄樣式裡面指定的ID相同,因為android自動根據底部按鈕的ID來綁定按鈕與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/mobile_navigation" app:startDestination="@+id/navigation_home"> <fragment android:id="@+id/navigation_home" android:name="cn.liuhao.test.fragments.HomeFragment" tools:layout="@layout/fragment_home" /> <fragment android:id="@+id/navigation_view" android:name="cn.liuhao.test.fragments.ViewFragment" tools:layout="@layout/fragment_view" /> <fragment android:id="@+id/navigation_edit" android:name="cn.liuhao.test.fragments.EditFragment" tools:layout="@layout/fragment_eidt" /> <fragment android:id="@+id/navigation_user" android:name="cn.liuhao.test.fragments.UserFragment" tools:layout="@layout/fragment_user" /> </navigation>
4.activity
佈局文件
<?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:layout_marginStart="0dp" android:layout_marginEnd="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" /> <!-- 頁面中顯式fragment的容器--> <fragment 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/nav_view" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent" app:navGraph="@navigation/mobile_navigation" /> </androidx.constraintlayout.widget.ConstraintLayout>
內容(綁定Navigation與BottomNavigationView)
public class Main2Activity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main2); // 獲取頁面上的底部導航欄控件 BottomNavigationView navView = findViewById(R.id.nav_view); // 配置navigation與底部菜單之間的聯系 // 底部菜單的樣式裡面的item裡面的ID與navigation佈局裡面指定的ID必須相同,否則會出現綁定失敗的情況 AppBarConfiguration appBarConfiguration = new AppBarConfiguration.Builder( R.id.navigation_home,R.id.navigation_edit,R.id.navigation_view,R.id.navigation_user) .build(); // 建立fragment容器的控制器,這個容器就是頁面的上的fragment容器 NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment); // 啟動 NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration); NavigationUI.setupWithNavController(navView, navController); } }
以上就是本文的全部內容,希望對大傢的學習有所幫助,也希望大傢多多支持WalkonNet。
推薦閱讀:
- Android BottomNavigationView結合ViewPager實現底部導航欄步驟詳解
- Android 詳解沉浸式狀態欄的實現流程
- Kotlin Navigation可視化開發詳解
- Android移動應用開發指南之六種佈局詳解
- Android 中使用RadioGroup和Fragment實現底部導航欄的功能