可折叠的工具栏 - 状态栏下面的工具栏

9
我最近遇到了Coordinator Layout的问题。当我尝试创建像这个示例中的简单折叠式工具栏布局时,工具栏会出现在状态栏下面,如下面的屏幕截图所示(在PreLolipop设备上一切正常,因为应用程序不会绘制在状态栏下方)。

toolbar under statusbar (see back arrow)

我的Activity布局的代码片段:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    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"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsingToolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:contentScrim="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <ImageView
                android:id="@+id/imageCalculationDetail"
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:background="@drawable/ic_dummy_calculation"
                android:fitsSystemWindows="true"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax"/>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@color/transparent"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:id="@+id/scroll"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="fill_vertical"
        android:clipToPadding="false"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <include layout="@layout/container"/>

    </android.support.v4.widget.NestedScrollView>

</android.support.design.widget.CoordinatorLayout>

我的样式(仅适用于v21),其中BaseAppTheme的父类是Theme.AppCompat.Light.NoActionBar:

<style name="AppTheme" parent="BaseAppTheme">
        <item name="android:windowTranslucentStatus">true</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="android:colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="android:colorAccent">@color/colorPrimary</item>
        <item name="android:colorButtonNormal">@color/button_state_list</item>
        <item name="android:statusBarColor">@color/transparent</item>
    </style>

请发布您的styles.xml文件。 - Gurupad Mamadapur
我已经在问题中添加了样式。 - Jarda Havelik
你的清单文件怎么样了?你在那里指定了正确的样式吗?也把那个发出来。因为我在Lollipop模拟器上尝试了相同的布局,一切都很好。 - Gurupad Mamadapur
@color/transparent的值是什么?如果不是,请将其更改为#00000000 - Gurupad Mamadapur
透明的值为@android:color/transparent,对应的十六进制码为#00000000。 - Jarda Havelik
7个回答

7
我已经找到解决方法了,问题是我有一个

标签。
<item name="android:fitsSystemWindows">true</item>

在我的BaseAppTheme中的toolbarStyle中(对于其他活动,一切正常,但对于具有半透明状态栏的折叠工具栏不起作用)。设置后。
android:fitsSystemWindows="false"

将这个工具栏添加到我的浏览器后,一切正常运作。

2

对我而言

在XML中向工具栏添加fitSystemWindows="false"属性即可解决问题。

<android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:fitsSystemWindows="false"
                app:popupTheme="@style/AppTheme.PopupOverlay"
                app:layout_collapseMode="pin"/>

0
<item name="android:windowDrawsSystemBarBackgrounds">true</item>

通过将此代码放入您的样式中,您告诉Android您的应用程序负责绘制系统栏后面的内容。这就是为什么在其他答案中的“肮脏的黑客”在设置此标志时技术上是正确的原因。
除非您有明确的理由使该标志为true(我怀疑不会),否则请将其设置为false,以便操作系统为您正确地偏移内容。您的状态栏仍应该是半透明的。

将此值设置为false并不会有任何区别。 - Jarda Havelik

0
尝试将android:fitsSystemWindows="true"从ImageView中移除。
<ImageView
            android:id="@+id/imageCalculationDetail"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:background="@drawable/ic_dummy_calculation"
            android:scaleType="centerCrop"
            app:layout_collapseMode="parallax"/>

移除此标志后,工具栏位于状态栏下方,但状态栏不再透明,整个折叠式工具栏也会变形,这并非期望的效果。 - Jarda Havelik
请问您能否发布一下截图? - Uttam Panchasara

0

通过使用Android的Window类方法清除和添加相关标志,您可以以编程方式更改此行为。在相关活动中编写自定义函数,并将其传递给所选颜色资源ID:

Kotlin

fun setStatusBar(color: Int) {
    val window = this.window
    window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS)
    window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS)
    window.statusBarColor = ContextCompat.getColor(this, color)
}

Java

public void setStatusBar(int color) {
    Window window = this.getWindow();
    window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
    window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
    window.setStatusBarColor(ContextCompat.getColor(this, color));
}

然后,在您的Activity的重写onCreate方法中,在setContentView(R.layout.your_layout)行之后立即调用该函数。例如:

Kotlin

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.your_layout)
    setStatusBar(R.color.colorPrimaryDark)
    ...
}

Java:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.your_layout);
    setStatusBar(R.color.colorPrimaryDark);
    ...
}

-1

对我来说,什么都不起作用。

对我来说,解决方案很简单:

顶部CoordinatorLayout视图中添加android:fitsSystemWindows="false"


-1
将断点应用于工具栏以包括对棒棒糖设备或更高版本的marginTop。

values/dimens.xml

<dimen name="toolbar_margin_top">0dp</dimen>

values-v21/dimens.xml

<dimen name="toolbar_margin_top">24dp</dimen>

然后在你的布局中:

<android.support.v7.widget.Toolbar
  .....
  android:layout_marginTop="@dimen/toolbar_margin_top"

这似乎更像是一种变通方法,我希望能找到一些干净的解决方案,在示例中没有顶部边距。 - Jarda Havelik
如果你想要一个透明的状态栏,那么这是唯一可行的方法来修复它。否则,你需要在你的样式中禁用android:windowDrawsSystemBarBackgrounds属性:<item name="android:windowDrawsSystemBarBackgrounds">false</item> - José Carlos

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接