From 21f7376ea2a30328f31a72fa8ecd42d5140825db Mon Sep 17 00:00:00 2001 From: ThomasSession Date: Wed, 19 Jun 2024 11:22:07 +1000 Subject: [PATCH] Fixing blocked views on small screen due to the keyboard popping up Also managed to maintain the ime padding for larger screens that DO want the button moving up. --- .../start/newmessage/NewMessage.kt | 69 ++++++++++------ .../onboarding/loadaccount/LoadAccount.kt | 78 ++++++++++++------- .../onboarding/pickname/PickDisplayName.kt | 30 +++++-- .../securesms/ui/components/Text.kt | 2 +- 4 files changed, 116 insertions(+), 63 deletions(-) diff --git a/app/src/main/java/org/thoughtcrime/securesms/conversation/start/newmessage/NewMessage.kt b/app/src/main/java/org/thoughtcrime/securesms/conversation/start/newmessage/NewMessage.kt index c61ca2263d..221c3cb612 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/conversation/start/newmessage/NewMessage.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/conversation/start/newmessage/NewMessage.kt @@ -5,11 +5,18 @@ import androidx.compose.foundation.ExperimentalFoundationApi import androidx.compose.foundation.background import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxHeight +import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.heightIn +import androidx.compose.foundation.layout.imePadding import androidx.compose.foundation.layout.padding import androidx.compose.foundation.pager.HorizontalPager import androidx.compose.foundation.pager.rememberPagerState +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll import androidx.compose.material.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment @@ -20,10 +27,12 @@ import androidx.compose.ui.tooling.preview.PreviewParameter import kotlinx.coroutines.flow.Flow import kotlinx.coroutines.flow.emptyFlow import network.loki.messenger.R +import org.thoughtcrime.securesms.onboarding.ui.ContinueButton import org.thoughtcrime.securesms.ui.LoadingArcOr import org.thoughtcrime.securesms.ui.LocalDimensions import org.thoughtcrime.securesms.ui.PreviewTheme import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider +import org.thoughtcrime.securesms.ui.base import org.thoughtcrime.securesms.ui.color.Colors import org.thoughtcrime.securesms.ui.color.LocalColors import org.thoughtcrime.securesms.ui.components.AppBar @@ -33,6 +42,7 @@ import org.thoughtcrime.securesms.ui.components.OutlineButton import org.thoughtcrime.securesms.ui.components.SessionOutlinedTextField import org.thoughtcrime.securesms.ui.components.SessionTabRow import org.thoughtcrime.securesms.ui.contentDescription +import org.thoughtcrime.securesms.ui.small private val TITLES = listOf(R.string.enter_account_id, R.string.qrScan) @@ -66,34 +76,45 @@ private fun EnterAccountId( callbacks: Callbacks, onHelp: () -> Unit = {} ) { + Column( modifier = Modifier - .padding(horizontal = LocalDimensions.current.xxsMargin, vertical = LocalDimensions.current.xsMargin) - .fillMaxHeight(), - horizontalAlignment = Alignment.CenterHorizontally, - verticalArrangement = Arrangement.spacedBy(LocalDimensions.current.xsMargin) + .fillMaxSize() + .verticalScroll(rememberScrollState()) + .imePadding() ) { - SessionOutlinedTextField( - text = state.newMessageIdOrOns, - modifier = Modifier - .padding(horizontal = LocalDimensions.current.smallMargin) - .contentDescription("Session id input box"), - placeholder = stringResource(R.string.accountIdOrOnsEnter), - onChange = callbacks::onChange, - onContinue = callbacks::onContinue, - error = state.error?.string(), - ) - BorderlessButtonWithIcon( - text = stringResource(R.string.messageNewDescription), - modifier = Modifier - .animateContentSize() - .contentDescription(R.string.AccessibilityId_help_desk_link) - .padding(horizontal = LocalDimensions.current.margin) - .fillMaxWidth(), - color = LocalColors.current.textSecondary, - iconRes = R.drawable.ic_circle_question_mark - ) { onHelp() } + Column( + modifier = Modifier.padding(horizontal = LocalDimensions.current.xxsMargin, vertical = LocalDimensions.current.xsMargin), + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.spacedBy(LocalDimensions.current.xsMargin) + ) { + + SessionOutlinedTextField( + text = state.newMessageIdOrOns, + modifier = Modifier + .padding(horizontal = LocalDimensions.current.smallMargin) + .contentDescription("Session id input box"), + placeholder = stringResource(R.string.accountIdOrOnsEnter), + onChange = callbacks::onChange, + onContinue = callbacks::onContinue, + error = state.error?.string(), + ) + + BorderlessButtonWithIcon( + text = stringResource(R.string.messageNewDescription), + modifier = Modifier + .animateContentSize() + .contentDescription(R.string.AccessibilityId_help_desk_link) + .padding(horizontal = LocalDimensions.current.margin) + .fillMaxWidth(), + style = small, + color = LocalColors.current.textSecondary, + iconRes = R.drawable.ic_circle_question_mark + ) { onHelp() } + } + + Spacer(Modifier.weight(2f)) OutlineButton( modifier = Modifier diff --git a/app/src/main/java/org/thoughtcrime/securesms/onboarding/loadaccount/LoadAccount.kt b/app/src/main/java/org/thoughtcrime/securesms/onboarding/loadaccount/LoadAccount.kt index 9faec7c0f1..4e348a04bd 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/onboarding/loadaccount/LoadAccount.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/onboarding/loadaccount/LoadAccount.kt @@ -4,12 +4,17 @@ import androidx.compose.foundation.ExperimentalFoundationApi import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.defaultMinSize +import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.heightIn import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.width import androidx.compose.foundation.pager.HorizontalPager import androidx.compose.foundation.pager.rememberPagerState +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll import androidx.compose.material.Icon import androidx.compose.material.Text import androidx.compose.runtime.Composable @@ -67,43 +72,56 @@ private fun PreviewRecoveryPassword() { @Composable private fun RecoveryPassword(state: State, onChange: (String) -> Unit = {}, onContinue: () -> Unit = {}) { - Column { Column( - modifier = Modifier.padding(horizontal = LocalDimensions.current.largeMargin) - .weight(1f) + modifier = Modifier + .fillMaxSize() + .verticalScroll(rememberScrollState()) ) { - Spacer(Modifier.weight(1f)) - Row { + Spacer( + Modifier + .heightIn(min = LocalDimensions.current.smallItemSpacing) + .weight(1f)) + // this is to make sure the spacer above doesn't get compressed to 0 + Spacer(modifier = Modifier.height(LocalDimensions.current.smallItemSpacing)) + + Column( + modifier = Modifier.padding(horizontal = LocalDimensions.current.largeMargin) + ) { + Row { + Text( + modifier = Modifier.weight(1f), + text = stringResource(R.string.sessionRecoveryPassword), + style = h4 + ) + Spacer(Modifier.width(LocalDimensions.current.xxsItemSpacing)) + Icon( + modifier = Modifier.align(Alignment.CenterVertically), + painter = painterResource(id = R.drawable.ic_shield_outline), + contentDescription = null, + ) + } + Spacer(Modifier.height(LocalDimensions.current.smallItemSpacing)) Text( - stringResource(R.string.sessionRecoveryPassword), - style = h4 + stringResource(R.string.activity_link_enter_your_recovery_password_to_load_your_account_if_you_haven_t_saved_it_you_can_find_it_in_your_app_settings), + style = base ) - Spacer(Modifier.width(LocalDimensions.current.xxsItemSpacing)) - Icon( - painter = painterResource(id = R.drawable.ic_shield_outline), - contentDescription = null, + Spacer(Modifier.height(LocalDimensions.current.itemSpacing)) + SessionOutlinedTextField( + text = state.recoveryPhrase, + modifier = Modifier + .fillMaxWidth() + .contentDescription(R.string.AccessibilityId_recovery_phrase_input), + placeholder = stringResource(R.string.recoveryPasswordEnter), + onChange = onChange, + onContinue = onContinue, + error = state.error ) } - Spacer(Modifier.height(LocalDimensions.current.smallItemSpacing)) - Text( - stringResource(R.string.activity_link_enter_your_recovery_password_to_load_your_account_if_you_haven_t_saved_it_you_can_find_it_in_your_app_settings), - style = base - ) - Spacer(Modifier.height(LocalDimensions.current.itemSpacing)) - SessionOutlinedTextField( - text = state.recoveryPhrase, - modifier = Modifier - .fillMaxWidth() - .contentDescription(R.string.AccessibilityId_recovery_phrase_input), - placeholder = stringResource(R.string.recoveryPasswordEnter), - onChange = onChange, - onContinue = onContinue, - error = state.error - ) + // this is to make sure the spacer below doesn't get compressed to 0 + Spacer(modifier = Modifier.height(LocalDimensions.current.smallItemSpacing)) Spacer(Modifier.weight(2f)) - } - ContinueButton(modifier = Modifier.align(Alignment.CenterHorizontally), onContinue) - } + ContinueButton(modifier = Modifier.align(Alignment.CenterHorizontally), onContinue) + } } diff --git a/app/src/main/java/org/thoughtcrime/securesms/onboarding/pickname/PickDisplayName.kt b/app/src/main/java/org/thoughtcrime/securesms/onboarding/pickname/PickDisplayName.kt index 412908e597..e7a8aece44 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/onboarding/pickname/PickDisplayName.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/onboarding/pickname/PickDisplayName.kt @@ -2,9 +2,13 @@ package org.thoughtcrime.securesms.onboarding.pickname import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.heightIn import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll import androidx.compose.material.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment @@ -30,13 +34,21 @@ private fun PreviewDisplayName() { @Composable internal fun DisplayName(state: State, onChange: (String) -> Unit = {}, onContinue: () -> Unit = {}) { - Column { + Column( + modifier = Modifier + .fillMaxSize() + .verticalScroll(rememberScrollState()) + ) { + Spacer( + Modifier + .heightIn(min = LocalDimensions.current.smallItemSpacing) + .weight(1f)) + // this is to make sure the spacer above doesn't get compressed to 0 + Spacer(modifier = Modifier.height(LocalDimensions.current.smallItemSpacing)) + Column( - modifier = Modifier - .padding(horizontal = LocalDimensions.current.onboardingMargin) - .weight(1f) + modifier = Modifier.padding(horizontal = LocalDimensions.current.largeMargin) ) { - Spacer(modifier = Modifier.weight(1f)) Text(stringResource(state.title), style = h4) Spacer(Modifier.height(LocalDimensions.current.smallItemSpacing)) Text( @@ -54,10 +66,12 @@ internal fun DisplayName(state: State, onChange: (String) -> Unit = {}, onContin onContinue = onContinue, error = state.error?.let { stringResource(it) } ) - - Spacer(modifier = Modifier.weight(2f)) } - ContinueButton(Modifier.align(Alignment.CenterHorizontally), onContinue) + // this is to make sure the spacer below doesn't get compressed to 0 + Spacer(modifier = Modifier.height(LocalDimensions.current.smallItemSpacing)) + Spacer(Modifier.weight(2f)) + + ContinueButton(modifier = Modifier.align(Alignment.CenterHorizontally), onContinue) } } diff --git a/app/src/main/java/org/thoughtcrime/securesms/ui/components/Text.kt b/app/src/main/java/org/thoughtcrime/securesms/ui/components/Text.kt index 6c0a9f07c6..a7c88183a1 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/ui/components/Text.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/ui/components/Text.kt @@ -99,7 +99,7 @@ fun AnnotatedTextWithIcon( Placeholder( width = iconSize, height = iconSize, - placeholderVerticalAlign = PlaceholderVerticalAlign.AboveBaseline + placeholderVerticalAlign = PlaceholderVerticalAlign.TextCenter ) ) { Icon(