Was ist der beste Weg, um die Benutzeroberfläche in Jetpack Compose responsiv zu gestalten?
Posted: 05 Jan 2025, 15:17
Also ich baue eine App, als Teil davon habe ich viele Composables in der Benutzeroberfläche.
Ein Beispiel-Composbale ist unten angehängt
Das ist für die meisten Telefonbildschirme in Ordnung. Aber natürlich muss ich es reaktionsfähig machen, da dies der beste Weg ist (während ich auf verschiedenen Bildschirmen getestet habe, sind mir Inkonsistenzen aufgefallen ...). Was ist also der beste Weg, um es reaktionsfähig zu machen?
Ein Beispiel-Composbale ist unten angehängt
Code: Select all
@Composable
fun RegisterUserPage(
) {
Box(
modifier = Modifier
.fillMaxSize()
.background(colorResource(id = R.color.white))
) {
Column(
modifier = Modifier
.fillMaxSize()
.background(colorResource(id = R.color.white))
) {
Spacer(modifier = Modifier.height(90.dp))
Text(
text = stringResource(id = R.string.setup_master_password),
fontFamily = montserratFamily,
fontWeight = FontWeight.W800,
fontSize = 30.sp,
color = colorResource(id = R.color.onboarding_welcome),
modifier = Modifier.padding(start = 30.dp)
)
Text(
text = stringResource(id = R.string.setup_master_password_two),
fontFamily = montserratFamily,
fontWeight = FontWeight.W800,
fontSize = 30.sp,
color = colorResource(id = R.color.onboarding_welcome),
modifier = Modifier.padding(start = 30.dp)
)
Spacer(modifier = Modifier.height(10.dp))
Text(
text = stringResource(id = R.string.protect_account),
fontFamily = montserratFamily,
fontWeight = FontWeight.W500,
fontSize = 15.sp,
color = colorResource(id = R.color.onboarding_description_bottom),
modifier = Modifier.padding(start = 30.dp)
)
Text(
text = stringResource(id = R.string.protect_account_two),
fontFamily = montserratFamily,
fontWeight = FontWeight.W500,
fontSize = 15.sp,
color = colorResource(id = R.color.onboarding_description_bottom),
modifier = Modifier.padding(start = 30.dp)
)
Spacer(modifier = Modifier.height(50.dp))
}
Rectangle(
modifier = Modifier
.width(20.dp)
.align(alignment = Alignment.CenterEnd),
fillColor = colorResource(id = R.color.onboarding_green)
)
}
}
- Wir können dynamisch entscheiden, welcher dp basierend auf der Bildschirmgröße sein soll und welcher nicht?
basierend auf der Bildschirmgröße und ich kann die Werte als Floats z. B. 1f, 0,1f usw. anstelle von dp festlegen?