mirror of
https://github.com/bitwarden/android.git
synced 2024-11-21 17:05:44 +03:00
PM-15041: Update stepper buttons (#4330)
This commit is contained in:
parent
95552a7a55
commit
da878a9fab
3 changed files with 69 additions and 3 deletions
|
@ -0,0 +1,55 @@
|
||||||
|
package com.x8bit.bitwarden.ui.platform.components.button
|
||||||
|
|
||||||
|
import androidx.annotation.DrawableRes
|
||||||
|
import androidx.compose.material3.FilledIconButton
|
||||||
|
import androidx.compose.material3.Icon
|
||||||
|
import androidx.compose.runtime.Composable
|
||||||
|
import androidx.compose.ui.Modifier
|
||||||
|
import androidx.compose.ui.semantics.semantics
|
||||||
|
import androidx.compose.ui.tooling.preview.Preview
|
||||||
|
import com.x8bit.bitwarden.R
|
||||||
|
import com.x8bit.bitwarden.ui.platform.components.button.color.bitwardenFilledIconButtonColors
|
||||||
|
import com.x8bit.bitwarden.ui.platform.components.util.rememberVectorPainter
|
||||||
|
import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
|
||||||
|
|
||||||
|
/**
|
||||||
|
* A filled icon button that displays an icon.
|
||||||
|
*
|
||||||
|
* @param vectorIconRes Icon to display on the button.
|
||||||
|
* @param contentDescription The content description for this icon button.
|
||||||
|
* @param onClick Callback for when the icon button is clicked.
|
||||||
|
* @param modifier A [Modifier] for the composable.
|
||||||
|
* @param isEnabled Whether or not the button should be enabled.
|
||||||
|
*/
|
||||||
|
@Composable
|
||||||
|
fun BitwardenFilledIconButton(
|
||||||
|
@DrawableRes vectorIconRes: Int,
|
||||||
|
contentDescription: String,
|
||||||
|
onClick: () -> Unit,
|
||||||
|
modifier: Modifier = Modifier,
|
||||||
|
isEnabled: Boolean = true,
|
||||||
|
) {
|
||||||
|
FilledIconButton(
|
||||||
|
modifier = modifier.semantics(mergeDescendants = true) {},
|
||||||
|
onClick = onClick,
|
||||||
|
colors = bitwardenFilledIconButtonColors(),
|
||||||
|
enabled = isEnabled,
|
||||||
|
) {
|
||||||
|
Icon(
|
||||||
|
painter = rememberVectorPainter(id = vectorIconRes),
|
||||||
|
contentDescription = contentDescription,
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@Preview(showBackground = true)
|
||||||
|
@Composable
|
||||||
|
private fun BitwardenFilledIconButton_preview() {
|
||||||
|
BitwardenTheme {
|
||||||
|
BitwardenFilledIconButton(
|
||||||
|
vectorIconRes = R.drawable.ic_question_circle,
|
||||||
|
contentDescription = "Sample Icon",
|
||||||
|
onClick = {},
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
|
@ -5,6 +5,17 @@ import androidx.compose.runtime.Composable
|
||||||
import androidx.compose.ui.graphics.Color
|
import androidx.compose.ui.graphics.Color
|
||||||
import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
|
import com.x8bit.bitwarden.ui.platform.theme.BitwardenTheme
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Provides a default set of Bitwarden-styled colors for a filled icon button.
|
||||||
|
*/
|
||||||
|
@Composable
|
||||||
|
fun bitwardenFilledIconButtonColors(): IconButtonColors = IconButtonColors(
|
||||||
|
containerColor = BitwardenTheme.colorScheme.filledButton.background,
|
||||||
|
contentColor = BitwardenTheme.colorScheme.filledButton.foreground,
|
||||||
|
disabledContainerColor = BitwardenTheme.colorScheme.filledButton.backgroundDisabled,
|
||||||
|
disabledContentColor = BitwardenTheme.colorScheme.filledButton.foregroundDisabled,
|
||||||
|
)
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Provides a default set of Bitwarden-styled colors for a standard icon button.
|
* Provides a default set of Bitwarden-styled colors for a standard icon button.
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -7,7 +7,7 @@ import androidx.compose.ui.text.input.KeyboardType
|
||||||
import com.x8bit.bitwarden.R
|
import com.x8bit.bitwarden.R
|
||||||
import com.x8bit.bitwarden.ui.platform.base.util.ZERO_WIDTH_CHARACTER
|
import com.x8bit.bitwarden.ui.platform.base.util.ZERO_WIDTH_CHARACTER
|
||||||
import com.x8bit.bitwarden.ui.platform.base.util.orNullIfBlank
|
import com.x8bit.bitwarden.ui.platform.base.util.orNullIfBlank
|
||||||
import com.x8bit.bitwarden.ui.platform.components.button.BitwardenTonalIconButton
|
import com.x8bit.bitwarden.ui.platform.components.button.BitwardenFilledIconButton
|
||||||
import com.x8bit.bitwarden.ui.platform.components.field.BitwardenTextFieldWithActions
|
import com.x8bit.bitwarden.ui.platform.components.field.BitwardenTextFieldWithActions
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -51,7 +51,7 @@ fun BitwardenStepper(
|
||||||
value = clampedValue?.toString() ?: ZERO_WIDTH_CHARACTER,
|
value = clampedValue?.toString() ?: ZERO_WIDTH_CHARACTER,
|
||||||
actionsTestTag = stepperActionsTestTag,
|
actionsTestTag = stepperActionsTestTag,
|
||||||
actions = {
|
actions = {
|
||||||
BitwardenTonalIconButton(
|
BitwardenFilledIconButton(
|
||||||
vectorIconRes = R.drawable.ic_minus,
|
vectorIconRes = R.drawable.ic_minus,
|
||||||
contentDescription = "\u2212",
|
contentDescription = "\u2212",
|
||||||
onClick = {
|
onClick = {
|
||||||
|
@ -63,7 +63,7 @@ fun BitwardenStepper(
|
||||||
isEnabled = isDecrementEnabled && !isAtRangeMinimum,
|
isEnabled = isDecrementEnabled && !isAtRangeMinimum,
|
||||||
modifier = Modifier.testTag("DecrementValue"),
|
modifier = Modifier.testTag("DecrementValue"),
|
||||||
)
|
)
|
||||||
BitwardenTonalIconButton(
|
BitwardenFilledIconButton(
|
||||||
vectorIconRes = R.drawable.ic_plus,
|
vectorIconRes = R.drawable.ic_plus,
|
||||||
contentDescription = "+",
|
contentDescription = "+",
|
||||||
onClick = {
|
onClick = {
|
||||||
|
|
Loading…
Reference in a new issue