I'm using the compose multiplatform to build an ap...

# multiplatform

[zrll]

I'm using the compose multiplatform to build an app. My app looks alright on Android, but on iOS, there are white spaces on the top and bottom, where they are supposed to have background color. I don't know whether this is caused by Scaffold.
My code:

@OptIn(ExperimentalMaterial3Api::class)
@Composable
@Preview
fun App() {
    AppTheme {
        var showContent by remember { mutableStateOf(false) }
        Scaffold(
            Modifier.fillMaxWidth(),
            topBar = { TopAppBar({ Text("Event Reminder") }) }) {
            Column(Modifier.padding(it).fillMaxWidth().padding(20.dp), horizontalAlignment = Alignment.CenterHorizontally) {
                Button(onClick = { showContent = !showContent }) {
                    Text("Click me!")
                }
                AnimatedVisibility(showContent) {
                    val greeting = remember { Greeting().greet() }
                    Column(
                        Modifier.fillMaxWidth(),
                        horizontalAlignment = Alignment.CenterHorizontally
                    ) {
                        Image(painterResource(Res.drawable.compose_multiplatform), null)
                        Text("Compose: $greeting")
                    }
                }
            }

        }
    }
}

[krzysztof]

the non-white area where your composables are visible is called safe area - the white areas are excluded from drawing, to not obscure system bars. If your project is generated by KMP wizard, check out the ContentView.swift file, where .ignoreSafeArea modifier is applied in swift view.

I hope this might give you more insight: https://swiftwithmajid.com/2021/11/03/managing-safe-area-in-swiftui/

[Colton Idle]

Update ContentView.swift and add .ignoresSafeArea(edges: .all)

[Tim Karagosian]

@zrll I'll add a little to this in that there may be some aspect ratio and screen size differences as well that you may want to handle. I have multiple checks in my code to figure out the aspect ratio and platform and then position my assets accordingly. My app is very UI heavy for full context.