diff options
Diffstat (limited to 'android')
2 files changed, 57 insertions, 39 deletions
diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/AnimatedIconButton.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/AnimatedIconButton.kt index 2fa25253eb..0054b560e8 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/AnimatedIconButton.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/AnimatedIconButton.kt @@ -1,9 +1,10 @@ package net.mullvad.mullvadvpn.compose.button import androidx.compose.animation.AnimatedContent -import androidx.compose.animation.ExperimentalAnimationApi import androidx.compose.foundation.Image import androidx.compose.foundation.clickable +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.padding import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.getValue @@ -13,13 +14,11 @@ import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.ColorFilter import androidx.compose.ui.graphics.painter.Painter -import androidx.compose.ui.res.stringResource import kotlinx.coroutines.delay -import net.mullvad.mullvadvpn.R +import net.mullvad.mullvadvpn.compose.theme.Dimens internal const val PRESS_EFFECT_TIME_SPAN: Long = 1000 -@OptIn(ExperimentalAnimationApi::class) @Composable fun AnimatedIconButton( defaultIcon: Painter, @@ -28,48 +27,63 @@ fun AnimatedIconButton( pressEffectDuration: Long = PRESS_EFFECT_TIME_SPAN, defaultIconColorFilter: ColorFilter? = null, secondaryIconColorFilter: ColorFilter? = null, + contentDescription: String, isToggleButton: Boolean = false, onClick: () -> Unit ) { var state by remember { mutableStateOf(ButtonState.IDLE) } - AnimatedContent(targetState = state) { targetState -> - when (targetState) { - ButtonState.IDLE -> { - Image( - painter = defaultIcon, - colorFilter = defaultIconColorFilter, - contentDescription = "", - modifier = - modifier.clickable { - onClick() + if (state == ButtonState.PRESSED) { + LaunchedEffect(Unit) { + delay(pressEffectDuration) + state = ButtonState.IDLE + } + } + Box( + modifier = + modifier + .clickable { + when (state) { + ButtonState.IDLE -> { state = if (isToggleButton) ButtonState.TOGGLED else ButtonState.PRESSED - } - ) - } - ButtonState.TOGGLED -> { - Image( - painter = secondaryIcon, - colorFilter = secondaryIconColorFilter, - contentDescription = stringResource(id = R.string.copy_account_number), - modifier = - modifier.clickable { onClick() + } + ButtonState.TOGGLED -> { state = ButtonState.IDLE + onClick() } - ) - } - ButtonState.PRESSED -> { - LaunchedEffect(Unit) { - delay(pressEffectDuration) - state = ButtonState.IDLE + ButtonState.PRESSED -> {} + } + } + .padding(all = Dimens.smallPadding) + ) { + AnimatedContent(targetState = state, label = contentDescription) { targetState -> + val iconPainter: Painter + val colorFilter: ColorFilter? + val imageModifier: Modifier + when (targetState) { + ButtonState.IDLE -> { + iconPainter = defaultIcon + colorFilter = defaultIconColorFilter + imageModifier = modifier + } + ButtonState.TOGGLED -> { + iconPainter = secondaryIcon + colorFilter = secondaryIconColorFilter + imageModifier = modifier + } + ButtonState.PRESSED -> { + iconPainter = secondaryIcon + colorFilter = secondaryIconColorFilter + imageModifier = modifier } - Image( - painter = secondaryIcon, - colorFilter = secondaryIconColorFilter, - contentDescription = stringResource(id = R.string.copy_account_number), - modifier = modifier - ) } + + Image( + painter = iconPainter, + colorFilter = colorFilter, + contentDescription = contentDescription, + modifier = imageModifier + ) } } } diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CopyableObfuscationView.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CopyableObfuscationView.kt index 571985c0be..9efdcc96d8 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CopyableObfuscationView.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/CopyableObfuscationView.kt @@ -11,6 +11,7 @@ import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.ColorFilter import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.painterResource +import androidx.compose.ui.res.stringResource import androidx.compose.ui.tooling.preview.Preview import net.mullvad.mullvadvpn.R import net.mullvad.mullvadvpn.compose.button.AnimatedIconButton @@ -29,7 +30,10 @@ fun CopyableObfuscationView(content: String) { val context = LocalContext.current val shouldObfuscated = remember { mutableStateOf(true) } - Row(verticalAlignment = CenterVertically) { + Row( + verticalAlignment = CenterVertically, + modifier = Modifier.padding(end = Dimens.sideMargin) + ) { AccountNumberView( accountNumber = content, doObfuscateWithPasswordDots = shouldObfuscated.value, @@ -39,7 +43,7 @@ fun CopyableObfuscationView(content: String) { defaultIcon = painterResource(id = R.drawable.icon_hide), secondaryIcon = painterResource(id = R.drawable.icon_show), isToggleButton = true, - modifier = Modifier.padding(start = Dimens.smallPadding, end = Dimens.sideMargin), + contentDescription = stringResource(id = R.string.hide_account_number), onClick = { shouldObfuscated.value = shouldObfuscated.value.not() } ) AnimatedIconButton( @@ -48,7 +52,7 @@ fun CopyableObfuscationView(content: String) { secondaryIconColorFilter = ColorFilter.tint(color = MaterialTheme.colorScheme.inversePrimary), isToggleButton = false, - modifier = Modifier.padding(end = Dimens.sideMargin), + contentDescription = stringResource(id = R.string.copy_account_number), onClick = { context.copyToClipboard( content = content, |