Canvas {
drawRoundRect(
color = color,
cornerRadius = radius,
style = Stroke(
width = strokeWidth,
pathEffect = PathEffect.dashPathEffect(
intervals = floatArrayOf(onInterval, offInterval),
phase = onInterval + offInterval,
)
)
)
}
2021年7月26日月曜日
Jetpack Compose : 点線を描画する
点線を描画するには PathEffect.dashPathEffect() を使う
2021年7月1日木曜日
Jetpack Compose : Modifier.weight() の fill パラメータ
Modifier.weight() には float 値の他に fill するかどうかの boolean パラメータを指定できます。
fill に false を指定すると、割り当てられた領域より小さくなることができます。使わなかった領域は他のところに割り当てられません。
@Stable
fun Modifier.weight(
weight: Float,
fill: Boolean = true
): Modifier
fill に true を指定すると、割り当てられた領域を占めるように配置されます。fill に false を指定すると、割り当てられた領域より小さくなることができます。使わなかった領域は他のところに割り当てられません。
@Preview
@Composable
fun Sample() {
Column(modifier = Modifier.height(300.dp)) {
Column(
modifier = Modifier.weight(1f, true)
) {
Text("タイトル")
Text("メッセージ")
}
Button(
modifier = Modifier.weight(1f),
onClick = { /*TODO*/ },
) {
Text("Button")
}
}
}
@Preview
@Composable
fun Sample2() {
Column(modifier = Modifier.height(300.dp)) {
Column(
modifier = Modifier.weight(1f, false)
) {
Text("タイトル")
Text("メッセージ")
}
Button(
modifier = Modifier.weight(1f),
onClick = { /*TODO*/ },
) {
Text("Button")
}
}
}
@Preview
@Composable
fun Sample3() {
Column(modifier = Modifier.height(300.dp)) {
Column(
modifier = Modifier
) {
Text("タイトル")
Text("メッセージ")
}
Button(
modifier = Modifier.weight(1f),
onClick = { /*TODO*/ },
) {
Text("Button")
}
}
}
Sample2 では fill に false を指定しています。これにより "タイトル" と "メッセージ" を含む Column は 150dp より小さくなります。Sample3 と違い、Button の大きさを計算するときに考慮されるため Button の大きさは 150dp になります。