fix: Improve responsive design

Signed-off-by: Myzel394 <50424412+Myzel394@users.noreply.github.com>
This commit is contained in:
Myzel394 2024-04-03 20:24:57 +02:00
parent 0ec149ee02
commit 08084d207e
No known key found for this signature in database
GPG Key ID: DEC4AAB876F73185
5 changed files with 116 additions and 97 deletions

View File

@ -35,12 +35,13 @@ fun BigButton(
description: String? = null,
onClick: () -> Unit,
onLongClick: () -> Unit = {},
isBig: Boolean? = null,
) {
val orientation = LocalConfiguration.current.orientation
BoxWithConstraints {
val isLarge =
maxWidth > 250.dp && maxHeight > 600.dp && orientation == Configuration.ORIENTATION_PORTRAIT
val isLarge = if (isBig == null)
maxWidth > 250.dp && maxHeight > 600.dp && orientation == Configuration.ORIENTATION_PORTRAIT else isBig
Column(
modifier = Modifier

View File

@ -18,6 +18,7 @@ import app.myzel394.alibi.ui.components.atoms.VisualDensity
@Composable
fun LowStorageInfo(
modifier: Modifier = Modifier.padding(horizontal = 16.dp, vertical = 4.dp),
appSettings: AppSettings,
) {
val context = LocalContext.current
@ -36,9 +37,7 @@ fun LowStorageInfo(
println("LowStorageInfo: availableBytes: $availableBytes, requiredBytes: $requiredBytes, isLowOnStorage: $isLowOnStorage")
if (isLowOnStorage)
Box(
modifier = Modifier.padding(horizontal = 16.dp, vertical = 4.dp)
) {
Box(modifier = modifier) {
BoxWithConstraints {
val isLarge = maxHeight > 600.dp;

View File

@ -22,6 +22,7 @@ import app.myzel394.alibi.ui.models.AudioRecorderModel
fun AudioRecordingStart(
audioRecorder: AudioRecorderModel,
appSettings: AppSettings,
useLargeButtons: Boolean? = null,
) {
val context = LocalContext.current
@ -59,6 +60,7 @@ fun AudioRecordingStart(
label = stringResource(R.string.ui_audioRecorder_action_start_label),
icon = Icons.Default.Mic,
onClick = triggerRecordAudio,
isBig = useLargeButtons,
)
}
}

View File

@ -27,6 +27,7 @@ fun VideoRecordingStart(
onHideAudioRecording: () -> Unit,
onShowAudioRecording: () -> Unit,
showPreview: Boolean,
useLargeButtons: Boolean? = null,
) {
val context = LocalContext.current
@ -87,6 +88,7 @@ fun VideoRecordingStart(
showSheet = true
}
},
isBig = useLargeButtons,
)
}
}

View File

@ -3,6 +3,7 @@ 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.BoxWithConstraints
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
@ -100,6 +101,10 @@ fun StartRecording(
)
}
BoxWithConstraints {
val isLargeDisplay =
maxWidth > 250.dp && maxHeight > 600.dp && orientation == Configuration.ORIENTATION_PORTRAIT
Column(
modifier = Modifier
.fillMaxSize()
@ -136,6 +141,7 @@ fun StartRecording(
AudioRecordingStart(
audioRecorder = audioRecorder,
appSettings = appSettings,
useLargeButtons = isLargeDisplay,
)
VideoRecordingStart(
videoRecorder = videoRecorder,
@ -143,6 +149,7 @@ fun StartRecording(
onHideAudioRecording = onHideTopBar,
onShowAudioRecording = onShowTopBar,
showPreview = !showAudioRecorder,
useLargeButtons = isLargeDisplay,
)
}
}
@ -214,6 +221,14 @@ fun StartRecording(
}
}
LowStorageInfo(appSettings = appSettings)
LowStorageInfo(
modifier = if (isLargeDisplay) Modifier
.padding(16.dp)
.widthIn(max = 400.dp) else Modifier
.fillMaxWidth()
.padding(4.dp),
appSettings = appSettings
)
}
}
}