1. 首頁
  2. 問答
  3. 滾動隱藏工具欄與recyclerview裏面的片段

滾動隱藏工具欄與recyclerview裏面的片段

2016-02-22 221 views
16

我試圖讓滾動時工具欄在摺疊內的一個recyclerview滾動。一開始，我的繼承人主要佈局：滾動隱藏工具欄與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，並且我在該回收站上設置了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"/>

來源

2016-02-22 Orbit

+0

你可以發佈你的片段佈局嗎？ – saeed

+0

@saeed添加，檢查編輯。 – Orbit

+0

讓我檢查我得到了同樣的問題...我解決了我自己的問題...我需要一點時間 – saeed

回答

-1
在你的FrameLayout

設置

android:layout_below="@+id/appBarLayout"

如果不行那就試試這個：

android:layout_below="@+id/toolbar"

來源

2016-02-22 07:33:56

+2

'android：layout_below'可以用於'RelativeLayout'的子節點。 'CoordinatorLayout'基本上是一個'FrameLayout'的高級版本，因此它什麼都不做。 – Orbit

0 

<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>

enter image description here

來源

2016-02-22 07:40:13

+0

這與這個問題無關。 – Orbit

+0

對不起..但你想崩潰的工具欄，如果你研究這段代碼，你將擁有它..如果你不想圖像視圖刪除...這個代碼工作像whatsapp配置文件佈局...所以你不想要圖像刪除它...只是嘗試一下，你會看到它的工作 –

+0

現在檢查它我刪除了imageview只是在你的代碼中使用它，並請刪除-1票 –

2

我用了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>

那麼它應該是好去。

來源

2016-02-22 22:08:08 Mohsen

2

我的朋友，我今天做了這個和完美的工作，我有2個片段都有RecyclerView，並且可以滾動Toolbar。我看着chrisbanes'sCheeseSquare：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，我t有app:layout_behavior="@string/appbar_scrolling_view_behavior"屬性 那就是多數民衆贊成它。不要在片段中添加任何其他行爲。請嘗試這樣，並請結果！

來源

2016-06-16 22:23:55

+0

這是我得到的結果： https://www.youtube .com/watch？v = v7fxM1pSrqw – Manos

+0

你可以嘗試添加行爲到你的recylerview –

3

您需要類似於Play商店應用的內容。 在此處粘貼布局。這個代碼很簡單，你可以自己編寫代碼。

  1. 的FrameLayout
    • ImageView的
    • 滾動型
      1. 的LinearLayout
      2. Horizo​​ntalScrollView
        • 的LinearLayout
    • 工具欄

通過上述佈局層次就可以實現這樣的事情：

enter image description here

來源

2016-06-22 17:09:38 Swathin

2

沒有測試還沒有，但是這是你要什麼做：

  • 將app:layout_behavior="@string/appbar_scrolling_view_behavior"移至FrameLayout，其編號爲container。
  • 將android:fitsSystemWindows = "true"加到您的AppBarLayout。

這正是我在我的應用程序中所做的工作。如果這不起作用，請嘗試清理（在Android Studio上，Build - > Clean Project）您的項目並再次運行該應用程序。

來源

2016-06-22 18:32:59 adhirajsinghchauhan

4

做一個佈局名稱toolbar.xml，包括它在你的代碼，你想用的，但提醒一點，請不要使用任何其他佈局一樣的RelativeLayout，的LinearLayout等對上述

來源

2016-06-22 18:33:03 135

3

你可以snap，以layout_scrollFlags屬性 - 使用摺疊佈局 像

<?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>

來源

2016-06-23 09:43:15

2

您可以通過增加第三個標誌解決這個問題。

<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％，則會完全消失。

檢查此link。

來源

2016-06-23 14:10:19 pavle

5 
<?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>

來源

2016-06-23 15:10:26

+0

這個很好用.. –

+1

我可以問一下變量「string/appbar_scrolling_view_behavior」的內容是什麼 – iOSAndroidWindowsMobileAppsDev

0

也遇到了這個問題。但找到了解決辦法。用xml返工的解決方案不能，所以你需要通過編程來完成。我們所需要的全部是Inflater。是的，是的，這很簡單。在飛行中更改xml以使所有滾動。

來源

2018-02-03 21:14:01 Trancer

相關問題

 相關問題