Sulkta-OSS/element-x-ada
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Pin unlock : best effort for small height

Browse source
This commit is contained in:
ganfra 2023-10-20 17:57:29 +02:00
parent a6060ab4ab
commit f12de0ce1d
1 changed files with 101 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

122
features/lockscreen/impl/src/main/kotlin/io/element/android/features/lockscreen/impl/unlock/PinUnlockView.kt
View file

@ -17,16 +17,20 @@
package io.element.android.features.lockscreen.impl.unlock
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Arrangement.spacedBy
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.BoxWithConstraints
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
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.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.systemBarsPadding
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Lock
@ -34,18 +38,20 @@ import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.PreviewParameter
import androidx.compose.ui.unit.dp
import io.element.android.features.lockscreen.impl.R
import io.element.android.features.lockscreen.impl.pin.model.PinDigit
import io.element.android.features.lockscreen.impl.pin.model.PinEntry
import io.element.android.features.lockscreen.impl.unlock.numpad.PinKeypad
import io.element.android.libraries.designsystem.atomic.pages.HeaderFooterPage
import io.element.android.libraries.designsystem.preview.ElementPreview
import io.element.android.libraries.designsystem.preview.PreviewsDayNight
import io.element.android.libraries.designsystem.theme.components.Icon
import io.element.android.libraries.designsystem.theme.components.Surface
import io.element.android.libraries.designsystem.theme.components.Text
import io.element.android.libraries.designsystem.theme.components.TextButton
import io.element.android.libraries.theme.ElementTheme
@Composable
@ -54,31 +60,95 @@ fun PinUnlockView(
modifier: Modifier = Modifier,
) {
Surface(modifier) {
HeaderFooterPage(
header = {
BoxWithConstraints {
val commonModifier = Modifier
.fillMaxSize()
.systemBarsPadding()
.padding(all = 20.dp)
val header = @Composable {
PinUnlockHeader(
state = state,
modifier = Modifier.padding(top = 60.dp, bottom = 12.dp)
)
},
content = {
Box(
modifier = Modifier
.padding(top = 40.dp)
.fillMaxWidth(),
) {
PinKeypad(
onClick = {
state.eventSink(PinUnlockEvents.OnPinKeypadPressed(it))
},
horizontalArrangement = spacedBy(24.dp, Alignment.CenterHorizontally),
verticalArrangement = spacedBy(16.dp, Alignment.CenterVertically),
horizontalAlignment = Alignment.CenterHorizontally,
verticalAlignment = Alignment.CenterVertically,
)
}
}
)
val footer = @Composable {
PinUnlockFooter()
}
val content = @Composable {
PinKeypad(
onClick = {
state.eventSink(PinUnlockEvents.OnPinKeypadPressed(it))
},
horizontalArrangement = spacedBy(24.dp, Alignment.CenterHorizontally),
verticalArrangement = spacedBy(16.dp, Alignment.CenterVertically),
horizontalAlignment = Alignment.CenterHorizontally,
verticalAlignment = Alignment.CenterVertically,
)
}
if (maxHeight < 600.dp) {
PinUnlockCompactView(
header = header,
footer = footer,
content = content,
modifier = commonModifier,
)
} else {
PinUnlockExpandedView(
header = header,
footer = footer,
content = content,
modifier = commonModifier,
)
}
}
}
}
@Composable
fun PinUnlockCompactView(
modifier: Modifier = Modifier,
header: @Composable () -> Unit,
footer: @Composable () -> Unit,
content: @Composable () -> Unit,
) {
Row(modifier = modifier) {
Column(Modifier.weight(1f)) {
header()
Spacer(modifier = Modifier.height(24.dp))
footer()
}
Box(
modifier = Modifier
.weight(1f)
.fillMaxHeight(),
contentAlignment = Alignment.Center,
) {
content()
}
}
}
@Composable
fun PinUnlockExpandedView(
modifier: Modifier = Modifier,
header: @Composable () -> Unit,
footer: @Composable () -> Unit,
content: @Composable () -> Unit,
) {
Column(
modifier = modifier,
) {
header()
Box(
modifier = Modifier
.weight(1f)
.fillMaxWidth()
.padding(top = 40.dp),
) {
content()
}
footer()
}
}
@ -146,6 +216,16 @@ private fun PinUnlockHeader(
}
}
@Composable
private fun PinUnlockFooter(
modifier: Modifier = Modifier,
) {
Row(modifier.fillMaxWidth(), horizontalArrangement = Arrangement.SpaceAround) {
TextButton(text = "Use biometric", onClick = { })
TextButton(text = stringResource(id = R.string.screen_app_lock_forgot_pin), onClick = { })
}
}
@Composable
@PreviewsDayNight
internal fun PinUnlockViewPreview(@PreviewParameter(PinUnlockStateProvider::class) state: PinUnlockState) {