Skip to content

Commit b2d1e0d

Browse files
committed
library: Add a basic IconButton
1 parent 8ab80ea commit b2d1e0d

File tree

23 files changed

+107
-39
lines changed

23 files changed

+107
-39
lines changed

build.gradle.kts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,5 +5,5 @@ plugins {
55
alias(libs.plugins.compose.compiler) apply false
66
alias(libs.plugins.jetbrains.compose) apply false
77
alias(libs.plugins.kotlin.multiplatform) apply false
8-
alias(libs.plugins.dokka) apply false
8+
alias(libs.plugins.jetbrains.dokka) apply false
99
}

composeApp/src/commonMain/kotlin/UITest.kt

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ import androidx.compose.foundation.pager.rememberPagerState
1717
import androidx.compose.material.icons.Icons
1818
import androidx.compose.material.icons.rounded.Favorite
1919
import androidx.compose.material.icons.rounded.Home
20+
import androidx.compose.material.icons.rounded.Menu
2021
import androidx.compose.material.icons.rounded.Settings
2122
import androidx.compose.runtime.Composable
2223
import androidx.compose.runtime.LaunchedEffect
@@ -38,6 +39,7 @@ import kotlinx.coroutines.flow.debounce
3839
import kotlinx.coroutines.launch
3940
import top.yukonga.miuix.kmp.basic.FloatingActionButton
4041
import top.yukonga.miuix.kmp.basic.HorizontalPager
42+
import top.yukonga.miuix.kmp.basic.IconButton
4143
import top.yukonga.miuix.kmp.basic.MiuixScrollBehavior
4244
import top.yukonga.miuix.kmp.basic.NavigationBar
4345
import top.yukonga.miuix.kmp.basic.NavigationItem
@@ -47,6 +49,7 @@ import top.yukonga.miuix.kmp.basic.TopAppBar
4749
import top.yukonga.miuix.kmp.basic.rememberTopAppBarState
4850
import top.yukonga.miuix.kmp.icon.MiuixIcons
4951
import top.yukonga.miuix.kmp.icon.icons.GitHub
52+
import top.yukonga.miuix.kmp.theme.MiuixTheme
5053
import utils.FPSMonitor
5154

5255
@OptIn(FlowPreview::class)
@@ -102,7 +105,19 @@ fun UITest(
102105
) {
103106
TopAppBar(
104107
title = "Miuix",
105-
scrollBehavior = currentScrollBehavior
108+
scrollBehavior = currentScrollBehavior,
109+
actions = {
110+
IconButton(
111+
modifier = Modifier.padding(end = 12.dp),
112+
onClick = { }
113+
) {
114+
Image(
115+
imageVector = Icons.Rounded.Menu,
116+
colorFilter = ColorFilter.tint(MiuixTheme.colorScheme.onBackground.copy(0.8f)),
117+
contentDescription = "Menu"
118+
)
119+
}
120+
},
106121
)
107122
}
108123
},

