スクロール可能なレイアウトとフィルタパネルによるビューの配置

Question

私のアクティビティのビューの整理には苦労しています。
は、私は、単純な効果到達したい：/非表示アクションを表示することが可能であろういくつかのテキストビュー、ラジオ付き

• フィルタ容器を、
以下
• ：写真の大きな量とグリッドビュー

もちろん、すべての写真を表示するためにユーザーがスクロールできるように、ビューをスクロール可能にしたいと考えています。
さらに、私はフィルターの位置を固定したいと思っています。

これは望ましいレイアウトです。

は、私は、次の方法でそれをやろうとしました：

<android.support.constraint.ConstraintLayout 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:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context="..." 
    android:id="@+id/allViews"> 

    <!-- panel with some filter controls --> 
    <LinearLayout 
     android:id="@+id/searchOpts" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:gravity="center" 
     app:layout_constraintTop_toTopOf="parent" 
     android:layout_marginTop="@dimen/search_opts_margin" 
     android:visibility="gone" 
     android:orientation="vertical"> 

     <RadioGroup 
      android:id="@+id/sortOrder" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      app:layout_constraintLeft_toLeftOf="parent" 
      app:layout_constraintRight_toRightOf="parent" 
      android:orientation="horizontal"> 

      <RadioButton 
       android:id="@+id/orderByTime" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content"/> 

      <RadioButton 
       android:id="@+id/orderByRating" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content"/> 
     </RadioGroup> 

     <MultiAutoCompleteTextView 
      android:id="@+id/tags" 
      android:hint="@string/tags_label" 
      android:layout_width="300dp" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="5dp" 
      android:inputType="textNoSuggestions|textCapSentences|textMultiLine" 
      android:textSize="16sp" 
      android:textColor="#555" 
      app:layout_constraintLeft_toLeftOf="parent" 
      app:layout_constraintRight_toRightOf="parent" 
      app:layout_constraintTop_toBottomOf="@+id/sortOrder" /> 

    </LinearLayout> 

    <!-- panel with grid of big amount of images --> 
    <ScrollView 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_marginBottom="5dp" 
     android:id="@+id/sv" 
     android:layout_width="match_parent" 
     android:layout_marginTop="@dimen/items_grid_margin_under_search_opts" 
     app:layout_constraintTop_toBottomOf="@+id/searchOpts" 
     android:layout_height="match_parent" > 

     <GridView 
      android:id="@+id/PhotosGrid" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginLeft="5dp" 
      android:layout_marginRight="5dp" 
      android:columnWidth="100dp" 
      android:drawSelectorOnTop="true" 
      android:gravity="center" 
      android:numColumns="auto_fit" 
      android:verticalSpacing="5dp" 
      android:horizontalSpacing="5dp" 
      android:focusable="true" 
      android:clickable="true"/> 
    </ScrollView> 
</android.support.constraint.ConstraintLayout> 

は、残念ながら、私は失敗し、いくつかの助けを必要としています。

Answer 1

私はあなたがCoordinatorLayoutを使用してこれを行うことができ、あなたが持っていると思う：

1. CoordinatorLayoutレイアウトのルートとして。
2. コーディネーターレイアウトの最初の子としてAppBarLayout。
3. ツールバーおよび/またはレイアウト/カスタムビューでCollapsingToolbarを追加して、レイアウトの上部を表します。 CollapsingToolbarLayoutを使用すると、コンテンツの下部がスクロールを開始したときにトリガーされるツールバーやレイアウトにスクロールビヘイビアを定義できます。
4. モックアップの下部にグリッドを表示するためのRecyclerviewを追加し、アプリケーションのレイアウト内でスクロールできるようにレイアウト動作を指定します。ここで

あなたのレイアウトは次のようになります方法の例です：あなたはここでそれについての詳細を学ぶことができ

<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/appbar_layout" 
     android:layout_width="match_parent" 
     android:layout_height="280dp" 
     android:fitsSystemWindows="true"> 

     <android.support.design.widget.CollapsingToolbarLayout 
      android:layout_width="match_parent" 
      android:id="@+id/collapsingToolbar" 
      android:layout_height="280dp" 
      app:layout_scrollFlags="scroll|snap|exitUntilCollapsed" 
      app:contentScrim="?attr/colorPrimary"> 

      <CustomViewHeader 
       android:id="@+id/custom_view_header" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:scaleType="centerCrop" 
       app:layout_scrollFlags="scroll" 
       android:fitsSystemWindows="true"/> 

      <android.support.v7.widget.Toolbar 
       android:layout_height="?attr/actionBarSize" 
       android:layout_width="match_parent" 
       android:id="@+id/toolbar" 
       app:navigationIcon="@drawable/ic_arrow_back" 
       app:layout_collapseParallaxMultiplier="0.7" 
       app:layout_collapseMode="pin"/> 

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


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

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

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

：達成されたと何の助けが望まれているhttps://antonioleiva.com/collapsing-toolbar-layout/