「Compose を用いた Android アプリ開発の基礎」やってみた

[初心者向けトレーニングコース](https://developer.android.com/courses?hl=ja)に沿ってAndroidStudioに触ってみました。
Kotlinの文法、Modifierの書き方等、あいまいな部分があったのでまとめようと思います。
間違いがあればご指摘ください。
importについては補助機能を使えば憶える必要がなさそうなので、省略します。

```Kotlin:
@Composable
fun GreetingText(message: String, from: String,modifier: Modifier = Modifier){    //①
        Column(                                                                   //②
            verticalArrangement = Arrangement.Center,
            modifier = modifier
        ) {
            Text(                                                                 //③
                text = message,
                fontSize = 100.sp,
                lineHeight = 116.sp,
                textAlign = TextAlign.Center
            )
            Text(                                                                 //④
                text = from,
                fontSize = 36.sp,
                modifier = Modifier
                    .padding(16.dp)
                    .align(alignment = Alignment.CenterHorizontally)
            )
        }
}
```
## ①関数の宣言
String型の引数2つとModifier型引数1つを受け取る。値を返さない。
Modifier型引数は初期化を行っている。(この辺の認識があいまい。初期化で合ってるのか？)
すべてのComposableな関数は、Modifierを受け取る必要がある。
#### @ Composable を付けて宣言された関数
SetContent()関数や他のComposableな関数から呼び出すことができる。入力を受け取り、画面に表示されるものを生成する。パスカルケースで命名する。

## ②アプリのレイアウトを行う
{}で囲まれた子要素を配置する。
最後に渡すパラメータはcontentであり、省略されている。
content = を省略し、{}で受け取ることができる。<Strong>後置ラムダ構文</Strong>
### Column()
縦並びで子要素を配置して表示する。
#### verticalArrangement
垂直位置を決める引数。Arrangement.〇〇を受け取る。
#### horizontalAlignment
水平位置を決める引数。Alignment.〇〇を受け取る。サンプルコードでは未使用。


### Row()
横並びで子要素を配置して表示する。サンプルコードでは未使用。
horizontalArrangement 水平位置を決める引数。Arrangement.〇〇を受け取る。
verticalAlignment 垂直位置を決める引数。Alignment.〇〇を受け取る。
### Box()
子要素を重ねて表示する。後述サンプルコード内で使用。

## ③、④String型引数を表示する
#### text
String型の引数を受け取る。
#### fontSize
文字の高さ。
#### lignHeight
表示される範囲の高さ。
#### sp
拡張可能ピクセル ディスプレイのサイズによって大きさが変わる。
#### dp
密度非依存ピクセル。
#### textAlign
テキストの表示位置を指定。TextAlign.〇〇を渡す。
#### Modifier.padding()
余白を設定する。引数を渡して上下左右方向それぞれに設定することもできる。
4.dpの倍数での設定を推奨。
#### Modifier.align()
表示する位置を指定する。親要素の指定に反して配置可能。Alignment.〇〇を渡す。
```Kotlin:
@Composable
fun GreetingImage(message: String,from: String,modifier: Modifier = Modifier){    //⑤
    val image = painterResource(R.drawable.androidparty)
    Box(modifier) {
        Image(                                                                    //⑥
            painter = image,
            contentDescription = null,
            contentScale = ContentScale.Crop,
            alpha = 0.5F
        )
        GreetingText(                                                             //⑦
            message = message,
            from = from,
            modifier = Modifier
                .fillMaxSize()
                .padding(8.dp)
        )
    }
}
```
## ⑤関数の宣言
Box()を用いて画像とGreetingTextのテキストを配置する。
受け取る引数はGreetingTextと同じ。
変数imageを宣言し、表示する画像の参照を与える。
#### painterResouce(R.drawable.〇〇)
リソースとして登録した画像の参照。〇〇は登録名。
## ⑥配置する画像を宣言
#### Image
引数painterに画像の参照を渡す。
#### contentDescription = null
Imageコンポーザブルを宣言すると発生するエラーを解除するための引数。
#### contentScale
画像の大きさを設定する。
ContentScale.Crop 表示範囲に合わせて画像を切り抜いて表示する。
#### alpha
画像の透過度をfroat値で設定する。
プレビューだと画像が薄く表示されましたが、pixel6a実機で実行すると引数を渡さないよりも濃く表示され、まだ理解できていません。
## ⑦関数の呼び出し
①で定義した関数を呼び出す。
#### Modifier.fillMaxSize()
親によって許可されているWidth、Heightの最大の大きさに拡大する。

---
乱文失礼しました。
読みやすいまとめを書く難しさを実感します。
ここまで読んでいただきありがとうございました。