飴屋

Kotlin/ドロワーに再挑戦

前回、ScaffoldからdrawerContentを指定してドロワーを実装しようとしたら、今はその手が通じないと言われたのでした。マテリアル3(M3)への過渡期なんだそうです。いや、M2のことをちゃんと知らないので何とも言えないですが。

ModalNavigationDrawer

代わりにModalNavigationDrawerのdrawerContentを生やすとドロワーができるようです。子供にScaffoldを持たせればこれまで通りのものが作れそうです。

ModalNavigationDrawer(
    drawerContent = {
        ModalDrawerSheet {
            Text(stringResource(R.string.app_name), modifier = Modifier.padding(16.dp))
            HorizontalDivider()
            NavigationDrawerItem(
                label = { Text(text = stringResource(R.string.option_a)) },
                selected = false,
                onClick = {}
            )
        }
    }
) {
    Scaffold() { //... }
}

ここでいうdrawerContent的なものをスロットって呼ぶんですね~。Composableな部品を作る関数の引数みたいな丸括弧の中で属性のように定義できるのがスロットなのかな。そして、波括弧の中身が子要素って感じですかね。HTMLの作る構造に似ていて、WEBサイトをよく作る私なんかにはとっつきやすいように感じます。

とりあえず見本に倣って、テキストと横境界線(HorizontalDivider)、そしてNavigationDrawerItemという子要素を持つModalDrawerSheetをdrawerContent に生やしてみました。ModalDrawerSheetは何でしょうね~。引き出しの中の敷物って感じですかね。ドロワーの形状とか色を指定できそうです。NavigationDrawerItemは引き出しの中身で、クリックしたり、選択したり、名前を書いておいたりできそうです。引き出しが道具箱って感じにできそう。

NavigationDrawerItem

NavigationDrawerItemをもうちょっと深掘りしてみます。といっても、labelにTextを配置して、クリック時の挙動を書くくらいしか・・・あっ、アイコンがつけられそうですね。前のXMLのレイアウトでもiconのプロパティがありました。

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group android:checkableBehavior="single">
        <item
            android:id="@+id/hoge"
            android:icon="@drawable/ic_hoge
            android:title="@string/title_hoge" />
        ...
    </group>
</menu>

これがComposable関数になると以下のようになりました。

NavigationDrawerItem(
    label = { Text(text = stringResource(R.string.title_hoge)) },
    selected = false,
    icon = { Icon(painterResource(R.drawable.ic_hoge), contentDescription = null)},
    onClick = {
        ...
    }
)

それで、クリックされたときの挙動(onClick)を書こうとしてまた手が止まります。Intentを呼ぶようなシンプルなものなんですが、private変数にアクセスできない・・・あっ、AndroidStudioのテンプレートにあったGreeting関数を真似して書いてたんですが、この関数はActivityクラスの外側に書いてあるのか。じゃ、classの中にComposableな関数を入れちゃえばいいだけか・・・。でもなんで、Greeting関数は中に入ってなかったんでしょう?これはもしかして、Composable関数が部品のように他の画面からも呼び出されることが想定されて、あえて外に出されてるんじゃないか、って私は考えました。疎結合みたいな単語、Java屋さん好きじゃないですか。ってことは、外に置いたままでもうまくやる方法があるんじゃないかと予想されます。

次々と知らないことが湧いてきて、その都度調べ物が必要になり、全然実装が進みませんね。

一覧へ