Tengo una aplicación que se compone por un login con su registro, y después el resto de pantallas. Normalmente con XML lo que hacía era tener dos activities (o 3 si tenía splash) con sus respectivos fragments.
Una con lo referente al login con el registro donde a lo mejor compartían el mismo background base colocado en el activity y después tenía otro activity que contenía todo lo referente al dashboard de la aplicación y el resto de pantallas.
La finalidad de Compose, o al menos eso he entendido es tener un activity principal y no tener fragmentos, ya que todas las pantallas se pueden montar en funciones composables.
Entonces, después de todo esto, como puedo imitar el mismo escenario de XML en Compose sin usar más de un activity? Actualmente tengo algo así:
@Composable
fun LoginScreen(navController: NavController) {
Box(
modifier = Modifier.fillMaxSize(),
contentAlignment = Alignment.BottomCenter
) {
Image(
painter = painterResource(id = com.isaacdelosreyes.firebaselogincompose.R.drawable.login_background),
contentDescription = "Background del login",
contentScale = ContentScale.Crop,
modifier = Modifier.fillMaxSize()
)
ConstraintLayout() {
val surface = createRef()
Surface(
Modifier
.fillMaxWidth()
.height(370.dp)
.clip(RoundedCornerShape(topStartPercent = 8, topEndPercent = 8))
.constrainAs(surface) {
bottom.linkTo(parent.bottom)
},
color = Color.White
) {
Column(
Modifier.fillMaxSize(),
verticalArrangement = Arrangement.Center
) {
Text(
text = "Iniciar sesión", style = TextStyle(
fontSize = 20.sp,
fontWeight = FontWeight.Bold
), modifier = Modifier.padding(start = 30.dp, top = 20.dp)
)
LoginInput(textLabel = "Usuario", Icons.Default.Email, false)
LoginInput(textLabel = "Contraseña", Icons.Rounded.Lock, true)
LoginButton(
buttonTextValue = "Iniciar sesión",
paddingTopValue = 20.dp,
buttonColor = Green
) {
}
LoginButton(
buttonTextValue = "Registrarme",
paddingTopValue = 5.dp,
buttonColor = Violet
) {
navController.navigate("register")
}
}
}
}
}
}
Donde esta sería mi pantalla de login, con su background de fondo, y después tengo mi pantalla de registro:
@Composable
fun RegisterScreen(navController: NavController) {
Box(
modifier = Modifier.fillMaxSize(),
contentAlignment = Alignment.BottomCenter
) {
Image(
painter = painterResource(id = R.drawable.login_background),
contentDescription = "Background del login",
contentScale = ContentScale.Crop,
modifier = Modifier.fillMaxSize()
)
ConstraintLayout() {
val surface = createRef()
Surface(
Modifier
.fillMaxWidth()
.height(600.dp)
.clip(RoundedCornerShape(topStartPercent = 8, topEndPercent = 8))
.constrainAs(surface) {
bottom.linkTo(parent.bottom)
},
color = Color.White
) {
Column(
Modifier.fillMaxSize(),
verticalArrangement = Arrangement.Center
) {
Text(
text = "Iniciar sesión", style = TextStyle(
fontSize = 20.sp,
fontWeight = FontWeight.Bold
), modifier = Modifier.padding(start = 30.dp, top = 20.dp)
)
LoginInput(textLabel = "Usuario", Icons.Default.Email, false)
LoginInput(textLabel = "Contraseña", Icons.Rounded.Lock, true)
LoginButton(
buttonTextValue = "Registrarme",
paddingTopValue = 5.dp,
buttonColor = Violet
) {
navController.navigate("register")
}
}
}
}
}
}
Podría mover el componente de Image que contiene el background al activity principal ya que de esta forma no lo repito en ambas, pero si uso siempre este activity y creo lo que sería el dashboard donde quiero que ya no tenga este background, ¿qué enfoque puedo darle?