gradle/libs.versions.toml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,6 @@ jetbrains-compose-window-size = { module = "org.jetbrains.compose.material3:mate
1919
android-application = { id = "com.android.application", version.ref = "androidGradlePlugin" }
2020
android-library = { id = "com.android.library", version.ref = "androidGradlePlugin" }
2121
compose-compiler = { id = "org.jetbrains.kotlin.plugin.compose", version.ref = "kotlin" }
22-
dokka = { id = "org.jetbrains.dokka", version.ref = "dokka" }
22+
jetbrains-dokka = { id = "org.jetbrains.dokka", version.ref = "dokka" }
2323
jetbrains-compose = { id = "org.jetbrains.compose", version.ref = "compose-plugin" }
2424
kotlin-multiplatform = { id = "org.jetbrains.kotlin.multiplatform", version.ref = "kotlin" }

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ import androidx.compose.ui.util.fastForEachIndexed
2525
import kotlin.math.max
2626

2727
/**
28-
* A box composable with Miuix style. A layout composable with [content].
28+
* A [Box] composable with Miuix style. A layout composable with [content].
2929
*
3030
* The [Box] will size itself to fit the content, subject to the incoming constraints.
3131
* When children are smaller than the parent, by default they will be positioned inside

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

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -22,14 +22,15 @@ import top.yukonga.miuix.kmp.theme.MiuixTheme
2222
import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
2323

2424
/**
25-
* A button component with Miuix style.
25+
* A [Button] component with Miuix style.
2626
*
2727
* @param modifier The modifier to be applied to the [Button].
2828
* @param text The text of the [Button].
2929
* @param onClick The callback when the [Button] is clicked.
3030
* @param enabled Whether the [Button] is enabled.
3131
* @param submit Whether the [Button] is a submit button.
3232
* @param cornerRadius The corner radius of the [Button].
33+
* @param minWidth The minimum width of the [Button].
3334
* @param minHeight The minimum height of the [Button].
3435
*/
3536
@Composable
@@ -40,6 +41,7 @@ fun Button(
4041
enabled: Boolean = true,
4142
submit: Boolean = false,
4243
cornerRadius: Dp = 16.dp,
44+
minWidth: Dp = 58.dp,
4345
minHeight: Dp = 40.dp
4446
) {
4547
val hapticFeedback = LocalHapticFeedback.current
@@ -58,7 +60,7 @@ fun Button(
5860
) {
5961
Row(
6062
Modifier
61-
.defaultMinSize(minWidth = 58.dp, minHeight = minHeight)
63+
.defaultMinSize(minWidth = minWidth, minHeight = minHeight)
6264
.padding(16.dp, 16.dp),
6365
horizontalArrangement = Arrangement.Center,
6466
verticalAlignment = Alignment.CenterVertically,
@@ -74,7 +76,7 @@ fun Button(
7476
}
7577

7678
@Composable
77-
private fun getButtonColor(enabled: Boolean, submit: Boolean): Color {
79+
fun getButtonColor(enabled: Boolean, submit: Boolean): Color {
7880
return if (enabled) {
7981
if (submit) MiuixTheme.colorScheme.primary else MiuixTheme.colorScheme.secondaryVariant
8082
} else {
@@ -83,7 +85,7 @@ private fun getButtonColor(enabled: Boolean, submit: Boolean): Color {
8385
}
8486

8587
@Composable
86-
private fun getTextColor(enabled: Boolean, submit: Boolean): Color {
88+
fun getTextColor(enabled: Boolean, submit: Boolean): Color {
8789
return if (enabled) {
8890
if (submit) MiuixTheme.colorScheme.onPrimary else MiuixTheme.colorScheme.onSecondaryVariant
8991
} else {

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import top.yukonga.miuix.kmp.theme.MiuixTheme
1414
import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
1515

1616
/**
17-
* A card component with Miuix style.
17+
* A [Card] component with Miuix style.
1818
* Card contain contain content and actions that relate information about a subject.
1919
*
2020
* This [Card] does not handle input events

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ import androidx.compose.ui.unit.dp
3535
import top.yukonga.miuix.kmp.theme.MiuixTheme
3636

3737
/**
38-
* A checkbox component with Miuix style.
38+
* A [Checkbox] component with Miuix style.
3939
*
4040
* @param modifier The modifier to be applied to the [Checkbox].
4141
* @param checked The current state of the [Checkbox].

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import top.yukonga.miuix.kmp.theme.MiuixTheme
1717
import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
1818

1919
/**
20-
* A floating action button component with Miuix style.
20+
* A [FloatingActionButton] component with Miuix style.
2121
*
2222
* @param modifier The modifier to be applied to the [FloatingActionButton].
2323
* @param onClick The callback when the [FloatingActionButton] is clicked.

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ import androidx.compose.ui.Alignment
1515
import androidx.compose.ui.Modifier
1616

1717
/**
18-
* A horizontal pager with Miuix style.
18+
* A [HorizontalPager] component with Miuix style.
1919
*
2020
* @param modifier The modifier to be applied to the [HorizontalPager].
2121
* @param pagerState The state of the [HorizontalPager].
Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
package top.yukonga.miuix.kmp.basic
2+
3+
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.clickable
5+
import androidx.compose.foundation.layout.defaultMinSize
6+
import androidx.compose.runtime.Composable
7+
import androidx.compose.ui.Alignment
8+
import androidx.compose.ui.Modifier
9+
import androidx.compose.ui.draw.clip
10+
import androidx.compose.ui.graphics.Color
11+
import androidx.compose.ui.semantics.Role
12+
import androidx.compose.ui.unit.Dp
13+
import androidx.compose.ui.unit.dp
14+
import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
15+
16+
/**
17+
* A [IconButton] component with Miuix style.
18+
*
19+
* Icon buttons help people take supplementary actions with a single tap. They’re used when a
20+
* compact button is required, such as in a toolbar or image list.
21+
*
22+
* @param onClick The callback when the [IconButton] is clicked.
23+
* @param modifier The modifier to be applied to the [IconButton]
24+
* @param enabled Whether the [IconButton] is enabled.
25+
* @param cornerRadius The corner radius of of the [IconButton].
26+
* @param backgroundColor The background color of of the [IconButton].
27+
* @param minHeight The minimum height of of the [IconButton].
28+
* @param minWidth The minimum width of the [IconButton].
29+
* @param content The content of this icon button, typically an [Image].
30+
*/
31+
@Composable
32+
fun IconButton(
33+
onClick: () -> Unit,
34+
modifier: Modifier = Modifier,
35+
enabled: Boolean = true,
36+
cornerRadius: Dp = 40.dp,
37+
backgroundColor: Color = Color.Unspecified,
38+
minHeight: Dp = 40.dp,
39+
minWidth: Dp = 40.dp,
40+
content: @Composable () -> Unit
41+
) {
42+
Box(
43+
modifier = modifier
44+
.defaultMinSize(minWidth = minWidth, minHeight = minHeight)
45+
.clip(SmoothRoundedCornerShape(cornerRadius))
46+
.background(color = backgroundColor)
47+
.clickable(
48+
onClick = onClick,
49+
enabled = enabled,
50+
role = Role.Button
51+
),
52+
contentAlignment = Alignment.Center
53+
) {
54+
content()
55+
}
56+
}

0 commit comments

Comments
 (0)