BetterAndroid/FlexiUI
5
0
Fork 0
mirror of https://github.com/BetterAndroid/FlexiUI.git synced 2025-09-07 19:14:12 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: add focus requester and DecorationBoxStyle in TextField

Browse Source
This commit is contained in:
fankesyooni
2023-11-19 01:21:25 +08:00
parent 2e19865134
commit 98344617bb
1 changed files with 29 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
flexiui-core/src/commonMain/kotlin/com/highcapable/flexiui/component/TextField.kt
View File

@@ -51,6 +51,8 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.draw.clip
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Shape
import androidx.compose.ui.graphics.SolidColor
@@ -72,6 +74,8 @@ import com.highcapable.flexiui.utils.status
data class TextFieldColors(
val cursorColor: Color,
val selectionColors: TextSelectionColors,
val decorInactiveTint: Color,
val decorActiveTint: Color,
val borderInactiveColor: Color,
val borderActiveColor: Color,
val backgroundColor: Color
@@ -105,6 +109,7 @@ fun TextField(
minLines: Int = 1,
visualTransformation: VisualTransformation = VisualTransformation.None,
onTextLayout: (TextLayoutResult) -> Unit = {},
focusRequester: FocusRequester = remember { FocusRequester() },
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
header: @Composable (() -> Unit)? = null,
placeholder: @Composable () -> Unit = {},
@@ -113,6 +118,10 @@ fun TextField(
) {
val focused by interactionSource.collectIsFocusedAsState()
val hovered by interactionSource.collectIsHoveredAsState()
val animatedDecorTint by animateColorAsState(when {
focused || hovered -> colors.decorActiveTint
else -> colors.decorInactiveTint
})
val animatedBorderColor by animateColorAsState(when {
focused || hovered -> style.borderActive.solidColor
else -> style.borderInactive.solidColor
@@ -136,13 +145,17 @@ fun TextField(
),
verticalAlignment = Alignment.CenterVertically
) {
header?.also { Box(modifier = Modifier.textFieldPadding(style, fitStart = true)) { it() } }
header?.also {
Box(modifier = Modifier.textFieldPadding(style, fitStart = true)) {
DecorationBoxStyle(animatedDecorTint) { it() }
}
}
Box(modifier = Modifier.weight(1f, fill = false).textFieldPadding(style)) {
TextFieldStyle(colors) {
BasicTextField(
value = value,
onValueChange = onValueChange,
modifier = modifier,
modifier = Modifier.focusRequester(focusRequester).then(modifier),
enabled = enabled,
readOnly = readOnly,
textStyle = textStyle,
@@ -165,7 +178,11 @@ fun TextField(
)
}
}
footer?.also { Box(modifier = Modifier.textFieldPadding(style, fitEnd = true)) { it() } }
footer?.also {
Box(modifier = Modifier.textFieldPadding(style, fitEnd = true)) {
DecorationBoxStyle(animatedDecorTint) { it() }
}
}
}
}
@@ -191,6 +208,13 @@ private fun TextFieldStyle(colors: TextFieldColors, content: @Composable () -> U
}
}
@Composable
private fun DecorationBoxStyle(decorTint: Color, content: @Composable () -> Unit) {
CompositionLocalProvider(LocalIconTint provides decorTint) {
content()
}
}
private fun Modifier.textField(
colors: TextFieldColors,
style: TextFieldStyle,
@@ -245,6 +269,8 @@ private fun defaultTextFieldColors() = TextFieldColors(
handleColor = LocalColors.current.themePrimary,
backgroundColor = LocalColors.current.themeSecondary
),
decorInactiveTint = LocalColors.current.themeSecondary,
decorActiveTint = LocalColors.current.themePrimary,
borderInactiveColor = LocalColors.current.themeSecondary,
borderActiveColor = LocalColors.current.themePrimary,
backgroundColor = Color.Transparent