我想在 Compose 中構建以下布局:

我為此撰寫了以下代碼:
@Composable
fun MainScreenContent(){
Surface(
color = MaterialTheme.colors.primary,
modifier = Modifier
.wrapContentWidth(Alignment.CenterHorizontally)
.wrapContentHeight(Alignment.CenterVertically)
) {
Row() {
Column(Modifier.weight(0.3F)) {
Greeting("Android")
Spacer(Modifier.padding(16.dp))
Greeting("User")
}
Surface(modifier = Modifier.weight(0.4F),
color = MaterialTheme.colors.primaryVariant,
){
Spacer(Modifier.padding(16.dp))
}
Column(Modifier.weight(0.3F)) {
Greeting("Android")
Spacer(Modifier.padding(16.dp))
Greeting("User")
}
}
}
}
@Composable
fun Greeting(name: String) {
Text(text = "Hello $name!",
Modifier
.padding(16.dp), fontSize = 30.sp)
}
但是有了這個,我得到以下輸出:

我怎樣才能實作目標?
uj5u.com熱心網友回復:
將 parentSurface的高度設定為IntrinsicSize.Max,并添加fillMaxHeight()到 innerSurface的修飾符。
@Composable
fun MainScreenContent() {
Surface(
...,
modifier = Modifier
.wrapContentWidth(Alignment.CenterHorizontally)
.height(IntrinsicSize.Max),
) {
Row {
...
Surface(
modifier = Modifier
.weight(0.4F)
.fillMaxHeight(),
color = MaterialTheme.colors.primaryVariant,
) {
Spacer(Modifier.padding(16.dp))
}
...
}
}
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/438435.html
標籤:安卓 科特林 android-jetpack-compose
上一篇:TextInputLayout標簽重疊AppCompatAutoCompleteTextView輸入
下一篇:如何使用樹莓派啟動vue服務器?
