example: Add Card to Dropdown Page

miuix-kotlin-multiplatform · Oct 19, 2024 · d2f1a94 · d2f1a94
1 parent 122732c
commit d2f1a94
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 13 deletions.
diff --git a/composeApp/src/commonMain/kotlin/MainPage.kt b/composeApp/src/commonMain/kotlin/MainPage.kt
@@ -55,7 +55,8 @@ fun MainPage(
             ) {
                 item {
                     SearchBar(
-                        modifier = Modifier.padding(horizontal = 12.dp, vertical = 10.dp),
+                        modifier = Modifier
+                            .padding(start = 12.dp, end = 12.dp, top = 12.dp, bottom = 6.dp),
                         inputField = {
                             InputField(
                                 query = miuixSearchValue,

diff --git a/composeApp/src/commonMain/kotlin/SecondPage.kt b/composeApp/src/commonMain/kotlin/SecondPage.kt
@@ -1,11 +1,11 @@
 import androidx.compose.foundation.layout.PaddingValues
-import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
+import top.yukonga.miuix.kmp.basic.Card
 import top.yukonga.miuix.kmp.basic.LazyColumn
 import top.yukonga.miuix.kmp.basic.ScrollBehavior
 import top.yukonga.miuix.kmp.extra.SuperDropdown
@@ -22,17 +22,21 @@ fun SecondPage(
         contentPadding = PaddingValues(top = padding.calculateTopPadding()),
         topAppBarScrollBehavior = topAppBarScrollBehavior
     ) {
-        items(20) {
-            SuperDropdown(
-                title = "Dropdown",
-                summary = "Popup near click",
-                items = dropdownOptions,
-                selectedIndex = dropdownSelectedOption.value,
-                onSelectedIndexChange = { newOption -> dropdownSelectedOption.value = newOption }
-            )
-        }
         item {
-            Spacer(modifier = Modifier.height(padding.calculateBottomPadding()))
+            Card(
+                modifier = Modifier
+                    .padding(horizontal = 12.dp)
+                    .padding(top = 12.dp, bottom = 12.dp + padding.calculateBottomPadding())
+            ) {
+                for (i in 0 until 20) {
+                    SuperDropdown(
+                        title = "Dropdown",
+                        items = dropdownOptions,
+                        selectedIndex = dropdownSelectedOption.value,
+                        onSelectedIndexChange = { newOption -> dropdownSelectedOption.value = newOption }
+                    )
+                }
+            }
         }
     }
 }