Androidの初回起動時に表示させるウォークスルーのライブラリを探していると、更新が止まっているものが多い中、AppIntroと言う良さげなのを見つけたのでご紹介します。

AppIntro ~Make a cool intro for your Android app~

GitHub

• ☆ 9,800 over
• API >= 14 compatible
• 100% Kotlin
• Support Library or AndroidX
• Support for runtime permissions
• Full RTL support

Support Library版とAndroidX版を選べるのは嬉しいですね。バージョン4系が古い方になります。

パーミッション画面に対応しているのは珍しいかも。これだけでも熱意が伝わります。既存のレイアウトなら、説明に従ってすぐに実装できると思います。

ページをフルカスタムする

PagerViewにフラグメントが載る構成なので、素のフラグメントをカスタムすればページは好きなように作れますし、カスタム用のAppIntroCustomLayoutFragmentクラスを使っても良いと思います。

ページを少しカスタムする

タイトルを下にしたい、画像を大きくしたい、アイコンを添えたい。。。そういった場合には、既存のAppIntroFragmentクラスに対応したappintro_fragment_introレイアウトを作ると、ベースの機能がそのまま使えて便利になります。

appintro_fragment_intro.xml

内部で使われているIDを4つ設定して下さい。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/main">

    <ImageView
            android:id="@+id/image" />

    <TextView
            android:id="@+id/title" />

    <TextView
            android:id="@+id/description" />

</androidx.constraintlayout.widget.ConstraintLayout>

CustomAppIntro (Activity)

AppIntroFragmentにパラメータを渡してページを追加します。

ページ間のカラートランジションも効きます。公式によるとSlideBackgroundColorHolderを実装とあるのですが、isColorTransitionsEnabledだけで効くようです。

class CustomAppIntro: AppIntro() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        
        addSlide(AppIntroFragment.newInstance(imageDrawable = R.drawable.intro_1, backgroundColor = Color.RED))
        addSlide(AppIntroFragment.newInstance(imageDrawable = R.drawable.intro_2, backgroundColor = Color.BLUE))
        addSlide(AppIntroFragment.newInstance(imageDrawable = R.drawable.intro_3, backgroundColor = Color.GREEN))
        addSlide(AppIntroFragment.newInstance(imageDrawable = R.drawable.intro_4, backgroundColor = Color.YELLOW))

        setTransformer(AppIntroPageTransformerType.Parallax())
        showStatusBar(false)
        isColorTransitionsEnabled = true
    }

    override fun onSkipPressed(currentFragment: Fragment?) = finish()
    override fun onDonePressed(currentFragment: Fragment?) = finish()
}

マニフェストに追加

<activity
    android:name=".CustomAppIntro"
    android:configChanges="orientation|screenSize"
    android:theme="@style/AppTheme.AppIntro" />

MainActivity

あとはメイン画面から呼び出すだけ。2回目以降表示させない場合は、SharedPreferencesにフラグを記録しておいてチェックすればOKです。

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    startActivity(Intent(this, CustomAppIntro::class.java))
}