CollapsingToolbarLayout không hoạt động (thu gọn) khi cuộn

Question

Tôi đang cố gắng tạo một CollapsingToolbarLayout và bên dưới nó một listview, khi listview được cuộn thanh công cụ sẽ sụp đổ, nhưng nó không hoạt động khi cuộn thanh công cụ không sụp đổ.

sử dụng hướng dẫn này: http://android-developers.blogspot.in/2015_05_01_archive.html

Lưu ý: Các FrameLayout chứa listview

<LinearLayout 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="wrap_content" 
     android:orientation="vertical" 
     android:scrollbars="vertical"> 

     <android.support.design.widget.AppBarLayout 
      android:id="@+id/appbar" 
      android:layout_width="match_parent" 
      android:layout_height="192dp" 
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

      <android.support.design.widget.CollapsingToolbarLayout 
       android:id="@+id/toolbar" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       app:layout_scrollFlags="scroll|exitUntilCollapsed"> 

       <android.support.v7.widget.Toolbar 
        android:id="@+id/toolbara" 
        android:layout_width="match_parent" 
        android:layout_height="?attr/actionBarSize" 
        android:background="?attr/colorPrimary" 
        app:layout_collapseMode="pin" 
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> 
      </android.support.design.widget.CollapsingToolbarLayout> 
     </android.support.design.widget.AppBarLayout> 

     <FrameLayout 
      android:id="@+id/frame" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" /> 
    </LinearLayout> 

Mã framelayout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context="ranjithnair02.com.supporttest.BlankFragment"> 

    <ListView 
     android:id="@+id/rcyv" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" /> 

    <android.support.design.widget.FloatingActionButton 
     android:id="@+id/fab" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_alignParentRight="true" 
     android:layout_marginBottom="10dp" 
     android:layout_marginRight="10dp" 
     android:src="@android:drawable/ic_search_category_default" 
     app:borderWidth="0dp" 
     app:elevation="5dp" 
     app:rippleColor="@color/wallet_highlighted_text_holo_light" /> 
</RelativeLayout> 

Answer 1

Bạn nên sử dụng RecyclerView thay vì ListView

Lưu ý: đừng quên cập nhật RecyclerView trong tập tin Gradle.

compile 'com.android.support:recyclerview-v7:22.2.0' 

Answer 2

Vấn đề là RelativeLayout. Thử thay thế FrameLayout bằng ListView và sau đó là FloatingButton. Tất cả được bọc trong CoordinatorLayout tất nhiên.

Answer 3

<FrameLayout 
     android:id="@+id/frame" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior"/> 

Answer 4

Tôi đã làm ví dụ bằng cách sử dụng RecyclerView thay thế. Bạn có thể tìm thấy mã nguồn tại đây: https://github.com/jiahaoliuliu/MaterialDesignSample/tree/collapsingToolbars

Có một vài điều bạn nên xem xét và bài đăng không nói.

1. Sử dụng CoordinatorLayout như cách bố trí chính

2. Sử dụng một chủ đề mà không ActionBar và thiết lập các thanh công cụ như actionBar để thay thế. Bạn có thể làm điều đó bằng cách tạo ra một chủ đề đặc biệt cho các hoạt động như thế này:

   <!-- Indigo without actionbar when toolbar is used --> 
   <style name="IndigoWithoutActionBar" parent="Indigo"> 
       <item name="windowActionBar">false</item> 
       <item name="windowNoTitle">true</item> 
   </style> 
   

   Và trong file AndroidManifest.xml, hãy làm như sau:

   <activity 
       android:name=".CollapsingToolbarActivity" 
       android:label="@string/app_name" 
       android:theme="@style/IndigoWithoutActionBar" 
       > 
   </activity> 
   

   Một khi điều này được thực hiện, thiết lập nó trên mã Java:

   // Actionbar 
   final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); 
   setSupportActionBar(toolbar); 
   getSupportActionBar().setDisplayHomeAsUpEnabled(true); 
   

Dưới đây là một mã xml chức năng mà tôi sử dụng.

<?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:id="@+id/appbar" 
     android:layout_width="match_parent" 
     android:layout_height="@dimen/detail_backdrop_height" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
     android:fitsSystemWindows="true"> 

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

      <ImageView 
       android:id="@+id/backdrop" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:scaleType="centerCrop" 
       android:fitsSystemWindows="true" 
       app:layout_collapseMode="parallax" /> 

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

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

    <android.support.v7.widget.RecyclerView 
     android:id="@+id/simpleRecyclerView" 
     android:layout_height="match_parent" 
     android:layout_width="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior" 
     /> 

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

Nếu đây là không đủ cho bạn, bạn có thể làm theo các quy tắc ứng Chris Banes đây: https://github.com/chrisbanes/cheesesquare