Android Jetpack NavigationUI 设置AppBar的menu

Posted 2022-05-25 安果移不动

Fragment的切换 通常伴随顶部ActionBar的menu的变换

为了方便统一管理 引入了NavigationUI

下面弄个demo 点击右上角是哪个点 出现设置界面

点击设置页面跳转到设置页面。点击设置中的返回进行返回

页面代码

NavigationUIActivity

package com.anguomob.jecpack.activity

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import android.view.Menu
import android.view.MenuItem
import androidx.navigation.NavController
import androidx.navigation.NavDestination
import androidx.navigation.fragment.NavHostFragment
import androidx.navigation.ui.AppBarConfiguration
import androidx.navigation.ui.NavigationUI
import com.anguomob.jecpack.R
import com.anguomob.jecpack.databinding.ActivityNavigationBinding
import com.anguomob.jecpack.databinding.ActivityNavigationUiactivityBinding

class NavigationUIActivity : AppCompatActivity() 
    private lateinit var binding: ActivityNavigationUiactivityBinding
    private lateinit var navController: NavController
    private lateinit var appBarConfiguration: AppBarConfiguration
    private  val TAG = "NavigationUIActivity"
    override fun onCreate(savedInstanceState: Bundle?) 
        super.onCreate(savedInstanceState)
        binding = ActivityNavigationUiactivityBinding.inflate(layoutInflater)
        setContentView(binding.root)

        val navHostFragment =
            supportFragmentManager.findFragmentById(R.id.fragmentContainerView2) as NavHostFragment
        navController = navHostFragment.navController

        appBarConfiguration = AppBarConfiguration.Builder(navController.graph).build()
        NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration)
            //监听页面切换
        navController.addOnDestinationChangedListener(object :
            NavController.OnDestinationChangedListener
            override fun onDestinationChanged(
                controller: NavController,
                destination: NavDestination,
                arguments: Bundle?
            ) 
                Log.e(TAG, "onDestinationChanged: ", )
            
        )
    

    override fun onCreateOptionsMenu(menu: Menu?): Boolean 
        menuInflater.inflate(R.menu.menu_settings, menu)
        return super.onCreateOptionsMenu(menu)
    

    override fun onOptionsItemSelected(item: MenuItem): Boolean 
        //先交给NavigationUI  如果搞不定则使用默认
        return NavigationUI.onNavDestinationSelected(
            item,
            navController
        ) || super.onOptionsItemSelected(item)
    

    //返回键支持
    override fun onSupportNavigateUp(): Boolean 
        return NavigationUI.navigateUp(navController, appBarConfiguration) || super.onSupportNavigateUp()
    

布局代码

<?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=".activity.NavigationUIActivity">

    <androidx.fragment.app.FragmentContainerView
        android:id="@+id/fragmentContainerView2"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:navGraph="@navigation/setting_graph"
 />
</androidx.constraintlayout.widget.ConstraintLayout>

HomeFragment

package com.anguomob.jecpack.fragment

import android.os.Bundle
import androidx.fragment.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.Button
import androidx.navigation.Navigation
import com.anguomob.jecpack.R
import com.anguomob.jecpack.databinding.ActivityNavigationBinding
import com.anguomob.jecpack.databinding.FragmentHomeNavigationBinding


class HomeNavigationFragment : Fragment() 

    private lateinit var binding: FragmentHomeNavigationBinding
    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? 
        binding = FragmentHomeNavigationBinding.inflate(inflater)
//        inflater.inflate(R.layout.fragment_home_navigation, container, false)
        return binding.root
    

    override fun onActivityCreated(savedInstanceState: Bundle?) 
        super.onActivityCreated(savedInstanceState)
        binding.btHome.setOnClickListener 
            val args = HomeNavigationFragmentArgs("jack",18).toBundle()
            val findNavController = Navigation.findNavController(it)
            findNavController.navigate(
                R.id.action_homeNavigationFragment_to_detailNavigationFragment,
                args
            )
        
    

请注意 这次跳转是不生效的。因为这个fragment的graph文件里面没有对详情页面做配置

Home布局

<?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=".fragment.HomeNavigationFragment">


    <Button
        android:id="@+id/btHome"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="我是主页，我要去详情页"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.499" />
</androidx.constraintlayout.widget.ConstraintLayout>

SettingFragment

package com.anguomob.jecpack.fragment

import android.os.Bundle
import android.view.*
import androidx.fragment.app.Fragment
import com.anguomob.jecpack.R

// TODO: Rename parameter arguments, choose names that match
// the fragment initialization parameters, e.g. ARG_ITEM_NUMBER
private const val ARG_PARAM1 = "param1"
private const val ARG_PARAM2 = "param2"

/**
 * A simple [Fragment] subclass.
 * Use the [SettingFragment.newInstance] factory method to
 * create an instance of this fragment.
 */
class SettingFragment : Fragment() 

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? 
        //为了确保onCreateOptionsMenu 生效
        setHasOptionsMenu(true)
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_setting, container, false)
    

    override fun onCreateOptionsMenu(menu: Menu, inflater: MenuInflater) 
        //当前页面不展示三个点
        menu.clear()
        super.onCreateOptionsMenu(menu, inflater)
    

布局

<?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=".fragment.SettingFragment">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="Setting Fragment"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

graph文件

<?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/setting_graph"
    app:startDestination="@id/homeNavigationFragment2">
    <fragment
        android:id="@+id/homeNavigationFragment2"
        android:name="com.anguomob.jecpack.fragment.HomeNavigationFragment"
        android:label="fragment_home_navigation"
        tools:layout="@layout/fragment_home_navigation" />
    <fragment
        android:id="@+id/settingFragment"
        android:name="com.anguomob.jecpack.fragment.SettingFragment"
        android:label="fragment_setting"
        tools:layout="@layout/fragment_setting" />

</navigation>

代码分享的流程不对。应该是先创建fragment-》创建graph文件->创建页面activity文件 这样一个顺序

大家凑合着看吧

menu代码

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <!--    这个id 和setting_graph.xml 中的 fragment Id 绑定 -->
    <item
        android:id="@+id/settingFragment"
        android:icon="@mipmap/ic_launcher"
        android:title="设置界面"

        />
</menu>

位置