Quiero construir el siguiente diseño en Compose:

He escrito el siguiente código para esto:

 @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) }

Pero con esto, obtengo el siguiente resultado:

¿Cómo puedo lograr el objetivo?