Как сделать текстовый центр по вертикали в Android Compose? ⇐ Android

[Anonymous]

Я работаю над своим первым приложением, полностью разработанным Compose. В традиционной практике Android Dev я сделал это по сравнению с собственностью. Text () Compose также обладает свойством выравнивания, но в этот момент он имеет ограниченную емкость (Alignment.Horizontal() разрешено только), несмотря на то, что я заметил различные значения выравнивания в Text () при проведении исследования в Интернете. Аналогичный случай для column () - он также имеет свойство выравнивания. > тоже. < /p>
Как вы думаете о достижении этого визуального эффекта? Полный кодовый элемент ниже < /p>
@ExperimentalUnitApi
@Composable
fun TripBookingContent(state: PassengerTripUiState.TripBookUiState) {
Log.d(App.TAG, "[screen] TripBookingContent")
val baselineGrid = dimensionResource(id = R.dimen.baseline_grid)
val mainPadding = dimensionResource(id = R.dimen.main_margin_compact)
var componentSpace = dimensionResource(id = R.dimen.component_space)
Column(
modifier = Modifier
.wrapContentHeight()
.fillMaxWidth()
.padding(
paddingValues = PaddingValues(
horizontal = mainPadding,
vertical = baselineGrid
)
)
) {
TripViewItem(
data = state.trip,
{},
modifier = Modifier.padding(vertical = baselineGrid)
)
Text(
text = stringResource(id = R.string.booking_screen_driver),
color = colorResource(id = R.color.white),
style = TextStyle(textIndent = TextIndent(firstLine = TextUnit(16F, TextUnitType.Sp))),
modifier = Modifier
.height(componentSpace)
.padding(start = baselineGrid)
.fillMaxWidth()
.background(color = colorResource(id = R.color.design_default_color_secondary_variant))
)
Log.d(App.TAG, "[state] state.driver - ${state}")
Log.d(App.TAG, "[state] state.driver.toDriver() - ${state.driver}")
DriverCardContent(data = state.driver)

Text(
text = stringResource(id = R.string.booking_screen_msg),
color = colorResource(id = R.color.white),
style = TextStyle(textIndent = TextIndent(firstLine = TextUnit(16F, TextUnitType.Sp))),
textAlign = TextAlign.Center,
modifier = Modifier
// .height(componentSpace)
.height(32.dp)
.padding(start = baselineGrid)
.fillMaxWidth()
.background(color = colorResource(id = R.color.colorPrimaryDark))
)
/**
* Disable book button at current (alfa version), for more details
* */
Button(
onClick = { /* no op */ },
modifier = Modifier
.alpha(0F)
.fillMaxWidth()
.padding(baselineGrid)
.height(dimensionResource(id = R.dimen.button_height)),
colors = ButtonDefaults.buttonColors(
backgroundColor = Color.Blue,
contentColor = Color.White
),
) {
Text(
text = stringResource(id = R.string.booking_screen_confirm_button),
modifier = Modifier.align(Alignment.CenterVertically),
fontWeight = FontWeight.Bold
)
}
}
}
< /code>
Обновление
Мое окончательное решение стать этим ниже. Я должен переместить накладку и фон в слой Box () для достижения текста в центре как по вертикали, так и по горизонтали. < /P>
Box(
contentAlignment = Alignment.Center,
modifier = Modifier
.height(32.dp)
.padding(start = baselineGrid)
.fillMaxWidth()
.background(color = colorResource(id = R.color.colorPrimaryDark))
) {
Text(
text = stringResource(id = R.string.booking_screen_msg),
color = colorResource(id = R.color.white),
style = TextStyle(textIndent = TextIndent(firstLine = TextUnit(16F, TextUnitType.Sp))),
textAlign = TextAlign.Center,
/* modifier = Modifier
// .height(componentSpace)
.height(32.dp)
.padding(start = baselineGrid)
.fillMaxWidth()
.background(color = colorResource(id = R.color.colorPrimaryDark))*/
)
}


Подробнее здесь: https://stackoverflow.com/questions/707 ... id-compose