English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Androidでスライドしてトップに留まる効果を実現

まず、実現したい効果を確認します:

情報を調べた後、多くのウェブサイトでこの方法が使用されていることを発見しました:

必要な浮遊部分と同じlayoutをもう一つ追加します。まず、浮遊領域の可視性をgoneに設定します。浮遊領域が顶部にスライドしたとき、浮遊領域Bの可視性をVISIBLEに設定します。そうすると、顶部に浮遊して固定されたように見えます。

ここでは、別の方法について説明します:

designパッケージのコンテンツを使用

<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:layout_width="match_parent"
 android:layout_height="match_parent"
 android:fitsSystemWindows="true"
 tools:context="com.peipei.app.MainActivity"
 <android.support.design.widget.AppBarLayout
 android:layout_width="match_parent"
 android:layout_height="250dp">
 <android.support.design.widget.CollapsingToolbarLayout
  app:layout_scrollFlags="scroll"
  app:contentScrim="#000000"
  android:layout_width="match_parent"
  android:layout_height="220dp">
  <TextView
  android:text="バナー領域"
  android:gravity="center"
  android:textColor="#ffffff"
  android:background="#987545"
  android:layout_width="match_parent"
  android:layout_height="220dp"/>
 </android.support.design.widget.CollapsingToolbarLayout>
 <TextView
  android:gravity="center"
  android:layout_width="match_parent"
  android:layout_height="30dp"
  android:text="浮遊する部分"/>
 </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">
  <TextView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_margin="@dimen/text_margin"
  android:text="@string/large_text"/>
 </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

実行手順:

1、浮き出す必要のあるlayoutをCollapsingToolbarLayoutの外、AppBarLayoutの中に配置する

2、CollapsingToolbarLayoutのapp:layout_scrollFlagsをscrollに設定する

3、スクロールするNestedScroolViewに設定する

      app:layout_behavior="@String/appbar_scrolling_view_behavior"

大成功です(ルートレイアウトがCoordinatorLayoutであることを忘れないでください)

最終的な効果:

まとめ

これで、Androidのスライドしてトップに固定する効果に関するすべての内容が終わりました。皆さん、学びましたか?この記事が皆さんの学習や仕事に少しでも役立つことを願っています。何か疑問があれば、コメントで交流してください。

基本チュートリアル
おすすめ