我正在尝试使用协调器布局滚动列表视图时隐藏工具栏。我在工具栏上使用了app:layout_scrollFlags="scroll|enterAlways"
,在列表视图中使用了android:nestedScrollingEnabled="true"
。
当我向下滚动列表视图时,工具栏会正确隐藏,但它会在状态栏“上方”。在Web开发术语中,工具栏的“Z-Index”看起来比状态栏高。这就是它的样子 -
这是我的activity_main.xml
<android.support.design.widget.CoordinatorLayout
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:id="@+id/main_content"
android:layout_width="match_parent" android:layout_height="match_parent"
android:fitsSystemWindows="true" tools:context=".MainActivity"
android:background="#FFFFFF" >
<android.support.design.widget.AppBarLayout android:id="@+id/appbar"
android:layout_width="match_parent" android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar android:id="@+id/toolbar"
android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" app:popupTheme="@style/AppTheme.PopupOverlay"
app:layout_scrollFlags="scroll|enterAlways" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager android:id="@+id/container"
android:layout_width="match_parent" android:layout_height="match_parent"
android:background="#FFFFFF"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
这是我的fragment_main.xml
代码
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity$PlaceholderFragment">
<ListView
android:id="@+id/listView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollingCache="false"
android:nestedScrollingEnabled="true" />
</RelativeLayout>
如何解决此问题?提前谢谢!
更新:我在下面发布了我的答案!检查接受的答案。
答案 0 :(得分:3)
我终于解决了这个问题。如果其他人如果被困在这里,这就是我修复它的方式。无需将您的布局更改为Recyclerview和所有!以下是步骤。
1)为CoordinatorLayout设置fitsSystemWindows为false。
android:fitsSystemWindows="false"
2)现在,我的状态栏变为白色。要解决此问题,请将以下行添加到MainActivity.java中的onCreate方法
Window window = getWindow();
// clear FLAG_TRANSLUCENT_STATUS flag:
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
// add FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS flag to the window
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
// finally change the color
window.setStatusBarColor(getResources().getColor(R.color.colorPrimaryDark));
瞧!现在一切都很完美。
这是我的activity_main.xml内容,以防我错过了什么。
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay"
app:contentScrim="@color/colorPrimaryDark"
app:layout_scrollFlags="scroll|enterAlways">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="@style/AppTheme.PopupOverlay"
app:layout_scrollFlags="scroll|enterAlways" />
<android.support.design.widget.TabLayout android:id="@+id/tabs"
android:layout_width="match_parent" android:layout_height="wrap_content"
app:tabIndicatorColor="@android:color/white"
app:tabIndicatorHeight="3dp"
android:textStyle="bold"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
答案 1 :(得分:2)
如果您不想扩展和收缩工具栏,为什么会有AppBarlayout
和toolbar
布局?基本上,当人们希望它扩展和收缩时使用AppBarlayout并且它与android.support.v4.widget.NestedScrollView
一起使用,因此可能会出现问题,它们不兼容,您可以使用android.support.v7.widget.RecyclerView
listview
和viewpager
的位置具有属性appbar_scrolling_view_behavior
,触发appbarlayout
开始侦听滚动输入,我通过没有{{{}来获得正常的行为工具栏1}}但只有AppBarlayout
所以你可以移除AppBarlayout,查看它不是真正需要的东西,因为你碰巧希望它扩展和收缩下面是你的代码应该是什么样子的样本
toolbar
这是我的CollapingsTitleLayout
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="match_parent"
android:layout_width="match_parent">
<android.support.v7.widget.RecyclerView
android:id="@+id/scrollableview"
android:layout_width="match_parent"
android:visibility="gone"
android:background="#FFFFFF"
android:paddingTop="?attr/actionBarSize"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<!-- Your content, maybe a ListView? -->
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/fab_margin"
android:clickable="true"
android:id="@+id/fabAddItem"
android:src="@drawable/ic_action_add"
app:backgroundTint="@color/google_lightblue"
app:layout_anchor="@+id/toolbar"
app:layout_anchorGravity="bottom|right|end" />
<aubry.chromio.com.dressup.view.CollapsingTitleLayout
android:id="@+id/backdrop_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
app:expandedTextSize="40dp"
app:expandedMargin="16dp">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent" />
</aubry.chromio.com.dressup.view.CollapsingTitleLayout>
</FrameLayout>
}