[Android] ViewPager2 FragmentStateAdapterを使った基本的な実装

ViewPager2はスワイプで次々とページの画面遷移をさせるために利用します
作成方法は様々ありますが、シンプルにFragmentStateAdapterを使ってFragmentのページ遷移をさせてみます

Android Studio
2021.2.1




ViewPager2

 

ViewPager2ではスライドショーを作ることができ、ページがパッパッと変わるのではなくアニメーションを自動でやってくれます

ViewPager2では、様々なアプローチがありますが、

  1. 遷移する画面を個別に作成
  2. 毎回画面を自動で作成
  3. アダプターはFragmentStateAdapter
  4. アダプターはRecyclerView.Adapter

ここでは、1と3を想定して作成してみます

 

 

ViewPager2の例

 

分かりやすく画面の遷移させるためのFragmentを
3つ作成してスライドさせてみます

1x1.trans - [Android] ViewPager2 FragmentStateAdapterを使った基本的な実装 1x1.trans - [Android] ViewPager2 FragmentStateAdapterを使った基本的な実装 1x1.trans - [Android] ViewPager2 FragmentStateAdapterを使った基本的な実装
 

画面のレイアウト

スライドする画面のレイアウトを作成します
とりあえずページ表示する文字と背景色を変えられるようにします

fragment_page1.xml

 

Fragment作成

先に作成したレイアウトfragment_page1.xmlをonCreateView()に返すFragmentを作成します

冗長ですが分かりやすくするために、FragmentはonCreateView()とそれに属するレイアウトだけのシンプルなFragmentとそのレイアウトをそれぞれ3つ作成したいと思います

 

Adapterの作成

FragmentStateAdapter のコンストラクタ パラメータとして以下の選択肢があります

  • ViewPager2 オブジェクトが存在する FragmentActivity オブジェクトまたは Fragment オブジェクト、この方法が推奨されます
  • FragmentManager オブジェクトと Lifecycle オブジェクト

ここではFragmentActivityを使います

FragmentStateAdapterを継承したTestAdapterの作成

 

ViewPager2の追加

ViewPager2にはデフォルトで画面スライド アニメーションが表示されます

ViewPager2オブジェクトを含むレイアウトを作成
<androidx.viewpager2.widget.ViewPager2

activity_main.xml

Activityに、ViewPager2を使ったレイアウト用のコンテンツ ビューの設定

表示する新しいページを供給するためにアダプター クラスを使いますが、2種類あります

  • FragmentStateAdapter
  • RecyclerView.Adapter

ここではFragmentStateAdapterを使っていきます

Activityを設定

 

サンプルコード

 

MainActivity.java

TestAdapter.java

ライブラリーの追加、これはTabLayoutなどを使う場合に必要です(このサンプルでは無くても動きます)
build.gradle

activity_main.xml

Fragment01,java

Fragment02,java

Fragment03,java

fragment_page1.xml

fragment_page2.xml

fragment_page3.xml

strings.xml

 

サンプルコード2

 

コンストラクタ パラメータとして
FragmentManager オブジェクトと Lifecycle オブジェクトを使った例です

MainActivity.java

TestAdapter.java

他のファイルは同様です
 
 
 

References:
ViewPager2 を使用してフラグメント間をスライドする
ViewPager2
ViewPager から ViewPager2 に移行する

シェアする

  • このエントリーをはてなブックマークに追加

フォローする