2016-01-24 4 views
17

私は、次のようなレイアウトを持っている:CoordinatorLayoutそして折りたたみヘッダ

enter image description here

(ツールバー、 ヘッダービュー、テキストビュー、RecyclerView)

私は時に崩壊されるヘッダを必要とします私はrecyclerviewのアイテムをスクロールします。 「アイテムを選択」ビューとrecyclerviewが画面上に残るようにします。

私は、ツールバーが折りたたまれているときの例を見ましたが、ツールバーが常に存在する必要があります。

この作品を作成するために使用するレイアウト/ビヘイビアはどれですか?

答えて

34

あなたはこのレイアウトを持っていることによって、それを達成することができます:

<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:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

     <android.support.design.widget.CollapsingToolbarLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      app:layout_scrollFlags="scroll|exitUntilCollapsed"> 

      <!-- HEADER --> 
      <RelativeLayout 
       ... 
       app:layout_collapseMode="parallax"> 
       ..... 
      </RelativeLayout> 

      <android.support.v7.widget.Toolbar 
       android:layout_width="match_parent" 
       android:layout_height="?attr/actionBarSize" 
       app:layout_collapseMode="pin" /> 

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

     <!-- IF YOU WANT TO KEEP "Choose Item" always on top of the RecyclerView, put this TextView here 
     <TextView 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="bottom" 
      android:text="choose item" /> 
     --> 
    </android.support.design.widget.AppBarLayout> 

    <android.support.v7.widget.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_collapseMode="pin"プロパティセットを持っていることによって、あなたのツールバーを固定します。 app:layout_behavior="@string/appbar_scrolling_view_behavior"を設定してRecyclerViewを適切にスクロールできるようにしてください。それはかなりです。

NB! TextView「項目を選択してください」の位置は、あなたが達成したい特定の動作に依存:

  • ユーザーがRecyclerViewをスクロールし始めると、あなたが、すぐにそれをスクロールするためにあなたのRecyclerViewAdapterの最初の要素としてそれを含めることができます;
  • AppBarLayoutに追加できるので、スクロールするときはいつでもRecyclerViewの上に固定されます。

あなたがここで私は願っていますDesign Support Library (III): Coordinator Layout

をここAndroid Design Support Libraryを続きを読むことができ、それができます!

+0

ありがとうございます!できます!!! – Oleg

+0

魅力的な作品です!ありがとう – Tooroop

0
The below code is working but not smooth scroll compare reqular recyclerview I thought. 

<?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" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/activity_main" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 


    <android.support.design.widget.AppBarLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

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

      <com.sliderbanner.views.BannerSlider 
       android:id="@+id/banner_slider1" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       app:animateIndicators="true" 
       app:defaultIndicators="dash" 
       app:interval="5000" 
       app:loopSlides="true" 

       /> 

      <android.support.v7.widget.Toolbar 

       android:id="@+id/toolbar" 
       android:layout_width="match_parent" 
       android:layout_height="?actionBarSize"> 

       <ImageView 
        android:id="@+id/image_github" 
        android:layout_width="36dp" 
        android:layout_height="36dp" 
        android:layout_gravity="right" 
        android:layout_marginRight="8dp" /> 

       <TextView 
        android:layout_width="match_parent" 
        android:layout_height="match_parent" 
        android:fontFamily="sans-serif-bold" 
        android:gravity="center_vertical|left" 
        android:text="Banner Slider" 
        android:textColor="@android:color/black" 
        android:textSize="18sp" /> 
      </android.support.v7.widget.Toolbar> 
     </android.support.design.widget.CollapsingToolbarLayout> 


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


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