如何在使用 CoordinatorLayout、Toolbar 和 fragment 切换时使工具栏出现

huangapple go评论83阅读模式
英文:

How to make the toolbar appear when switching between fragments using CoordinatorLayout, Toolbar and 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:id="@+id/containerMain"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:id="@+id/main_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <com.google.android.material.appbar.AppBarLayout
            android:id="@+id/AppBarLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_gravity="top"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:layout_scrollFlags="scroll|enterAlways"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />
        </com.google.android.material.appbar.AppBarLayout>
            <fragment
                android:id="@+id/nav_host_fragment"
                app:layout_behavior="@string/appbar_scrolling_view_behavior"
                android:name="androidx.navigation.fragment.NavHostFragment"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:defaultNavHost="true"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:navGraph="@navigation/mobile_navigation" />
    </androidx.coordinatorlayout.widget.CoordinatorLayout>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_view"
        android:layout_width="0dp"
        android:layout_height="@dimen/nav_bar"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="?android:attr/windowBackground"
        app:itemIconTint="@drawable/bottom_color_nav"
        app:itemTextColor="@drawable/bottom_color_nav"
        app:layout_constraintBottom_toBottomOf="@id/main_content"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu" />

</androidx.constraintlayout.widget.ConstraintLayout>
英文:

I'm using the layout below, The CoordinatorLayout holds inside it AppBarLayout (With Toolbar) and the fragment layout.

I'm using app:layout_scrollFlags in my Toolbar and app:layout_behavior="@string/appbar_scrolling_view_behavior" in the fragment, so the Toolbar appear and disappear (hide/show) with scrolling my fragment content.

My problem: when I scroll in fragment A and therefore the toolbar disappear, then I use the BottomNavigationView to go to fragment B the toolbar remains hidden.
I want the toolbar to appear every time I open new 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:id="@+id/containerMain"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:id="@+id/main_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <com.google.android.material.appbar.AppBarLayout
            android:id="@+id/AppBarLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_gravity="top"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:layout_scrollFlags="scroll|enterAlways"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />
        </com.google.android.material.appbar.AppBarLayout>
            <fragment
                android:id="@+id/nav_host_fragment"
                app:layout_behavior="@string/appbar_scrolling_view_behavior"
                android:name="androidx.navigation.fragment.NavHostFragment"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:defaultNavHost="true"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:navGraph="@navigation/mobile_navigation" />
    </androidx.coordinatorlayout.widget.CoordinatorLayout>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_view"
        android:layout_width="0dp"
        android:layout_height="@dimen/nav_bar"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="?android:attr/windowBackground"
        app:itemIconTint="@drawable/bottom_color_nav"
        app:itemTextColor="@drawable/bottom_color_nav"
        app:layout_constraintBottom_toBottomOf="@id/main_content"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu" />

</androidx.constraintlayout.widget.ConstraintLayout>

答案1

得分: 2

我会假设你发布的 XML 是你的 MainActivity 的布局,如果是这样,请在 MainActivity 中创建对 Toolbar 的引用,并在 MainActivity 中创建一个函数来访问/更改 Toolbar 的折叠状态。

在你的 Fragments 中,创建一个对 MainActivity 的引用,然后使用这个引用来访问函数以更改 Toolbar 的状态。

我无法在工作时进行测试,但当应用的导航流仅使用 MainActivity 和内部 Fragments 时,我曾经使用过相同的代码流程来完成相同的操作。

以下是不完全工作或经过测试的代码示例,但思路/流程相同:

// 我的 Fragment 函数以访问 MainActivity().changeToolbarState(boolean)
fun changeToolbar(state: Boolean) {
    if (state) {
        // true
        // 显示工具栏
        MainActivity().changeToolbarState(true)
    } else {
        // false
        // 折叠/隐藏工具栏
        MainActivity().changeToolbarState(false)
    }
}

请注意,上述代码示例可能存在问题,因为它在每次调用 MainActivity() 时都会创建一个新的 MainActivity 实例。实际上,你需要通过适当的方法来获取对现有 MainActivity 实例的引用,以便进行状态更改。

英文:

I would assume that the xml you posted is your layout for your MainActivity(), if so create a reference to your Toolbar in your MainActivty and create a function in your MainActivty() to access/change your Toolbar collapse states.

In your Fragments, create a reference to your MainActivity to then access the function to change the state of your Toolbar.

I cannot test as from work, but I have used same code flow to do the same stuff when using only MainActivity with Inner Fragments as the navigation flow of the app.

Below not exact working or tested code, but same idea/flow

//my fragment function to access MainActivity().changeToolbarState(boolean)
changeToolbar(state: boolean) {
    if(state){
      //true
      //show toolbar
      MainActivty().changeToolbarState(true)

    }else{
      //false
      //collapse/hidetoolbar
     MainActivty().changeToolbarState(false)
    }
}

答案2

得分: 1

最好的替代方案可能是在片段内部使用以下代码将 app bar 布局的 setExpanded 属性设置为 true。在这里,MainActivity.appBarLayout 是在主活动中定义的静态变量,引用了 App Bar 布局。

@Override
public void onPause() {
    super.onPause();
    MainActivity.appBarLayout.setExpanded(true);
}
英文:

The best alternative could be enabling setExpanded property of app bar layout to true with the following code inside the fragment. Here, MainActivity.appBarLayout is the static variable defined in Main Activity referenced to App Bar Layout.

@Override
public void onPause() {
	super.onPause();
	MainActivity.appBarLayout.setExpanded(true);
}

huangapple
  • 本文由 发表于 2020年4月9日 05:40:13
  • 转载请务必保留本文链接:https://go.coder-hub.com/61110479.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定