How to center elements inside the first Column which is embedded inside a Row:
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
MaterialTheme {
Row {
Column(modifier = LayoutPadding(top = 16.dp)) {
Text(text = "Centered ", style = TextStyle(fontSize = 30.sp, fontWeight = FontWeight.Bold))
}
Column {
Text(text = "Line One ", style = TextStyle(fontSize = 30.sp, fontWeight = FontWeight.Bold))
Text(text = "Line Two ", style = TextStyle(fontSize = 30.sp, fontWeight = FontWeight.Bold))
}
}
}
}
}
}
In this example I hardcoded padding, but was not able to figure out how to center the elements out of the box. If there is no such an option, how can I get a height of the whole Row?
With 1.0.0
use the Modifier.align
in your Column
Row (){
Column( modifier = Modifier.align(Alignment.CenterVertically)){
Text(text = "Centered ", style = textStyle)
}
Column {
Text(text = "Line One ", style = textStyle)
Text(text = "Line Two ", style = textStyle)
}
}
or you can use the verticalAlignment = Alignment.CenterVertically
in the Row
element:
Row (verticalAlignment = Alignment.CenterVertically){
Column(){
Text(text = "Centered ", style = textStyle)
}
Column() {
Text(text = "Line One ", style = textStyle)
Text(text = "Line Two ", style = textStyle)
}
}
Container(alignment = Alignment.TopCenter) or Center{} will help you.
Try this,
MaterialTheme {
Row {
Container(width = 200.dp) {
Center {
Column() {
Text(text = "Centered ", style = TextStyle(fontSize = 30.sp, fontWeight = FontWeight.Bold))
}
}
}
Column {
Text(text = "Line One ", style = TextStyle(fontSize = 30.sp, fontWeight = FontWeight.Bold))
Text(text = "Line Two ", style = TextStyle(fontSize = 30.sp, fontWeight = FontWeight.Bold))
}
}
}
or
MaterialTheme {
Row {
Container(width = 200.dp, alignment = Alignment.TopCenter) {
Column() {
Text(text = "Centered ", style = TextStyle(fontSize = 30.sp, fontWeight = FontWeight.Bold))
}
}
Column {
Text(text = "Line One ", style = TextStyle(fontSize = 30.sp, fontWeight = FontWeight.Bold))
Text(text = "Line Two ", style = TextStyle(fontSize = 30.sp, fontWeight = FontWeight.Bold))
}
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.