Android開発でのKotlin・JetpackCompose

はじめに

Kotlin自体はバックエンドの開発で触りましたが、Android開発ではまた別の実装方法がありました。
Android開発で使用したJetpackComposeとKotlinで学んだ知識をまとめていきます。

Column()

Column() は 縦方向に要素を並べるコンテナです。

Column(
    horizontalAlignment = Alignment.CenterHorizontally // センターに表示させる
) {
    // 子要素
}

Text()

Text() は 画面に文字列を表示するために使用します。
ラベルや説明文などに使います。

Text(
    text = "hello",
    fontSize = 16.sp, //フォントサイズ
    color = Color.Blue,// カラー
    fontWeight = FontWeight.Bold //書体
)

Button()

ボタン機能です。

Button(
     colors = ButtonDefaults.buttonColors(backgroundColor = Color(/* ボタンカラー */)),
     onClick = { /* クリック時の処理 */ },
) {
     Text(text = "登録", color = Color.White)
}

Image()

画像を表示するために使用します。

Image(
    painter = painterResource(id = /* 画像のパス */),
    contentDescription = "プロフィール",
    modifier = Modifier
        .size(100.dp)
        .clip(RoundedCornerShape(10.dp)) // 画像サイズなどの指定
)

Spacer()

空白を作る際に使用します。

Column {
    Text("apple")
    Spacer(modifier = Modifier.height(16.dp))
    Text("orange")
}

Surface()

コンテナ内で背景色をつけたい際に使用します。

Surface(color = Color.LightGray) {
    Text("apple")
}

LazyColumn()

LazyColumn、スクロール可能なリストを表示したい際に使用します。
似たようなものにLazyRow()というのもあります。

LazyColumn {
    items(5) { i ->
        Text(i)
    }
}