From 47db813bb030700c5c67b82d0ac0af311e881fc0 Mon Sep 17 00:00:00 2001 From: Jonatan Rhodin Date: Tue, 11 Jun 2024 11:42:10 +0200 Subject: [PATCH] Fix some ui issues --- .../MullvadExposedDropdownMenuBox.kt | 4 ++-- .../compose/component/Scaffolding.kt | 4 +++- .../compose/screen/ApiAccessListScreen.kt | 3 +-- .../screen/EditApiAccessMethodScreen.kt | 19 +++++++++++++++---- .../viewmodel/EditApiAccessMethodViewModel.kt | 4 ++-- .../mullvadvpn/lib/theme/color/Color.kt | 3 +++ 6 files changed, 26 insertions(+), 11 deletions(-) diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/MullvadExposedDropdownMenuBox.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/MullvadExposedDropdownMenuBox.kt index 1d72e13ec952..b859670ac18f 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/MullvadExposedDropdownMenuBox.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/MullvadExposedDropdownMenuBox.kt @@ -42,7 +42,7 @@ fun MullvadExposedDropdownMenuBox( modifier = Modifier.fillMaxWidth().menuAnchor(), readOnly = true, value = title, - onValueChange = { /* Do nothing */}, + onValueChange = { /* Do nothing */ }, label = { Text(text = label) }, trailingIcon = { ExposedDropdownMenuDefaults.TrailingIcon(expanded = expanded) }, colors = colors, @@ -50,7 +50,7 @@ fun MullvadExposedDropdownMenuBox( ExposedDropdownMenu( expanded = expanded, onDismissRequest = { expanded = false }, - modifier = Modifier.background(MaterialTheme.colorScheme.surfaceContainer) + modifier = Modifier.background(MaterialTheme.colorScheme.primary) ) { content { expanded = false } } diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/Scaffolding.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/Scaffolding.kt index 9dd7a0a28792..3f614d1c8b9c 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/Scaffolding.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/Scaffolding.kt @@ -4,7 +4,9 @@ import androidx.compose.foundation.background import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.RowScope +import androidx.compose.foundation.layout.WindowInsets import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.imePadding import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.systemBarsPadding import androidx.compose.foundation.lazy.LazyListState @@ -274,7 +276,7 @@ fun ScaffoldWithSmallTopBar( content: @Composable (modifier: Modifier) -> Unit ) { Scaffold( - modifier = modifier.fillMaxSize(), + modifier = modifier.fillMaxSize().imePadding(), topBar = { MullvadSmallTopBar( title = appBarTitle, diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/ApiAccessListScreen.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/ApiAccessListScreen.kt index 1377a94470b2..2703c19f5795 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/ApiAccessListScreen.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/ApiAccessListScreen.kt @@ -90,7 +90,6 @@ fun ApiAccessListScreen( currentApiAccessMethodName = state.currentApiAccessMethod?.name, onInfoClicked = onApiAccessInfoClick ) - // Spacer(modifier = Modifier.height(Dimens.verticalSpace)) apiAccessMethodItems( state.apiAccessMethods, onApiAccessMethodClick = onApiAccessMethodClick @@ -132,7 +131,7 @@ private fun LazyListScope.currentAccessMethod( verticalAlignment = Alignment.CenterVertically ) { Text( - style = MaterialTheme.typography.titleLarge, + style = MaterialTheme.typography.titleMedium, color = MaterialTheme.colorScheme.onBackground, text = stringResource( diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/EditApiAccessMethodScreen.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/EditApiAccessMethodScreen.kt index 730fd84c7d6e..5251bc97113a 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/EditApiAccessMethodScreen.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/screen/EditApiAccessMethodScreen.kt @@ -1,5 +1,6 @@ package net.mullvad.mullvadvpn.compose.screen +import androidx.compose.animation.animateContentSize import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.ColumnScope import androidx.compose.foundation.layout.Spacer @@ -10,6 +11,7 @@ import androidx.compose.foundation.verticalScroll import androidx.compose.material3.Icon import androidx.compose.material3.MaterialTheme import androidx.compose.material3.SnackbarHostState +import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.remember @@ -218,9 +220,13 @@ fun EditApiAccessMethodScreen( onPasswordChanged = onPasswordChanged ) } - Spacer(modifier = Modifier.height(Dimens.largePadding)) + Spacer(modifier = Modifier.weight(1f)) TestMethodButton( - modifier = Modifier.padding(bottom = Dimens.verticalSpace), + modifier = + Modifier.padding( + bottom = Dimens.verticalSpace, + top = Dimens.largePadding + ), testMethodState = state.testMethodState, onTestMethod = onTestMethod ) @@ -251,7 +257,8 @@ private fun NameInputField( isDigitsOnlyAllowed = false, maxCharLength = ApiAccessMethodName.MAX_LENGTH, errorText = nameError?.let { textResource(id = R.string.this_field_is_required) }, - capitalization = KeyboardCapitalization.Words + capitalization = KeyboardCapitalization.Words, + modifier = Modifier.animateContentSize() ) } @@ -368,7 +375,8 @@ private fun ServerIpInput( R.string.this_field_is_required } ) - } + }, + modifier = Modifier.animateContentSize() ) } @@ -396,6 +404,7 @@ private fun PortInput( } ) }, + modifier = Modifier.animateContentSize() ) } @@ -428,6 +437,7 @@ private fun PasswordInput( ImeAction.Done }, errorText = passwordError?.let { textResource(id = R.string.this_field_is_required) }, + modifier = Modifier.animateContentSize() ) } @@ -529,6 +539,7 @@ private fun UsernameInput( isValidValue = usernameError == null, isDigitsOnlyAllowed = false, errorText = usernameError?.let { textResource(id = R.string.this_field_is_required) }, + modifier = Modifier.animateContentSize() ) } diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/viewmodel/EditApiAccessMethodViewModel.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/viewmodel/EditApiAccessMethodViewModel.kt index b8d914156a24..74cf738ae52b 100644 --- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/viewmodel/EditApiAccessMethodViewModel.kt +++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/viewmodel/EditApiAccessMethodViewModel.kt @@ -165,9 +165,9 @@ class EditApiAccessMethodViewModel( > = zipOrAccumulate( if (skipNameValidation) { - parseName(name) - } else { ApiAccessMethodName.fromString(name).right() + } else { + parseName(name) }, when (apiAccessMethodTypes) { ApiAccessMethodTypes.SHADOWSOCKS -> { diff --git a/android/lib/theme/src/main/kotlin/net/mullvad/mullvadvpn/lib/theme/color/Color.kt b/android/lib/theme/src/main/kotlin/net/mullvad/mullvadvpn/lib/theme/color/Color.kt index 343e41dc1a0f..7dffcdd4cf9f 100644 --- a/android/lib/theme/src/main/kotlin/net/mullvad/mullvadvpn/lib/theme/color/Color.kt +++ b/android/lib/theme/src/main/kotlin/net/mullvad/mullvadvpn/lib/theme/color/Color.kt @@ -44,3 +44,6 @@ val menuItemColors: MenuItemColors leadingIconColor = MaterialTheme.colorScheme.onSurface, textColor = MaterialTheme.colorScheme.onSurface, ) + + +