[英]Hiding Toolbar on scroll with recyclerview inside fragment
當滾動片段內的recyclerview時,我正試圖讓工具欄在滾動時折疊。 首先,繼承我的主要布局:
<DrawerLayout>
<RelativeLayout
android:id="@+id/mainRelativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<android.support.design.widget.AppBarLayout
android:id="@+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="5dp"
app:layout_scrollFlags="scroll|enterAlways"
>
</Toolbar>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>
<!-- ignore -->
<drawercontents>
</DrawerLayout>
因此你可能猜到我的片段被加載到@id/container
。 我的第一個片段包含recyclerview,我在該recyclerview上設置app:layout_behavior="@string/appbar_scrolling_view_behavior"
。 這確實有效,工具欄在滾動時折疊。 問題是工具欄覆蓋了片段未折疊時的頂部內容。 在片段容器中添加一個等於工具欄大小的上邊距只會在工具欄崩潰時(顯然)導致留下空白。
什么不見了? 有任何想法嗎?
編輯:根據要求,這是包含recyclerview的片段的布局:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.RecyclerView
android:id="@+id/feed"
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:background="#00000000"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
<?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.support.design.widget.AppBarLayout
android:id="@+id/tabanim_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/tabanim_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
尚未測試過,但這是你必須做的:
app:layout_behavior="@string/appbar_scrolling_view_behavior"
到帶有id container
的FrameLayout
。 android:fitsSystemWindows = "true"
到AppBarLayout
。 這正是我在我的應用程序中所做的,它的工作原理。 如果這對您不起作用,請嘗試清理(在Android Studio上, 構建 - >清理項目 )您的項目並再次運行該應用程序。
我的朋友今天我做了這個並且工作完美,我有2個片段都有RecyclerView
並且可以滾動Toolbar
。 我看了chrisbanes's
CheeseSquare
: CheeseSquare
如果你看看MainActivity
, TabLayout
有3個片段,所有片段都可以滾動Toolbar
。 所以我准備了這個布局,也許你會看看:
我的activity_home.xml
:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<include layout="@layout/content_home"/>
<android.support.design.widget.NavigationView
android:id="@+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:layout_gravity="start"
app:menu="@menu/homepage_leftdrawer">
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
和content_home.xml
:
<?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:id="@+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme3.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:layout_scrollFlags="scroll|enterAlways|snap" />
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabTextColor="@color/Transparent_few_white"
app:tabIndicatorColor="@color/White"
app:tabTextAppearance="@style/TabLayoutTextStyle"
app:tabIndicatorHeight="3dp"
app:tabSelectedTextColor="@color/White"
android:background="@color/ColorPrimary"
app:tabPaddingStart="0dp"
app:tabPaddingEnd="0dp"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/pager2"
android:layout_height="match_parent"
android:layout_width="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
關鍵在哪里:
如果你看看我的ViewPager
,它有app:layout_behavior="@string/appbar_scrolling_view_behavior"
屬性然后就是這樣。 不要在片段中添加任何其他行為。 試試這樣,請結果!
將一個布局名稱設置為toolbar.xml並將其包含在您要使用的代碼中,但提醒一件事請不要使用其他任何布局,如Relativelayout,Linearlayout和其他布局
您可以通過向layout_scrollFlags
屬性添加第三個標志 - snap
來解決此問題。
<Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="5dp"
app:layout_scrollFlags="scroll|enterAlways|snap" />
使用此選項將確定僅在部分減少視圖時要執行的操作。 如果滾動結束並且視圖大小已減小到原始視圖的小於50%,則此視圖將恢復為其原始大小。 如果尺寸大於其尺寸的50%,它將完全消失。
檢查此鏈接 。
我使用SwipeRefreshLayout
或只是一個LinearLayout
或RelativeLayout
作為Fragment
布局的根,它正在工作。
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/swipe_refresh_layout_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/mycustomcolor"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.v4.widget.SwipeRefreshLayout>
使用RelativeLayout
:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/fragment2"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler_view_android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</RelativeLayout>
那應該是好的去。
您可以使用折疊布局
<?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/collapse_toolbar"
android:layout_width="match_parent"
android:layout_height="200dp"
android:fitsSystemWindows="true"
app:contentScrim="@color/zxing_transparent"
android:paddingBottom="2dip"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:expandedTitleGravity="bottom|center_horizontal"
app:expandedTitleMarginBottom="50dip"
app:collapsedTitleGravity="top|center_vertical"
app:collapsedTitleTextAppearance="@style/collapseTitle">
<Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="5dp"
app:layout_scrollFlags="scroll|enterAlways"
>
</Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentScrim="?attr/colorPrimary"
>
<android.support.v7.widget.Toolbar
android:id="@+id/appBar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_below="@+id/app_bar_layout"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:weightSum="1">
<FrameLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorAccent"
>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Your recycler view should go here"/>
</FrameLayout>
</LinearLayout>
也碰到了這個問題。 但是找到了解決方案。 使用xml返工的解決方案不可能,因此您需要以編程方式執行此操作。 我們需要的只是Inflater 。 是的,是的,那很簡單。 在飛行中更改xml以工作所有滾動。
在你的framelayout集中
android:layout_below="@+id/appBarLayout"
如果那不起作用,那試試這個:
android:layout_below="@+id/toolbar"
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.