Skip to content

Commit bdab0b9

Browse files
YuKongAYuKongA
committed
library: Add holdDownState to some components
* SuperArrow & IconButton * Useful when opening secondary pages or pop-ups.
1 parent 9095f83 commit bdab0b9

File tree

10 files changed

+110
-46
lines changed

10 files changed

+110
-46
lines changed

‎composeApp/src/commonMain/kotlin/UITest.kt‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -160,7 +160,8 @@ fun UITest(
160160
modifier = Modifier.padding(end = 21.dp).size(40.dp),
161161
onClick = {
162162
isTopPopupExpanded.value = true
163-
}
163+
},
164+
holdDownState = showTopPopup.value
164165
) {
165166
Icon(
166167
imageVector = MiuixIcons.Useful.ImmersionMore,
@@ -209,7 +210,8 @@ fun UITest(
209210
modifier = Modifier.padding(end = 21.dp).size(40.dp),
210211
onClick = {
211212
isTopPopupExpanded.value = true
212-
}
213+
},
214+
holdDownState = isTopPopupExpanded.value
213215
) {
214216
Icon(
215217
imageVector = MiuixIcons.Useful.ImmersionMore,

‎composeApp/src/commonMain/kotlin/component/TextComponent.kt‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -161,15 +161,17 @@ fun TextComponent(
161161
summary = "Click to show Dialog 1",
162162
onClick = {
163163
showDialog.value = true
164-
}
164+
},
165+
holdDownState = showDialog.value
165166
)
166167

167168
SuperArrow(
168169
title = "Arrow",
169170
summary = "Click to show Dialog 2",
170171
onClick = {
171172
showDialog2.value = true
172-
}
173+
},
174+
holdDownState = showDialog2.value
173175
)
174176

175177
SuperArrow(

‎miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/basic/IconButton.kt‎

Lines changed: 31 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,25 @@
11
package top.yukonga.miuix.kmp.basic
22

3+
import androidx.compose.foundation.LocalIndication
34
import androidx.compose.foundation.background
45
import androidx.compose.foundation.clickable
6+
import androidx.compose.foundation.interaction.MutableInteractionSource
57
import androidx.compose.foundation.layout.Box
68
import androidx.compose.foundation.layout.defaultMinSize
79
import androidx.compose.runtime.Composable
810
import androidx.compose.runtime.derivedStateOf
11+
import androidx.compose.runtime.mutableStateOf
912
import androidx.compose.runtime.remember
13+
import androidx.compose.runtime.rememberCoroutineScope
1014
import androidx.compose.ui.Alignment
1115
import androidx.compose.ui.Modifier
1216
import androidx.compose.ui.draw.clip
1317
import androidx.compose.ui.graphics.Color
1418
import androidx.compose.ui.semantics.Role
1519
import androidx.compose.ui.unit.Dp
1620
import androidx.compose.ui.unit.dp
21+
import kotlinx.coroutines.launch
22+
import top.yukonga.miuix.kmp.interfaces.HoldDownInteraction
1723
import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
1824

1925
/**
@@ -25,6 +31,7 @@ import top.yukonga.miuix.kmp.utils.SmoothRoundedCornerShape
2531
* @param onClick The callback when the [IconButton] is clicked.
2632
* @param modifier The modifier to be applied to the [IconButton]
2733
* @param enabled Whether the [IconButton] is enabled.
34+
* @param holdDownState Used to determine whether it is in the pressed state.
2835
* @param backgroundColor The background color of of the [IconButton].
2936
* @param cornerRadius The corner radius of of the [IconButton].
3037
* @param minHeight The minimum height of of the [IconButton].
@@ -36,23 +43,44 @@ fun IconButton(
3643
onClick: () -> Unit,
3744
modifier: Modifier = Modifier,
3845
enabled: Boolean = true,
46+
holdDownState: Boolean = false,
3947
backgroundColor: Color = Color.Unspecified,
4048
cornerRadius: Dp = IconButtonDefaults.CornerRadius,
4149
minHeight: Dp = IconButtonDefaults.MinHeight,
4250
minWidth: Dp = IconButtonDefaults.MinWidth,
4351
content: @Composable () -> Unit
4452
) {
4553
val shape = remember { derivedStateOf { SmoothRoundedCornerShape(cornerRadius) } }
54+
val coroutineScope = rememberCoroutineScope()
55+
val interactionSource = remember { MutableInteractionSource() }
56+
val holdDown = remember { mutableStateOf<HoldDownInteraction.HoldDown?>(null) }
57+
58+
if (!holdDownState) {
59+
holdDown.value?.let { oldValue ->
60+
coroutineScope.launch {
61+
interactionSource.emit(HoldDownInteraction.Release(oldValue))
62+
}
63+
holdDown.value = null
64+
}
65+
}
4666
Box(
4767
modifier = modifier
4868
.defaultMinSize(minWidth = minWidth, minHeight = minHeight)
4969
.clip(shape.value)
5070
.background(color = backgroundColor)
5171
.clickable(
52-
onClick = onClick,
5372
enabled = enabled,
54-
role = Role.Button
55-
),
73+
role = Role.Button,
74+
indication = LocalIndication.current,
75+
interactionSource = interactionSource
76+
) {
77+
onClick.invoke()
78+
coroutineScope.launch {
79+
interactionSource.emit(HoldDownInteraction.HoldDown().also {
80+
holdDown.value = it
81+
})
82+
}
83+
},
5684
contentAlignment = Alignment.Center
5785
) {
5886
content()

‎miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperArrow.kt‎

Lines changed: 27 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
package top.yukonga.miuix.kmp.extra
22

33
import androidx.compose.foundation.Image
4+
import androidx.compose.foundation.interaction.MutableInteractionSource
45
import androidx.compose.foundation.layout.PaddingValues
56
import androidx.compose.foundation.layout.padding
67
import androidx.compose.foundation.layout.size
@@ -9,19 +10,24 @@ import androidx.compose.runtime.Composable
910
import androidx.compose.runtime.Immutable
1011
import androidx.compose.runtime.Stable
1112
import androidx.compose.runtime.getValue
13+
import androidx.compose.runtime.mutableStateOf
14+
import androidx.compose.runtime.remember
15+
import androidx.compose.runtime.rememberCoroutineScope
1216
import androidx.compose.runtime.rememberUpdatedState
1317
import androidx.compose.ui.Modifier
1418
import androidx.compose.ui.graphics.Color
1519
import androidx.compose.ui.graphics.ColorFilter
1620
import androidx.compose.ui.text.style.TextAlign
1721
import androidx.compose.ui.text.style.TextOverflow
1822
import androidx.compose.ui.unit.dp
23+
import kotlinx.coroutines.launch
1924
import top.yukonga.miuix.kmp.basic.BasicComponent
2025
import top.yukonga.miuix.kmp.basic.BasicComponentColors
2126
import top.yukonga.miuix.kmp.basic.BasicComponentDefaults
2227
import top.yukonga.miuix.kmp.basic.Text
2328
import top.yukonga.miuix.kmp.icon.MiuixIcons
2429
import top.yukonga.miuix.kmp.icon.icons.base.ArrowRight
30+
import top.yukonga.miuix.kmp.interfaces.HoldDownInteraction
2531
import top.yukonga.miuix.kmp.theme.MiuixTheme
2632

2733
/**
@@ -36,6 +42,7 @@ import top.yukonga.miuix.kmp.theme.MiuixTheme
3642
* @param rightText The text on the right side of the [SuperArrow].
3743
* @param rightActionColor The color of the right action.
3844
* @param onClick The callback when the [SuperArrow] is clicked.
45+
* @param holdDownState Used to determine whether it is in the pressed state.
3946
* @param insideMargin The margin inside the [SuperArrow].
4047
* @param enabled Whether the [SuperArrow] is clickable.
4148
*/
@@ -50,10 +57,23 @@ fun SuperArrow(
5057
rightText: String? = null,
5158
rightActionColor: RightActionColors = SuperArrowDefaults.rightActionColors(),
5259
onClick: (() -> Unit)? = null,
60+
holdDownState: Boolean = false,
5361
insideMargin: PaddingValues = BasicComponentDefaults.InsideMargin,
5462
enabled: Boolean = true
5563
) {
5664
val updatedOnClick by rememberUpdatedState(onClick)
65+
val coroutineScope = rememberCoroutineScope()
66+
val interactionSource = remember { MutableInteractionSource() }
67+
val holdDown = remember { mutableStateOf<HoldDownInteraction.HoldDown?>(null) }
68+
69+
if (!holdDownState) {
70+
holdDown.value?.let { oldValue ->
71+
coroutineScope.launch {
72+
interactionSource.emit(HoldDownInteraction.Release(oldValue))
73+
}
74+
holdDown.value = null
75+
}
76+
}
5777

5878
BasicComponent(
5979
modifier = modifier,
@@ -87,9 +107,15 @@ fun SuperArrow(
87107
onClick = {
88108
if (enabled) {
89109
updatedOnClick?.invoke()
110+
coroutineScope.launch {
111+
interactionSource.emit(HoldDownInteraction.HoldDown().also {
112+
holdDown.value = it
113+
})
114+
}
90115
}
91116
},
92-
enabled = enabled
117+
enabled = enabled,
118+
interactionSource = interactionSource
93119
)
94120
}
95121

‎miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperDropdown.kt‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -89,7 +89,7 @@ fun SuperDropdown(
8989
val isDropdownExpanded = remember { mutableStateOf(false) }
9090
val showPopup = remember { mutableStateOf(false) }
9191
val coroutineScope = rememberCoroutineScope()
92-
val held = remember { mutableStateOf<HoldDownInteraction.Hold?>(null) }
92+
val isHoldDown = remember { mutableStateOf<HoldDownInteraction.HoldDown?>(null) }
9393
val hapticFeedback = LocalHapticFeedback.current
9494
val actionColor =
9595
if (enabled) MiuixTheme.colorScheme.onSurfaceVariantActions else MiuixTheme.colorScheme.disabledOnSecondaryVariant
@@ -104,11 +104,11 @@ fun SuperDropdown(
104104
}
105105

106106
if (!isDropdownExpanded.value) {
107-
held.value?.let { oldValue ->
107+
isHoldDown.value?.let { oldValue ->
108108
coroutineScope.launch {
109109
interactionSource.emit(HoldDownInteraction.Release(oldValue))
110110
}
111-
held.value = null
111+
isHoldDown.value = null
112112
}
113113
}
114114

@@ -195,8 +195,8 @@ fun SuperDropdown(
195195
isDropdownExpanded.value = enabled
196196
hapticFeedback.performHapticFeedback(HapticFeedbackType.ContextClick)
197197
coroutineScope.launch {
198-
interactionSource.emit(HoldDownInteraction.Hold().also {
199-
held.value = it
198+
interactionSource.emit(HoldDownInteraction.HoldDown().also {
199+
isHoldDown.value = it
200200
})
201201
}
202202
}

‎miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/extra/SuperSpinner.kt‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,7 @@ fun SuperSpinner(
101101
val isDropdownExpanded = remember { mutableStateOf(false) }
102102
val showPopup = remember { mutableStateOf(false) }
103103
val coroutineScope = rememberCoroutineScope()
104-
val held = remember { mutableStateOf<HoldDownInteraction.Hold?>(null) }
104+
val isHoldDown = remember { mutableStateOf<HoldDownInteraction.HoldDown?>(null) }
105105
val hapticFeedback = LocalHapticFeedback.current
106106
val actionColor = if (enabled) MiuixTheme.colorScheme.onSurfaceVariantActions else MiuixTheme.colorScheme.disabledOnSecondaryVariant
107107

@@ -115,11 +115,11 @@ fun SuperSpinner(
115115
}
116116

117117
if (!isDropdownExpanded.value) {
118-
held.value?.let { oldValue ->
118+
isHoldDown.value?.let { oldValue ->
119119
coroutineScope.launch {
120120
interactionSource.emit(HoldDownInteraction.Release(oldValue))
121121
}
122-
held.value = null
122+
isHoldDown.value = null
123123
}
124124
}
125125

@@ -206,8 +206,8 @@ fun SuperSpinner(
206206
isDropdownExpanded.value = enabled
207207
hapticFeedback.performHapticFeedback(HapticFeedbackType.ContextClick)
208208
coroutineScope.launch {
209-
interactionSource.emit(HoldDownInteraction.Hold().also {
210-
held.value = it
209+
interactionSource.emit(HoldDownInteraction.HoldDown().also {
210+
isHoldDown.value = it
211211
})
212212
}
213213
}
@@ -256,7 +256,7 @@ fun SuperSpinner(
256256
val interactionSource = remember { MutableInteractionSource() }
257257
val isDropdownExpanded = remember { mutableStateOf(false) }
258258
val coroutineScope = rememberCoroutineScope()
259-
val held = remember { mutableStateOf<HoldDownInteraction.Hold?>(null) }
259+
val isHoldDown = remember { mutableStateOf<HoldDownInteraction.HoldDown?>(null) }
260260
val hapticFeedback = LocalHapticFeedback.current
261261
val actionColor = if (enabled) MiuixTheme.colorScheme.onSurfaceVariantActions else MiuixTheme.colorScheme.disabledOnSecondaryVariant
262262
var alignLeft by rememberSaveable { mutableStateOf(true) }
@@ -272,11 +272,11 @@ fun SuperSpinner(
272272
}
273273

274274
if (!isDropdownExpanded.value) {
275-
held.value?.let { oldValue ->
275+
isHoldDown.value?.let { oldValue ->
276276
coroutineScope.launch {
277277
interactionSource.emit(HoldDownInteraction.Release(oldValue))
278278
}
279-
held.value = null
279+
isHoldDown.value = null
280280
}
281281
}
282282

@@ -337,8 +337,8 @@ fun SuperSpinner(
337337
isDropdownExpanded.value = true
338338
hapticFeedback.performHapticFeedback(HapticFeedbackType.ContextClick)
339339
coroutineScope.launch {
340-
interactionSource.emit(HoldDownInteraction.Hold().also {
341-
held.value = it
340+
interactionSource.emit(HoldDownInteraction.HoldDown().also {
341+
isHoldDown.value = it
342342
})
343343
}
344344
}

‎miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/interfaces/HoldDownInteraction.kt‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,13 @@ import androidx.compose.runtime.LaunchedEffect
88
import androidx.compose.runtime.State
99
import androidx.compose.runtime.mutableStateOf
1010
import androidx.compose.runtime.remember
11-
import top.yukonga.miuix.kmp.interfaces.HoldDownInteraction.Hold
11+
import top.yukonga.miuix.kmp.interfaces.HoldDownInteraction.HoldDown
1212
import top.yukonga.miuix.kmp.interfaces.HoldDownInteraction.Release
1313

1414
/**
1515
* An interaction related to hold down events.
1616
*
17-
* @see Hold
17+
* @see HoldDown
1818
* @see Release
1919
*/
2020
interface HoldDownInteraction : Interaction {
@@ -23,16 +23,16 @@ interface HoldDownInteraction : Interaction {
2323
*
2424
* @see Release
2525
*/
26-
class Hold : HoldDownInteraction
26+
class HoldDown : HoldDownInteraction
2727

2828
/**
29-
* An interaction representing a [Hold] event being released on a component.
29+
* An interaction representing a [HoldDown] event being released on a component.
3030
*
31-
* @property hold the source [Hold] interaction that is being released
31+
* @property holdDown the source [HoldDown] interaction that is being released
3232
*
33-
* @see Hold
33+
* @see HoldDown
3434
*/
35-
class Release(val hold: Hold) : HoldDownInteraction
35+
class Release(val holdDown: HoldDown) : HoldDownInteraction
3636
}
3737

3838
/**
@@ -45,11 +45,11 @@ interface HoldDownInteraction : Interaction {
4545
fun InteractionSource.collectIsHeldDownAsState(): State<Boolean> {
4646
val isHeldDown = remember { mutableStateOf(false) }
4747
LaunchedEffect(this) {
48-
val holdInteraction = mutableListOf<Hold>()
48+
val holdInteraction = mutableListOf<HoldDown>()
4949
interactions.collect { interaction ->
5050
when (interaction) {
51-
is Hold -> holdInteraction.add(interaction)
52-
is Release -> holdInteraction.remove(interaction.hold)
51+
is HoldDown -> holdInteraction.add(interaction)
52+
is Release -> holdInteraction.remove(interaction.holdDown)
5353
}
5454
isHeldDown.value = holdInteraction.isNotEmpty()
5555
}

‎miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/theme/Colors.kt‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -343,7 +343,7 @@ fun lightColorScheme(
343343
onSurfaceContainerHigh: Color = Color(0xFFA2A2A2),
344344
surfaceContainerHighest: Color = Color(0xFFE8E8E8),
345345
onSurfaceContainerHighest: Color = Color.Black,
346-
windowDimming: Color = Color.Black.copy(alpha = 0.3f),
346+
windowDimming: Color = Color.Black.copy(alpha = 0.3F),
347347
): Colors = Colors(
348348
primary,
349349
onPrimary,
@@ -394,7 +394,7 @@ fun lightColorScheme(
394394
)
395395

396396
fun darkColorScheme(
397-
primary: Color = Color(0xFF277Af7),
397+
primary: Color = Color(0xFF277AF7),
398398
onPrimary: Color = Color.White,
399399
primaryVariant: Color = Color(0xFF0073DD),
400400
onPrimaryVariant: Color = Color(0xFF99C7F1),
@@ -439,7 +439,7 @@ fun darkColorScheme(
439439
onSurfaceContainerHigh: Color = Color(0xFF666666),
440440
surfaceContainerHighest: Color = Color(0xFF2D2D2D),
441441
onSurfaceContainerHighest: Color = Color(0xFFE9E9E9),
442-
windowDimming: Color = Color.Black.copy(alpha = 0.6f),
442+
windowDimming: Color = Color.Black.copy(alpha = 0.6F),
443443
): Colors = Colors(
444444
primary,
445445
onPrimary,

‎miuix/src/commonMain/kotlin/top/yukonga/miuix/kmp/theme/MiuixTheme.kt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ fun MiuixTheme(
2727
updateColorsFrom(colors)
2828
}
2929
val miuixIndication = remember(colors.onBackground) {
30-
MiuixIndication(backgroundColor = colors.onBackground)
30+
MiuixIndication(color = colors.onBackground)
3131
}
3232
CompositionLocalProvider(
3333
LocalColors provides miuixColors,

0 commit comments

Comments
 (0)