Skip to content

Commit fab3b6e

Browse files
authored
Merge branch 'miuix-kotlin-multiplatform:main' into main
2 parents 1cfdc4d + 0329f33 commit fab3b6e

File tree

4 files changed

+165
-41
lines changed

4 files changed

+165
-41
lines changed

example/src/commonMain/kotlin/MainPage.kt

Lines changed: 6 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@ import androidx.compose.foundation.layout.height
1313
import androidx.compose.foundation.layout.navigationBars
1414
import androidx.compose.foundation.layout.only
1515
import androidx.compose.foundation.layout.padding
16-
import androidx.compose.foundation.layout.size
1716
import androidx.compose.foundation.layout.windowInsetsPadding
1817
import androidx.compose.foundation.lazy.LazyColumn
1918
import androidx.compose.runtime.Composable
@@ -22,20 +21,19 @@ import androidx.compose.runtime.mutableStateOf
2221
import androidx.compose.runtime.remember
2322
import androidx.compose.runtime.setValue
2423
import androidx.compose.ui.Modifier
25-
import androidx.compose.ui.draw.alpha
2624
import androidx.compose.ui.input.nestedscroll.nestedScroll
25+
import androidx.compose.ui.text.TextStyle
26+
import androidx.compose.ui.text.font.FontWeight
2727
import androidx.compose.ui.unit.dp
28+
import androidx.compose.ui.unit.sp
2829
import component.OtherComponent
2930
import component.TextComponent
3031
import top.yukonga.miuix.kmp.basic.BasicComponent
31-
import top.yukonga.miuix.kmp.basic.Icon
3232
import top.yukonga.miuix.kmp.basic.InputField
3333
import top.yukonga.miuix.kmp.basic.ScrollBehavior
3434
import top.yukonga.miuix.kmp.basic.SearchBar
3535
import top.yukonga.miuix.kmp.basic.SmallTitle
3636
import top.yukonga.miuix.kmp.basic.Text
37-
import top.yukonga.miuix.kmp.icon.MiuixIcons
38-
import top.yukonga.miuix.kmp.icon.icons.useful.Search
3937
import top.yukonga.miuix.kmp.theme.MiuixTheme
4038
import top.yukonga.miuix.kmp.utils.overScrollVertical
4139

