どっこと備忘録群

アウトプットしないとインプットできない私が Androidアプリ開発をメインとした備忘録を載せています。

Modifierコンポーサブル(Jetpack Compose)を扱う

Modifierは、Jetpack Composeのコンポーザブルに共通のパラメータを設定するためのオブジェクト。 Android Viewにおけるビューのレイアウト属性やスタイル設定に相当。

Modifierのパラメータチートシート

Modifierでよく使われるパラメータは以下の通り。複数の修飾子をチェーンでつなげて適用できる。

Modifier
    // ****** サイズ関連 ****** //
    .width(20.dp)       // 幅を指定
    .height(20.dp)      // 高さを指定
    .size(20.dp)        // 縦横のサイズを統一して指定
    .fillMaxWidth()     // 親コンポーネントの幅いっぱいに広げる
    .fillMaxHeight()    // 親コンポーネントの高さいっぱいに広げる
    .fillMaxSize()      // 親コンポーネントの縦横いっぱいに広げる
    .widthIn(min = 20.dp, max = 50.dp) // 幅の最小・最大値を指定
    .heightIn(min = 20.dp, max = 50.dp) // 高さの最小・最大値を指定

    // ****** 背景・枠線関連 ****** //
    .background(Color.Red) // 背景色を指定
    .border(width = 3.dp, color = Color.Blue) // 枠線を追加

    // ****** 余白関連 ****** //
    .padding(10.dp)                       // 上下左右に均等な余白を追加
    .padding(horizontal = 10.dp)          // 左右に均等な余白を追加
    .padding(vertical = 10.dp)            // 上下に均等な余白を追加
    .padding(top = 10.dp, bottom = 10.dp) // 特定の方向に余白を追加

    // ****** 配置関連 ****** //
    .align(Alignment.CenterHorizontally) // 親コンポーネント内で水平方向に中央揃え(`Column`内などで使用)
    .align(Alignment.CenterVertically)   // 親コンポーネント内で垂直方向に中央揃え(`Row`内などで使用)

    // ****** タップ処理関連 ****** //
    .clickable { /* タップ時の処理 */ }  // タップ可能にし、リスナーを設定

リソースで定義した余白を使う

dimens.xmlに定義した値をdimensionResource関数を使って参照できる。 これにより、余白の値を一元管理でき、メンテナンスが容易になる。

res/values/dimens.xml

<dimen name="padding_small">8dp</dimen>

Composeコード

val smallPadding = dimensionResource(R.dimen.padding_small)
Text(
    text = "...",
    modifier = Modifier.padding(smallPadding)
)

この方法を使うと、画面サイズや向きに応じて異なる余白を適用するといった、より柔軟な対応もできる。

最終更新: 2025.9.22