Ensure the invisible buttons have the correct size.

This commit is contained in:
Benoit Marty
2024-11-07 18:51:17 +01:00
committed by Benoit Marty
parent df3bd31118
commit 2091c5559d
3 changed files with 27 additions and 26 deletions

View File

@@ -10,9 +10,7 @@ package io.element.android.features.verifysession.impl.incoming
import androidx.activity.compose.BackHandler
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.runtime.Composable
@@ -35,6 +33,7 @@ import io.element.android.libraries.designsystem.components.PageTitle
import io.element.android.libraries.designsystem.preview.ElementPreview
import io.element.android.libraries.designsystem.preview.PreviewsDayNight
import io.element.android.libraries.designsystem.theme.components.Button
import io.element.android.libraries.designsystem.theme.components.InvisibleButton
import io.element.android.libraries.designsystem.theme.components.Text
import io.element.android.libraries.designsystem.theme.components.TextButton
import io.element.android.libraries.designsystem.theme.components.TopAppBar
@@ -166,8 +165,7 @@ private fun IncomingVerificationBottomMenu(
enabled = false,
showProgress = true,
)
// Placeholder so the 1st button keeps its vertical position
Spacer(modifier = Modifier.height(40.dp))
InvisibleButton()
}
} else {
VerificationBottomMenu {
@@ -194,8 +192,7 @@ private fun IncomingVerificationBottomMenu(
enabled = false,
showProgress = true,
)
// Placeholder so the 1st button keeps its vertical position
Spacer(modifier = Modifier.height(40.dp))
InvisibleButton()
}
} else {
VerificationBottomMenu {

View File

@@ -12,10 +12,8 @@ import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
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.padding
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.runtime.Composable
@@ -44,6 +42,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreview
import io.element.android.libraries.designsystem.preview.PreviewsDayNight
import io.element.android.libraries.designsystem.theme.components.Button
import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
import io.element.android.libraries.designsystem.theme.components.InvisibleButton
import io.element.android.libraries.designsystem.theme.components.OutlinedButton
import io.element.android.libraries.designsystem.theme.components.Text
import io.element.android.libraries.designsystem.theme.components.TextButton
@@ -282,8 +281,7 @@ private fun VerifySelfSessionBottomMenu(
text = stringResource(CommonStrings.action_start_verification),
onClick = { eventSink(VerifySelfSessionViewEvents.RequestVerification) },
)
// Placeholder so the 1st button keeps its vertical position
Spacer(modifier = Modifier.height(40.dp))
InvisibleButton()
}
}
is Step.Canceled -> {
@@ -293,8 +291,7 @@ private fun VerifySelfSessionBottomMenu(
text = stringResource(CommonStrings.action_done),
onClick = onCancelClick,
)
// Placeholder so the 1st button keeps its vertical position
Spacer(modifier = Modifier.height(40.dp))
InvisibleButton()
}
}
is Step.Ready -> {
@@ -320,8 +317,7 @@ private fun VerifySelfSessionBottomMenu(
showProgress = true,
enabled = false,
)
// Placeholder so the 1st button keeps its vertical position
Spacer(modifier = Modifier.height(40.dp))
InvisibleButton()
}
}
is Step.Verifying -> {
@@ -343,8 +339,7 @@ private fun VerifySelfSessionBottomMenu(
},
)
if (isVerifying) {
// Placeholder so the 1st button keeps its vertical position
Spacer(modifier = Modifier.height(40.dp))
InvisibleButton()
} else {
TextButton(
modifier = Modifier.fillMaxWidth(),
@@ -361,8 +356,7 @@ private fun VerifySelfSessionBottomMenu(
text = stringResource(CommonStrings.action_continue),
onClick = onContinueClick,
)
// Placeholder so the 1st button keeps its vertical position
Spacer(modifier = Modifier.height(48.dp))
InvisibleButton()
}
}
is Step.Skipped -> return

View File

@@ -17,6 +17,7 @@ import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
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.size
@@ -118,6 +119,14 @@ fun TextButton(
leadingIcon = leadingIcon
)
@Composable
fun InvisibleButton(
modifier: Modifier = Modifier,
size: ButtonSize = ButtonSize.Large,
) {
Spacer(modifier = modifier.height(size.toMinHeight()))
}
@Composable
private fun ButtonInternal(
text: String,
@@ -131,14 +140,7 @@ private fun ButtonInternal(
showProgress: Boolean = false,
leadingIcon: IconSource? = null,
) {
val minHeight = when (size) {
ButtonSize.Small -> 32.dp
ButtonSize.Medium,
ButtonSize.MediumLowPadding -> 40.dp
ButtonSize.Large,
ButtonSize.LargeLowPadding -> 48.dp
}
val minHeight = size.toMinHeight()
val hasStartDrawable = showProgress || leadingIcon != null
val contentPadding = when (size) {
@@ -253,6 +255,14 @@ private fun ButtonInternal(
}
}
private fun ButtonSize.toMinHeight() = when (this) {
ButtonSize.Small -> 32.dp
ButtonSize.Medium,
ButtonSize.MediumLowPadding -> 40.dp
ButtonSize.Large,
ButtonSize.LargeLowPadding -> 48.dp
}
@Immutable
sealed interface IconSource {
val contentDescription: String?