@@ -101,18 +99,7 @@ fun MainPage(
10199
onSearch = { expanded = false },
102100
expanded = expanded,
103101
onExpandedChange = { expanded = it },
104-
label = "Search",
105-
leadingIcon = {
106-
Icon(
107-
modifier = Modifier
108-
.padding(start = 12.dp, end = 8.dp)
109-
.size(20.dp)
110-
.alpha(0.4f),
111-
imageVector = MiuixIcons.Useful.Search,
112-
tint = MiuixTheme.colorScheme.onSurfaceContainer,
113-
contentDescription = "Search"
114-
)
115-
},
102+
label = "Search"
116103
)
117104
},
118105
outsideRightAction = {
@@ -127,6 +114,7 @@ fun MainPage(
127114
miuixSearchValue = ""
128115
},
129116
text = "Cancel",
117+
style = TextStyle(fontSize = 17.sp, fontWeight = FontWeight.Bold),
130118
color = MiuixTheme.colorScheme.primary
131119
)
132120
},
@@ -189,15 +177,7 @@ fun MainPage(
189177
onSearch = { expanded = false },
190178
expanded = expanded,
191179
onExpandedChange = { expanded = it },
192-
label = "Search",
193-
leadingIcon = {
194-
Icon(
195-
modifier = Modifier.padding(horizontal = 16.dp),
196-
imageVector = MiuixIcons.Useful.Search,
197-
tint = MiuixTheme.colorScheme.onSurfaceContainer,
198-
contentDescription = "Search"
199-
)
200-
},
180+
label = "Search"
201181
)
202182
},
203183
outsideRightAction = {

miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/SearchBar.kt

Lines changed: 45 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
package top.yukonga.miuix.kmp.basic
22

33
import androidx.compose.animation.AnimatedVisibility
4+
import androidx.compose.animation.fadeIn
5+
import androidx.compose.animation.fadeOut
46
import androidx.compose.foundation.background
7+
import androidx.compose.foundation.clickable
58
import androidx.compose.foundation.interaction.Interaction
69
import androidx.compose.foundation.interaction.MutableInteractionSource
710
import androidx.compose.foundation.interaction.collectIsFocusedAsState
@@ -11,6 +14,7 @@ import androidx.compose.foundation.layout.ColumnScope
1114
import androidx.compose.foundation.layout.Row
1215
import androidx.compose.foundation.layout.fillMaxWidth
1316
import androidx.compose.foundation.layout.padding
17+
import androidx.compose.foundation.shape.CircleShape
1418
import androidx.compose.foundation.text.BasicTextField
1519
import androidx.compose.foundation.text.KeyboardActions
1620
import androidx.compose.foundation.text.KeyboardOptions
@@ -20,18 +24,25 @@ import androidx.compose.runtime.derivedStateOf
2024
import androidx.compose.runtime.remember
2125
import androidx.compose.ui.Alignment
2226
import androidx.compose.ui.Modifier
27+
import androidx.compose.ui.draw.clip
2328
import androidx.compose.ui.focus.FocusRequester
2429
import androidx.compose.ui.focus.focusRequester
2530
import androidx.compose.ui.focus.onFocusChanged
2631
import androidx.compose.ui.graphics.SolidColor
2732
import androidx.compose.ui.platform.LocalFocusManager
2833
import androidx.compose.ui.semantics.onClick
2934
import androidx.compose.ui.semantics.semantics
35+
import androidx.compose.ui.text.TextStyle
36+
import androidx.compose.ui.text.font.FontWeight
3037
import androidx.compose.ui.text.input.ImeAction
3138
import androidx.compose.ui.unit.DpSize
3239
import androidx.compose.ui.unit.dp
40+
import androidx.compose.ui.unit.sp
3341
import androidx.compose.ui.zIndex
3442
import kotlinx.coroutines.delay
43+
import top.yukonga.miuix.kmp.icon.MiuixIcons
44+
import top.yukonga.miuix.kmp.icon.icons.basic.Search
45+
import top.yukonga.miuix.kmp.icon.icons.basic.SearchCleanup
3546
import top.yukonga.miuix.kmp.theme.MiuixTheme
3647
import top.yukonga.miuix.kmp.utils.BackHandler
3748
import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
@@ -116,7 +127,7 @@ fun SearchBar(
116127
fun InputField(
117128
query: String,
118129
onQueryChange: (String) -> Unit,
119-
label: String = "",
130+
label: String = "Search",
120131
onSearch: (String) -> Unit,
121132
expanded: Boolean,
122133
onExpandedChange: (Boolean) -> Unit,
@@ -130,11 +141,34 @@ fun InputField(
130141
@Suppress("NAME_SHADOWING")
131142
val interactionSource = interactionSource ?: remember { MutableInteractionSource() }
132143

133-
val paddingModifier = remember(insideMargin, leadingIcon, trailingIcon) {
134-
if (leadingIcon == null && trailingIcon == null) Modifier.padding(horizontal = insideMargin.width, vertical = insideMargin.height)
135-
else if (leadingIcon == null) Modifier.padding(start = insideMargin.width).padding(vertical = insideMargin.height)
136-
else if (trailingIcon == null) Modifier.padding(end = insideMargin.width).padding(vertical = insideMargin.height)
137-
else Modifier.padding(vertical = insideMargin.height)
144+
@Suppress("NAME_SHADOWING")
145+
val leadingIcon = leadingIcon ?: {
146+
Icon(
147+
modifier = Modifier.padding(start = 16.dp, end = 8.dp),
148+
imageVector = MiuixIcons.Basic.Search,
149+
tint = MiuixTheme.colorScheme.onSurfaceContainerHigh,
150+
contentDescription = "Search"
151+
)
152+
}
153+
154+
@Suppress("NAME_SHADOWING")
155+
val trailingIcon = trailingIcon ?: {
156+
AnimatedVisibility(
157+
visible = query.isNotEmpty(),
158+
enter = fadeIn(),
159+
exit = fadeOut(),
160+
) {
161+
Box(
162+
modifier = Modifier.padding(start = 8.dp, end = 16.dp),
163+
) {
164+
Icon(
165+
modifier = Modifier.clip(CircleShape).clickable { onQueryChange("") },
166+
imageVector = MiuixIcons.Basic.SearchCleanup,
167+
tint = MiuixTheme.colorScheme.onSurfaceContainerHighest,
168+
contentDescription = "Search Cleanup"
169+
)
170+
}
171+
}
138172
}
139173

140174
val focused = interactionSource.collectIsFocusedAsState().value
@@ -155,7 +189,7 @@ fun InputField(
155189
},
156190
enabled = enabled,
157191
singleLine = true,
158-
textStyle = MiuixTheme.textStyles.main,
192+
textStyle = MiuixTheme.textStyles.main.copy(fontWeight = FontWeight.Bold),
159193
cursorBrush = SolidColor(MiuixTheme.colorScheme.primary),
160194
keyboardOptions = KeyboardOptions(imeAction = ImeAction.Search),
161195
keyboardActions = KeyboardActions(onSearch = { onSearch(query) }),
@@ -174,25 +208,21 @@ fun InputField(
174208
modifier = Modifier.fillMaxWidth(),
175209
verticalAlignment = Alignment.CenterVertically
176210
) {
177-
if (leadingIcon != null) {
178-
leadingIcon()
179-
}
211+
leadingIcon()
180212
Box(
181213
modifier = Modifier
182214
.weight(1f)
183-
.then(paddingModifier),
215+
.padding(vertical = insideMargin.height),
184216
contentAlignment = Alignment.CenterStart
185217
) {
186218
Text(
187219
text = if (!(query.isNotEmpty() || expanded)) label else "",
220+
style = TextStyle(fontSize = 17.sp, fontWeight = FontWeight.Bold),
188221
color = MiuixTheme.colorScheme.onSurfaceContainerHigh
189222
)
190-
191223
innerTextField()
192224
}
193-
if (trailingIcon != null) {
194-
trailingIcon()
195-
}
225+
trailingIcon()
196226
}
197227
}
198228
}
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
package top.yukonga.miuix.kmp.icon.icons.basic
2+
3+
import androidx.compose.ui.graphics.Color
4+
import androidx.compose.ui.graphics.PathFillType
5+
import androidx.compose.ui.graphics.SolidColor
6+
import androidx.compose.ui.graphics.vector.ImageVector
7+
import androidx.compose.ui.graphics.vector.path
8+
import androidx.compose.ui.unit.dp
9+
import top.yukonga.miuix.kmp.icon.MiuixIcons
10+
11+
val MiuixIcons.Basic.Search: ImageVector
12+
get() {
13+
if (_search != null) return _search!!
14+
_search = ImageVector.Builder("Search", 20.0f.dp, 20.0f.dp, 20.0f, 20.0f).apply {
15+
path(
16+
fill = SolidColor(Color.White),
17+
pathFillType = PathFillType.EvenOdd
18+
) {
19+
moveTo(12.572f, 13.379f)
20+
curveTo(11.541f, 14.183f, 10.244f, 14.662f, 8.835f, 14.662f)
21+
curveTo(5.477f, 14.662f, 2.754f, 11.94f, 2.754f, 8.581f)
22+
curveTo(2.754f, 5.223f, 5.477f, 2.5f, 8.835f, 2.5f)
23+
curveTo(12.194f, 2.5f, 14.916f, 5.223f, 14.916f, 8.581f)
24+
curveTo(14.916f, 9.99f, 14.437f, 11.287f, 13.633f, 12.318f)
25+
lineTo(17.464f, 16.149f)
26+
curveTo(17.563f, 16.248f, 17.612f, 16.297f, 17.645f, 16.346f)
27+
curveTo(17.78f, 16.548f, 17.78f, 16.811f, 17.645f, 17.013f)
28+
curveTo(17.612f, 17.062f, 17.563f, 17.111f, 17.464f, 17.21f)
29+
curveTo(17.366f, 17.308f, 17.316f, 17.358f, 17.267f, 17.39f)
30+
curveTo(17.065f, 17.525f, 16.802f, 17.525f, 16.601f, 17.39f)
31+
curveTo(16.551f, 17.358f, 16.502f, 17.308f, 16.403f, 17.21f)
32+
lineTo(12.572f, 13.379f)
33+
close()
34+
moveTo(13.416f, 8.581f)
35+
curveTo(13.416f, 11.111f, 11.365f, 13.162f, 8.835f, 13.162f)
36+
curveTo(6.305f, 13.162f, 4.254f, 11.111f, 4.254f, 8.581f)
37+
curveTo(4.254f, 6.051f, 6.305f, 4f, 8.835f, 4f)
38+
curveTo(11.365f, 4f, 13.416f, 6.051f, 13.416f, 8.581f)
39+
close()
40+
}
41+
}.build()
42+
return _search!!
43+
}
44+
45+
private var _search: ImageVector? = null
Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
package top.yukonga.miuix.kmp.icon.icons.basic
2+
3+
import androidx.compose.ui.graphics.Color
4+
import androidx.compose.ui.graphics.PathFillType
5+
import androidx.compose.ui.graphics.SolidColor
6+
import androidx.compose.ui.graphics.vector.ImageVector
7+
import androidx.compose.ui.graphics.vector.path
8+
import androidx.compose.ui.unit.dp
9+
import top.yukonga.miuix.kmp.icon.MiuixIcons
10+
11+
val MiuixIcons.Basic.SearchCleanup: ImageVector
12+
get() {
13+
if (_searchCleanup != null) return _searchCleanup!!
14+
_searchCleanup = ImageVector.Builder("SearchCleanup", 18.199984f.dp, 18.199984f.dp, 68f, 68f).apply {
15+
path(
16+
fill = SolidColor(Color.White),
17+
fillAlpha = 0.06f,
18+
pathFillType = PathFillType.NonZero
19+
) {
20+
moveTo(34f, 66f)
21+
curveTo(51.6731f, 66f, 66f, 51.6731f, 66f, 34f)
22+
curveTo(66f, 16.3269f, 51.6731f, 2f, 34f, 2f)
23+
curveTo(16.3269f, 2f, 2f, 16.3269f, 2f, 34f)
24+
curveTo(2f, 51.6731f, 16.3269f, 66f, 34f, 66f)
25+
close()
26+
}
27+
path(
28+
fill = SolidColor(Color.Transparent),
29+
stroke = SolidColor(Color.Black),
30+
strokeAlpha = 0.1f,
31+
strokeLineWidth = 0.0f,
32+
pathFillType = PathFillType.NonZero
33+
) {
34+
moveTo(34f, 67f)
35+
curveTo(52.2254f, 67f, 67f, 52.2254f, 67f, 34f)
36+
curveTo(67f, 15.7746f, 52.2254f, 1f, 34f, 1f)
37+
curveTo(15.7746f, 1f, 1f, 15.7746f, 1f, 34f)
38+
curveTo(1f, 52.2254f, 15.7746f, 67f, 34f, 67f)
39+
close()
40+
}
41+
path(
42+
fill = SolidColor(Color.White),
43+
fillAlpha = 0.3f,
44+
pathFillType = PathFillType.EvenOdd
45+
) {
46+
moveTo(44.6066f, 27.8492f)
47+
curveTo(45.7782f, 26.6777f, 45.7782f, 24.7782f, 44.6066f, 23.6066f)
48+
curveTo(43.435f, 22.435f, 41.5355f, 22.435f, 40.364f, 23.6066f)
49+
lineTo(34f, 29.9706f)
50+
lineTo(27.636f, 23.6066f)
51+
curveTo(26.4645f, 22.435f, 24.565f, 22.435f, 23.3934f, 23.6066f)
52+
curveTo(22.2218f, 24.7782f, 22.2218f, 26.6777f, 23.3934f, 27.8492f)
53+
lineTo(29.7574f, 34.2132f)
54+
lineTo(23.3934f, 40.5772f)
55+
curveTo(22.2218f, 41.7487f, 22.2218f, 43.6482f, 23.3934f, 44.8198f)
56+
curveTo(24.565f, 45.9914f, 26.4645f, 45.9914f, 27.636f, 44.8198f)
57+
lineTo(34f, 38.4558f)
58+
lineTo(40.364f, 44.8198f)
59+
curveTo(41.5355f, 45.9914f, 43.435f, 45.9914f, 44.6066f, 44.8198f)
60+
curveTo(45.7782f, 43.6482f, 45.7782f, 41.7487f, 44.6066f, 40.5772f)
61+
lineTo(38.2426f, 34.2132f)
62+
lineTo(44.6066f, 27.8492f)
63+
close()
64+
}
65+
}.build()
66+
return _searchCleanup!!
67+
}
68+
69+
private var _searchCleanup: ImageVector? = null

0 commit comments

Comments
 (0)