Fix alignment issue and content cropping
This commit is contained in:
parent
72050b2a59
commit
c00da8ee1e
1 changed files with 34 additions and 29 deletions
|
|
@ -18,9 +18,10 @@ package io.element.android.features.onboarding.impl
|
||||||
|
|
||||||
import androidx.compose.foundation.Image
|
import androidx.compose.foundation.Image
|
||||||
import androidx.compose.foundation.layout.Arrangement
|
import androidx.compose.foundation.layout.Arrangement
|
||||||
|
import androidx.compose.foundation.layout.Box
|
||||||
import androidx.compose.foundation.layout.Column
|
import androidx.compose.foundation.layout.Column
|
||||||
import androidx.compose.foundation.layout.ColumnScope
|
|
||||||
import androidx.compose.foundation.layout.Spacer
|
import androidx.compose.foundation.layout.Spacer
|
||||||
|
import androidx.compose.foundation.layout.fillMaxSize
|
||||||
import androidx.compose.foundation.layout.fillMaxWidth
|
import androidx.compose.foundation.layout.fillMaxWidth
|
||||||
import androidx.compose.foundation.layout.padding
|
import androidx.compose.foundation.layout.padding
|
||||||
import androidx.compose.foundation.layout.width
|
import androidx.compose.foundation.layout.width
|
||||||
|
|
@ -29,6 +30,7 @@ import androidx.compose.material.icons.filled.QrCode
|
||||||
import androidx.compose.material3.MaterialTheme
|
import androidx.compose.material3.MaterialTheme
|
||||||
import androidx.compose.runtime.Composable
|
import androidx.compose.runtime.Composable
|
||||||
import androidx.compose.ui.Alignment.Companion.CenterHorizontally
|
import androidx.compose.ui.Alignment.Companion.CenterHorizontally
|
||||||
|
import androidx.compose.ui.BiasAlignment
|
||||||
import androidx.compose.ui.Modifier
|
import androidx.compose.ui.Modifier
|
||||||
import androidx.compose.ui.graphics.ColorFilter
|
import androidx.compose.ui.graphics.ColorFilter
|
||||||
import androidx.compose.ui.res.painterResource
|
import androidx.compose.ui.res.painterResource
|
||||||
|
|
@ -69,39 +71,42 @@ fun OnBoardingScreen(
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
) {
|
) {
|
||||||
Column(modifier.fillMaxWidth()) {
|
OnBoardingHeader()
|
||||||
Spacer(modifier = Modifier.weight(2f))
|
|
||||||
OnBoardingHeader()
|
|
||||||
Spacer(modifier = Modifier.weight(3f))
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
private fun ColumnScope.OnBoardingHeader() {
|
private fun OnBoardingHeader(modifier: Modifier = Modifier) {
|
||||||
Column(
|
Box(
|
||||||
modifier = Modifier
|
modifier = modifier.fillMaxSize(),
|
||||||
.weight(3f)
|
contentAlignment = BiasAlignment(
|
||||||
.fillMaxWidth(),
|
horizontalBias = 0f,
|
||||||
horizontalAlignment = CenterHorizontally,
|
verticalBias = -0.2f
|
||||||
|
)
|
||||||
) {
|
) {
|
||||||
Image(
|
Column(
|
||||||
painter = painterResource(id = R.drawable.element_logo),
|
modifier = Modifier
|
||||||
contentDescription = null,
|
.fillMaxWidth(),
|
||||||
)
|
horizontalAlignment = CenterHorizontally,
|
||||||
Image(
|
) {
|
||||||
modifier = Modifier.padding(top = 14.dp),
|
Image(
|
||||||
painter = painterResource(id = R.drawable.element),
|
painter = painterResource(id = R.drawable.element_logo),
|
||||||
colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.primary),
|
contentDescription = null,
|
||||||
contentDescription = null,
|
)
|
||||||
)
|
Image(
|
||||||
Text(
|
modifier = Modifier.padding(top = 14.dp),
|
||||||
modifier = Modifier.padding(top = 24.dp),
|
painter = painterResource(id = R.drawable.element),
|
||||||
text = stringResource(id = R.string.screen_onboarding_subtitle),
|
colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.primary),
|
||||||
color = MaterialTheme.colorScheme.secondary,
|
contentDescription = null,
|
||||||
fontSize = 20.sp,
|
)
|
||||||
textAlign = TextAlign.Center
|
Text(
|
||||||
)
|
modifier = Modifier.padding(top = 24.dp),
|
||||||
|
text = stringResource(id = R.string.screen_onboarding_subtitle),
|
||||||
|
color = MaterialTheme.colorScheme.secondary,
|
||||||
|
fontSize = 20.sp,
|
||||||
|
textAlign = TextAlign.Center
|
||||||
|
)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue