Androidアプリ内チュートリアル作成の取り組み
新規でアプリをインストールした際に下のように画面を表示できるようにしたいと思っています。
実装手順
- LaunchedEffect()とdelay()でmutableState(チュートリアルを画像の集まりと考えてsceneと呼んでいる)を一定時間おきに進める
- そのmutableStateを提供するcompostionLocalを作成する
- ハイライトやテキストを付加させたいcomposableのmodifierをcompositionLocalの値に応じて渡す(以下にそのコード片を示す)
val textPaint = Paint().asFrameworkPaint().apply { textSize = 50.sp.value color = android.graphics.Color.BLACK } val modifierForButton:Modifier = if (isTutorial && LocalScene.current == 0) Modifier.drawBehind { drawCircle( Color.LightGray, this.size.maxDimension, alpha = 0.5f ) drawIntoCanvas { canvas: Canvas -> canvas.nativeCanvas.drawText( "description1", this.center.x, this.center.y + 90, textPaint ) } } else Modifier
改善したい点
- 条件分岐に応じてmodfierForButtonなどといった定義を要すること。
当初はModifierの拡張関数としてModifier.explainedBy(scene:Int):Modifier
などと定義して即座にcomposableに渡せたらと思っていたが、そのようにしてcompositionLocalの値を読もうとすると@Composable invocations can only happen from the context of a @Composable function
と言われてしまい出来なかった。