Hi everyone! I'm fairly new to mobile development ...

# multiplatform

[Gleb]

Hi everyone! I'm fairly new to mobile development coming from the backend background. I'm having a lot of fun with KMP but now I realized that I cannot add the dependencies that I want to add. I would like to use certain iOS native features, like SF Symbols to have different icon sets for different platforms and also paint over the black spaces where the status bar and control UI is located. I tried adding these dependencies:
• Compose-cupertino
• Insetsx
But they don't seem to work for me at all after following the instructions for installing them, I get a number of errors as shown in the attachment screenshot (same for both dependencies).

I barely altered the build.gradle.kts file generated by the wizard and only did so through the Android studio suggestions. I'm using gradle 8.4

Here is the full code from the file:

import org.jetbrains.compose.ExperimentalComposeLibrary
import org.jetbrains.compose.desktop.application.dsl.TargetFormat
import org.jetbrains.kotlin.gradle.targets.js.dsl.ExperimentalWasmDsl

plugins {
    alias(libs.plugins.kotlinMultiplatform)
    alias(libs.plugins.androidApplication)
    alias(libs.plugins.jetbrainsCompose)
}

kotlin {
    @OptIn(ExperimentalWasmDsl::class)
    wasmJs {
        moduleName = "composeApp"
        browser {
            commonWebpackConfig {
                outputFileName = "composeApp.js"
            }
        }
        binaries.executable()
    }
    
    androidTarget {
        compilations.all {
            kotlinOptions {
                jvmTarget = "1.8"
            }
        }
    }
    
    jvm("desktop")
    
    listOf(
        iosX64(),
        iosArm64(),
        iosSimulatorArm64()
    ).forEach { iosTarget ->
        iosTarget.binaries.framework {
            baseName = "ComposeApp"
            isStatic = true
        }
    }

    sourceSets {
        val desktopMain by getting

        androidMain.dependencies {
            implementation(libs.compose.ui.tooling.preview)
            implementation(libs.androidx.activity.compose)
        }
        commonMain.dependencies {
            implementation(compose.runtime)
            implementation(compose.foundation)
            implementation(compose.material)
            implementation(compose.ui)
            @OptIn(ExperimentalComposeLibrary::class)
            implementation(compose.components.resources)
            implementation(compose.materialIconsExtended)
        }
        desktopMain.dependencies {
            implementation(compose.desktop.currentOs)
        }
    }
}

android {
    namespace = "org.example.test"
    compileSdk = libs.versions.android.compileSdk.get().toInt()

    sourceSets["main"].manifest.srcFile("src/androidMain/AndroidManifest.xml")
    sourceSets["main"].res.srcDirs("src/androidMain/res")
    sourceSets["main"].resources.srcDirs("src/commonMain/resources")

    defaultConfig {
        applicationId = "org.example.test"
        minSdk = libs.versions.android.minSdk.get().toInt()
        targetSdk = libs.versions.android.targetSdk.get().toInt()
        versionCode = 1
        versionName = "1.0"
    }
    packaging {
        resources {
            excludes += "/META-INF/{AL2.0,LGPL2.1}"
        }
    }
    buildTypes {
        getByName("release") {
            isMinifyEnabled = false
        }
    }
    compileOptions {
        sourceCompatibility = JavaVersion.VERSION_1_8
        targetCompatibility = JavaVersion.VERSION_1_8
    }
    dependencies {
        debugImplementation(libs.compose.ui.tooling)
    }
}
dependencies {
}

compose.desktop {
    application {
        mainClass = "MainKt"

        nativeDistributions {
            targetFormats(TargetFormat.Dmg, TargetFormat.Msi, TargetFormat.Deb)
            packageName = "org.example.test"
            packageVersion = "1.0.0"
        }
    }
}

compose.experimental {
    web.application {}
}

Any help would be much appreciated

[Alexander Zhirkevich]

To paint over status bar you just need to add .ignoresSafeArea(.all) after ComposeView() in your Swift file, no extra library required. And then just use Scaffold or Modifier.statusBarPadding()

[Alexander Zhirkevich]

compose-cupertino doesn't support wasmJs yet

[Gleb]

Very kind of you to respond, thank you very much, that helped indeed. Looking forward to warm support