android 导航栏navigation

navigation有3个重要的组成部分:导航图 、NavHost  、NavController

导航图即为xml文件

1、依赖:

dependencies {
  def nav_version = "2.4.1"

  // Java language implementation
  implementation "androidx.navigation:navigation-fragment:$nav_version"
  implementation "androidx.navigation:navigation-ui:$nav_version"

  // Kotlin
  implementation "androidx.navigation:navigation-fragment-ktx:$nav_version"
  implementation "androidx.navigation:navigation-ui-ktx:$nav_version"

  // Feature module Support
  implementation "androidx.navigation:navigation-dynamic-features-fragment:$nav_version"

  // Testing Navigation
  androidTestImplementation "androidx.navigation:navigation-testing:$nav_version"

  // Jetpack Compose Integration
  implementation "androidx.navigation:navigation-compose:$nav_version"
}

2、NavHost的xml文件创建:

        2.1、在“Project”窗口中,右键点击 res 目录,然后依次选择 New > Android Resource File。此时系统会显示 New Resource File 对话框。

        2.2、在 File name 字段中输入名称,例如“nav_graph”。

        2.3、从 Resource type 下拉列表中选择 Navigation,然后点击 OK。

        文件如下:

<?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"
    android:id="@+id/nav_graph"
    app:startDestination="@id/homeFragment">表示第一个启动的fragment

    设置id,name是fragment的名称;例如我的:MeFragment
    <fragment android:id="@+id/homeFragment"
        android:name="com.onewave.boost.clean.fragment.MoneyFragment"/>

    <fragment android:id="@+id/recordFragment"
        android:name="com.onewave.boost.clean.fragment.RecordFragment"/>
</navigation>

3、在activity布局中:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"   
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activity.HomeActivity">


    <fragment
        android:id="@+id/main_navigation"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:name="androidx.navigation.fragment.NavHostFragment"
        app:navGraph="@navigation/nav_graph"/>指定的NavHost
</RelativeLayout>

在main class中:

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        Navigation.findNavController(this,R.id.main_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/nav_graph"
    app:startDestination="@id/mefragment">

//通用的2个事件:
    <action android:id="@+id/action_to_homefragment"
        app:destination="@id/homefragment"
        app:enterAnim="@anim/nav_default_pop_enter_anim"
        app:exitAnim="@anim/nav_default_pop_exit_anim"/>

    <action android:id="@+id/action_to_mefragment"
        app:destination="@id/mefragment"
        app:enterAnim="@anim/nav_default_pop_enter_anim"
        app:exitAnim="@anim/nav_default_pop_exit_anim"/>

    <fragment android:id="@+id/mefragment"
        android:name="com.imitate.shortvideo.myapplication.MeFragment"
        tools:layout="@layout/fragment_me">

        <deepLink app:uri="www.hao123.com/{params}"/>
    </fragment>

    <fragment android:id="@+id/homefragment"
        android:name="com.imitate.shortvideo.myapplication.HomeFragment"
        tools:layout="@layout/fragment_home">
        <argument android:name="name" android:defaultValue="max"/>

    </fragment>
</navigation>

  • main 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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <fragment
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/main_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        app:navGraph="@navigation/nav_graph"
        app:defaultNavHost="true"/>

导航栏
    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/main_nav_btn"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        app:menu="@menu/menu"

        app:itemIconTint="drawble"  可以设置选中的颜色
        app:itemTextColor=""            字体颜色、大小都可以设置
        app:labelVisibilityMode="labeled"   导航栏显示图标和显示文字

        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintVertical_bias="1"/>

</androidx.constraintlayout.widget.ConstraintLayout>

这里的menu是res目录下的menu文件夹menu.xml:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/mefragment"
        android:icon="@mipmap/ic_launcher"
        android:title="我的"/>

    <item
        android:id="@+id/homefragment"
        android:icon="@mipmap/ic_launcher"
        android:title="首页"/>
</menu>

我们需要在mainActivity中绑定容器和导航栏:

    private void initView() {
        BottomNavigationView navBtn=findViewById(R.id.main_nav_btn);
        NavController navController = Navigation.findNavController(this, R.id.main_fragment);

这里如果我们需要对导航栏跳转时做判断,比如判断用户是否登录,未登录,就不跳转或者处理其他事件;
这里返回true,则表示拦截不跳转,false则正常跳转;
        navBtn.setOnItemSelectedListener(new    NavigationBarView.OnItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {

                switch (item.getItemId()){
                    case R.id.homefragment:

                        navController.navigate(R.id.action_to_homefragment);
                        break;

                    case R.id.mefragment:

                        navController.navigate(R.id.action_to_mefragment);
                        break;
                }
//                return true表示拦截,不让跳转,
                return true;
            }
        });
//        绑定navBtn和navControl
        NavigationUI.setupWithNavController(navBtn,navController);

    }

猜你喜欢

转载自blog.csdn.net/jian11058/article/details/123083162