From 281805d8231a88cd1ec4c7ad81afe3c62b9ee36c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?David=20G=C3=B6ransson?= Date: Mon, 11 Sep 2023 11:40:01 +0200 Subject: [PATCH 1/2] Fix alpha issue on split tunneling view --- .../mullvadvpn/compose/cell/SplitTunnelingCell.kt | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/SplitTunnelingCell.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/SplitTunnelingCell.kt index aaf0d288382f..dd5e075d70bc 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/SplitTunnelingCell.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/SplitTunnelingCell.kt @@ -18,9 +18,11 @@ import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.ImageBitmap import androidx.compose.ui.graphics.asImageBitmap +import androidx.compose.ui.graphics.compositeOver import androidx.compose.ui.graphics.painter.BitmapPainter import androidx.compose.ui.res.painterResource import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp import kotlinx.coroutines.Dispatchers import kotlinx.coroutines.launch import net.mullvad.mullvadvpn.R @@ -33,7 +35,10 @@ import org.koin.androidx.compose.get @Composable private fun PreviewTunnelingCell() { AppTheme { - Column(modifier = Modifier.background(color = MaterialTheme.colorScheme.background)) { + Column( + modifier = + Modifier.background(color = MaterialTheme.colorScheme.background).padding(20.dp) + ) { SplitTunnelingCell(title = "Mullvad VPN", packageName = "", isSelected = false) SplitTunnelingCell(title = "Mullvad VPN", packageName = "", isSelected = true) } @@ -63,7 +68,11 @@ fun SplitTunnelingCell( .defaultMinSize(minHeight = Dimens.listItemHeightExtra) .fillMaxWidth() .padding(vertical = Dimens.listItemDivider) - .background(MaterialTheme.colorScheme.primaryContainer) + .background( + MaterialTheme.colorScheme.primaryContainer.compositeOver( + MaterialTheme.colorScheme.background + ) + ) .clickable(onClick = onCellClicked) ) { Image( From 1f68473f395ab21b5c92bab5e3e18521af525675 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?David=20G=C3=B6ransson?= Date: Mon, 11 Sep 2023 15:28:48 +0200 Subject: [PATCH 2/2] Fix row animations --- .../net/mullvad/mullvadvpn/compose/cell/BaseCell.kt | 11 +++-------- .../mullvadvpn/compose/cell/SwitchComposeCell.kt | 10 +++++++--- .../mullvadvpn/compose/screen/SplitTunnelingScreen.kt | 9 +++++++-- 3 files changed, 17 insertions(+), 13 deletions(-) diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/BaseCell.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/BaseCell.kt index c3c3b4ddef45..262d46e31ca1 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/BaseCell.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/BaseCell.kt @@ -65,17 +65,12 @@ internal fun BaseCell( minHeight: Dp = Dimens.cellHeight, testTag: String = "" ) { - val rowModifier = - Modifier.let { - if (isRowEnabled) { - it.clickable { onCellClicked() } - } else it - } Row( verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.Start, modifier = - rowModifier + modifier + .clickable(isRowEnabled, onClick = onCellClicked) .wrapContentHeight() .defaultMinSize(minHeight = minHeight) .fillMaxWidth() @@ -89,7 +84,7 @@ internal fun BaseCell( Spacer(modifier = Modifier.weight(1.0f)) - Column(modifier = modifier.wrapContentWidth().wrapContentHeight()) { bodyView() } + Column(modifier = Modifier.wrapContentWidth().wrapContentHeight()) { bodyView() } } } diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/SwitchComposeCell.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/SwitchComposeCell.kt index ccd6a541ef00..02546e37d3b7 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/SwitchComposeCell.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/SwitchComposeCell.kt @@ -75,11 +75,12 @@ fun NormalSwitchComposeCell( fun HeaderSwitchComposeCell( title: String, isToggled: Boolean, + modifier: Modifier = Modifier, startPadding: Dp = Dimens.cellStartPadding, isEnabled: Boolean = true, background: Color = MaterialTheme.colorScheme.primary, onCellClicked: (Boolean) -> Unit = {}, - onInfoClicked: (() -> Unit)? = null + onInfoClicked: (() -> Unit)? = null, ) { SwitchComposeCell( titleView = { BaseCellTitle(title = title, style = MaterialTheme.typography.titleMedium) }, @@ -88,7 +89,8 @@ fun HeaderSwitchComposeCell( isEnabled = isEnabled, background = background, onCellClicked = onCellClicked, - onInfoClicked = onInfoClicked + onInfoClicked = onInfoClicked, + modifier, ) } @@ -100,9 +102,11 @@ private fun SwitchComposeCell( isEnabled: Boolean, background: Color, onCellClicked: (Boolean) -> Unit, - onInfoClicked: (() -> Unit)? + onInfoClicked: (() -> Unit)?, + modifier: Modifier = Modifier, ) { BaseCell( + modifier = modifier, title = titleView, isRowEnabled = isEnabled, bodyView = { diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/SplitTunnelingScreen.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/SplitTunnelingScreen.kt index ac101b48ab2f..5170ef0845fa 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/SplitTunnelingScreen.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/SplitTunnelingScreen.kt @@ -183,7 +183,10 @@ fun SplitTunnelingScreen( } } item(key = CommonContentKey.SPACER, contentType = ContentType.SPACER) { - Spacer(modifier = Modifier.height(Dimens.mediumPadding)) + Spacer( + modifier = + Modifier.animateItemPlacement().height(Dimens.mediumPadding) + ) } } @@ -194,7 +197,8 @@ fun SplitTunnelingScreen( HeaderSwitchComposeCell( title = stringResource(id = R.string.show_system_apps), isToggled = uiState.showSystemApps, - onCellClicked = { newValue -> onShowSystemAppsClick(newValue) } + onCellClicked = { newValue -> onShowSystemAppsClick(newValue) }, + modifier = Modifier.animateItemPlacement() ) } itemWithDivider( @@ -202,6 +206,7 @@ fun SplitTunnelingScreen( contentType = ContentType.HEADER ) { BaseCell( + modifier = Modifier.animateItemPlacement(), title = { Text( text = stringResource(id = R.string.all_applications),