1. ホーム
  2. android

[解決済み] AppBarLayoutとスクロールビューの重ね合わせ

2022-11-23 04:23:10

質問

の「コンテンツが重なり合うフレキシブルスペース」パターンを実装したい。 マテリアルデザインのスクロールのテクニック のように この動画 :

今の私のXMLのレイアウトは次のようなものです。

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

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

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

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

  <android.support.v4.widget.NestedScrollView
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
      <....>
    </LinearLayout>
  </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

デザイン ライブラリを使用して、これを簡単に実現する方法はありますか?それとも、カスタム CoordinatorLayout.Behavior を作成する必要がありますか?

どのように解決するのですか?

実は、スクロールビューをAppBarLayoutでオーバーレイするのは、インクルード機能として Android デザイン支援ライブラリ : を使用することができます。 app:behavior_overlapTop 属性は NestedScrollView (または スクロールビュービヘイビア を利用して、オーバーラップ量を設定することができます。

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    app:behavior_overlapTop="64dp">

なお app:behavior_overlapTop を持つビューでのみ動作します。 app:layout_behavior="@string/appbar_scrolling_view_behavior" を持つビューに対してのみ機能します(通常属性が適用されるビューや親ViewGroupではなく)。 behavior_ という接頭辞があります。

あるいは、プログラム的に setOverlayTop() :

NestedScrollView scrollView = ...
CoordinatorLayout.LayoutParams params = 
    (CoordinatorLayout.LayoutParams) scrollView.getLayoutParams();
AppBarLayout.ScrollingViewBehavior behavior =
    (AppBarLayout.ScrollingViewBehavior) params.getBehavior();
behavior.setOverlayTop(128); // Note: in pixels