refactor: merge to Flexi UI and new usage

shared/build.gradle.kts

@@ -4,8 +4,6 @@ plugins {
     autowire(libs.plugins.jetbrains.compose)
 }
 
-group = property.project.groupName
-
 kotlin {
     androidTarget()
     jvm("desktop")
@@ -21,23 +19,17 @@ kotlin {
     }
     jvmToolchain(17)
     sourceSets {
-        all {
-            languageSettings {
-                optIn("androidx.compose.material3.ExperimentalMaterial3Api")
-            }
-        }
         val commonMain by getting {
             dependencies {
                 implementation(compose.runtime)
                 implementation(compose.foundation)
-                implementation(compose.material3)
-                implementation(com.highcapable.betterandroid.compose.extension)
-                implementation(com.highcapable.betterandroid.compose.multiplatform)
+                api(com.highcapable.flexiui.core)
+                api(com.highcapable.betterandroid.compose.extension)
+                api(com.highcapable.betterandroid.compose.multiplatform)
             }
         }
         val androidMain by getting {
             dependencies {
-                api(compose.foundation)
                 api(androidx.core.core.ktx)
                 api(androidx.activity.activity)
                 api(androidx.activity.activity.compose)
@@ -49,9 +41,6 @@ kotlin {
         val desktopMain by getting {
             dependencies {
                 api(compose.desktop.currentOs)
-                api(compose.runtime)
-                api(compose.foundation)
-                api(compose.material3)
             }
         }
         val iosX64Main by getting

shared/src/androidMain/kotlin/App.android.kt

@@ -1,4 +0,0 @@
-import androidx.compose.runtime.Composable
-
-@Composable
-fun MainView() = App()

shared/src/commonMain/kotlin/App.kt

@@ -1,13 +1,10 @@
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
+package __GROUP_NAME__
+
+import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.safeDrawingPadding
-import androidx.compose.material3.Button
-import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
@@ -16,44 +13,70 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
+import com.highcapable.betterandroid.compose.multiplatform.systembar.PlatformSystemBarStyle
 import com.highcapable.betterandroid.compose.multiplatform.systembar.PlatformSystemBars
 import com.highcapable.betterandroid.compose.multiplatform.systembar.rememberSystemBarsController
+import com.highcapable.betterandroid.compose.multiplatform.systembar.setStyle
+import com.highcapable.flexiui.FlexiTheme
+import com.highcapable.flexiui.component.AreaColumn
+import com.highcapable.flexiui.component.Button
+import com.highcapable.flexiui.component.PrimaryAppBar
+import com.highcapable.flexiui.component.Scaffold
+import com.highcapable.flexiui.component.Text
+import com.highcapable.flexiui.defaultColors
 
+@Composable
+private fun MyApplicationTheme(content: @Composable () -> Unit) {
+    val systemBars = rememberSystemBarsController()
+    val currentDarkMode = isSystemInDarkTheme()
+    val colorScheme = defaultColors(currentDarkMode)
+    systemBars.setStyle(
+        if (currentDarkMode)
+            PlatformSystemBarStyle.DarkTransparent
+        else PlatformSystemBarStyle.LightTransparent
+    )
+    // Customize Flexi UI theme styles.
+    FlexiTheme(
+        colors = colorScheme,
+        content = content
+    )
+}
+
+// Generated by https://github.com/BetterAndroid/compose-multiplatform-template
+// You can visit https://github.com/BetterAndroid/FlexiUI to learn how to use Flexi UI.
 @Composable
 fun App() {
-    MaterialTheme {
+    MyApplicationTheme {
+        MainScreen()
+    }
+}
+
+@Composable
+fun MainScreen() {
+    Scaffold(
+        appBar = {
+            PrimaryAppBar(
+                title = { Text("__APP_NAME__") }
+            )
+        }
+    ) { innerPadding ->
         val systemBars = rememberSystemBarsController()
         var hideOrShowBars by remember { mutableStateOf(false) }
-        var greeting by remember { mutableStateOf("Hello world!") }
-        Column(modifier = Modifier.safeDrawingPadding()) {
-            Row(
-                modifier = Modifier.padding(15.dp),
-                verticalAlignment = Alignment.CenterVertically
-            ) {
-                Text(
-                    text = "__APP_NAME__",
-                    fontSize = 20.sp,
-                    fontWeight = FontWeight.Bold
-                )
-            }
-            Column(
-                modifier = Modifier.fillMaxSize(),
-                verticalArrangement = Arrangement.Center,
-                horizontalAlignment = Alignment.CenterHorizontally
-            ) {
-                Text(text = greeting)
-                Spacer(Modifier.padding(15.dp))
-                Button(onClick = { greeting = "Hello Jetpack Compose Multiplatform!" }) {
-                    Text(text = "Greeting")
-                }
-                Spacer(Modifier.padding(15.dp))
-                Button(onClick = { hideOrShowBars = !hideOrShowBars }) {
-                    Text(text = "Trigger SystemBars")
-                }
-            }
+        var greeting by remember { mutableStateOf("Hello World!") }
+        AreaColumn(
+            modifier = Modifier.fillMaxWidth().padding(innerPadding),
+            horizontalAlignment = Alignment.CenterHorizontally
+        ) {
+            Text(text = greeting)
+            NecessarySpacer()
+            Button(
+                onClick = { greeting = "Hello Jetpack Compose Multiplatform!" }
+            ) { Text(text = "Greeting") }
+            NecessarySpacer()
+            Button(
+                onClick = { hideOrShowBars = !hideOrShowBars }
+            ) { Text(text = "Trigger SystemBars") }
         }
         LaunchedEffect(hideOrShowBars) {
             if (hideOrShowBars)
@@ -61,4 +84,9 @@ fun App() {
             else systemBars.show(PlatformSystemBars.All)
         }
     }
+}
+
+@Composable
+private fun NecessarySpacer() {
+    Spacer(Modifier.height(20.dp))
 }

shared/src/desktopMain/kotlin/App.desktop.kt

@@ -1,4 +0,0 @@
-import androidx.compose.runtime.Composable
-
-@Composable
-fun MainView() = App()

shared/src/iosMain/kotlin/App.ios.kt

@@ -1,9 +0,0 @@
-@file:Suppress("unused")
-
-import androidx.compose.runtime.Composable
-import com.highcapable.betterandroid.compose.multiplatform.platform.AppComponentUIViewController
-
-fun createUIViewController() = AppComponentUIViewController { MainView() }
-
-@Composable
-fun MainView() = App()

shared/src/iosMain/kotlin/MainViewController.kt

@@ -0,0 +1,6 @@
+@file:Suppress("unused")
+
+import __GROUP_NAME__.App
+import com.highcapable.betterandroid.compose.multiplatform.platform.AppComponentUIViewController
+
+fun createMainViewController() = AppComponentUIViewController { App() }