From cc4af773fbc78bddd76f4f7ab63bf056256bc24c Mon Sep 17 00:00:00 2001 From: Myzel394 <50424412+Myzel394@users.noreply.github.com> Date: Fri, 23 Feb 2024 21:54:07 +0100 Subject: [PATCH] fix(ui): Make StartRecording more responsive for landscape mode Signed-off-by: Myzel394 <50424412+Myzel394@users.noreply.github.com> --- .../java/app/myzel394/alibi/ui/Constants.kt | 1 + .../RecorderScreen/atoms/BigButton.kt | 13 ++-- .../organisms/StartRecording.kt | 59 ++++++++++++++----- 3 files changed, 51 insertions(+), 22 deletions(-) diff --git a/app/src/main/java/app/myzel394/alibi/ui/Constants.kt b/app/src/main/java/app/myzel394/alibi/ui/Constants.kt index 8d7f7a9..979ee51 100644 --- a/app/src/main/java/app/myzel394/alibi/ui/Constants.kt +++ b/app/src/main/java/app/myzel394/alibi/ui/Constants.kt @@ -4,6 +4,7 @@ import android.os.Build import androidx.compose.ui.unit.dp val BIG_PRIMARY_BUTTON_SIZE = 64.dp +val BIG_PRIMARY_BUTTON_MAX_WIDTH = 450.dp val SHEET_BOTTOM_OFFSET = 24.dp val MAX_AMPLITUDE = 20000 diff --git a/app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/atoms/BigButton.kt b/app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/atoms/BigButton.kt index e2f9c3f..3856550 100644 --- a/app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/atoms/BigButton.kt +++ b/app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/atoms/BigButton.kt @@ -1,6 +1,6 @@ package app.myzel394.alibi.ui.components.RecorderScreen.atoms -import android.Manifest +import android.content.res.Configuration import androidx.compose.foundation.ExperimentalFoundationApi import androidx.compose.foundation.combinedClickable import androidx.compose.foundation.interaction.MutableInteractionSource @@ -11,10 +11,7 @@ import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.size import androidx.compose.foundation.shape.CircleShape -import androidx.compose.material.icons.Icons -import androidx.compose.material.icons.filled.Mic import androidx.compose.material.ripple.rememberRipple -import androidx.compose.material3.Button import androidx.compose.material3.ButtonDefaults import androidx.compose.material3.Icon import androidx.compose.material3.MaterialTheme @@ -25,12 +22,10 @@ import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip import androidx.compose.ui.graphics.vector.ImageVector -import androidx.compose.ui.res.stringResource +import androidx.compose.ui.platform.LocalConfiguration import androidx.compose.ui.semantics.contentDescription import androidx.compose.ui.semantics.semantics import androidx.compose.ui.unit.dp -import app.myzel394.alibi.R -import app.myzel394.alibi.ui.utils.PermissionHelper @OptIn(ExperimentalFoundationApi::class) @Composable @@ -41,8 +36,10 @@ fun BigButton( onClick: () -> Unit, onLongClick: () -> Unit = {}, ) { + val orientation = LocalConfiguration.current.orientation + BoxWithConstraints { - val isLarge = maxWidth > 500.dp + val isLarge = maxWidth > 500.dp && orientation == Configuration.ORIENTATION_PORTRAIT Column( modifier = Modifier diff --git a/app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/organisms/StartRecording.kt b/app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/organisms/StartRecording.kt index 575f22c..a57d274 100644 --- a/app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/organisms/StartRecording.kt +++ b/app/src/main/java/app/myzel394/alibi/ui/components/RecorderScreen/organisms/StartRecording.kt @@ -1,5 +1,6 @@ package app.myzel394.alibi.ui.components.RecorderScreen.organisms +import android.content.res.Configuration import androidx.compose.foundation.Image import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column @@ -9,13 +10,13 @@ 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.foundation.layout.requiredWidthIn import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.widthIn import androidx.compose.foundation.text.ClickableText import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Save -import androidx.compose.material3.Button import androidx.compose.material3.ButtonDefaults import androidx.compose.material3.Icon import androidx.compose.material3.MaterialTheme @@ -29,6 +30,7 @@ import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.ColorFilter +import androidx.compose.ui.platform.LocalConfiguration import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource @@ -40,6 +42,7 @@ import androidx.compose.ui.text.withStyle import androidx.compose.ui.unit.dp import app.myzel394.alibi.R import app.myzel394.alibi.db.AppSettings +import app.myzel394.alibi.ui.BIG_PRIMARY_BUTTON_MAX_WIDTH import app.myzel394.alibi.ui.BIG_PRIMARY_BUTTON_SIZE import app.myzel394.alibi.ui.components.RecorderScreen.molecules.AudioRecordingStart import app.myzel394.alibi.ui.components.RecorderScreen.molecules.QuickMaxDurationSelector @@ -64,6 +67,7 @@ fun StartRecording( showAudioRecorder: Boolean, ) { val context = LocalContext.current + val orientation = LocalConfiguration.current.orientation val label = stringResource( R.string.ui_recorder_action_start_description_2, @@ -98,24 +102,50 @@ fun StartRecording( Column( modifier = Modifier .fillMaxSize() - .padding(bottom = 32.dp), + .padding(bottom = if (orientation == Configuration.ORIENTATION_PORTRAIT) 32.dp else 16.dp), verticalArrangement = Arrangement.SpaceBetween, horizontalAlignment = Alignment.CenterHorizontally, ) { Spacer(modifier = Modifier.weight(1f)) - if (showAudioRecorder) - AudioRecordingStart( - audioRecorder = audioRecorder, - appSettings = appSettings, - ) - VideoRecordingStart( - videoRecorder = videoRecorder, - appSettings = appSettings, - onHideAudioRecording = onHideTopBar, - onShowAudioRecording = onShowTopBar, - showPreview = !showAudioRecorder, - ) + when (orientation) { + Configuration.ORIENTATION_LANDSCAPE -> { + Row( + modifier = Modifier.fillMaxWidth(), + horizontalArrangement = Arrangement.SpaceEvenly, + verticalAlignment = Alignment.CenterVertically, + ) { + if (showAudioRecorder) + AudioRecordingStart( + audioRecorder = audioRecorder, + appSettings = appSettings, + ) + VideoRecordingStart( + videoRecorder = videoRecorder, + appSettings = appSettings, + onHideAudioRecording = onHideTopBar, + onShowAudioRecording = onShowTopBar, + showPreview = !showAudioRecorder, + ) + } + } + + else -> { + if (showAudioRecorder) + AudioRecordingStart( + audioRecorder = audioRecorder, + appSettings = appSettings, + ) + VideoRecordingStart( + videoRecorder = videoRecorder, + appSettings = appSettings, + onHideAudioRecording = onHideTopBar, + onShowAudioRecording = onShowTopBar, + showPreview = !showAudioRecorder, + ) + } + } + val forceUpdate = rememberForceUpdateOnLifeCycleChange() Column( @@ -133,6 +163,7 @@ fun StartRecording( TextButton( modifier = Modifier .fillMaxWidth() + .requiredWidthIn(max = BIG_PRIMARY_BUTTON_MAX_WIDTH) .height(BIG_PRIMARY_BUTTON_SIZE) .semantics { contentDescription = label