[Jetpack Compose] 複数のComposableを簡単にColumnなどでwrapするショートカット

Jetpack ComposeでAndroid開発をするとき、複数のText ComposableをColumnで囲うなどよくあると思います。

Android Studioには、このような時に便利なショートカットSurround with widgetがあります。

Surround with widget

例えば以下のような構成のComposableがあるとします

@Composable
fun MessageCard(msg: Message) {
    Text(text = msg.author)
    Text(text = msg.body)
}

これを、以下のようにColumnでwrapしたいとします。

@Composable
fun MessageCard(msg: Message) {
    Column {
        Text(text = msg.author)
        Text(text = msg.body)
    }
}

2つのText ComposableをカットしてColumnの中に貼り付けて。。。というのは面倒なので、以下のようにショートカットを使います。

wrapしたいComposableをハイライトしてバルブアイコンを選択すると"Surround with widget"という項目があります。
その中に、Container, Row, Columnの3つが用意されているのでいずれかを選ぶことで簡単にwrapすることができます。

Have a nice compose !!