diff --git a/app/src/main/java/es/fpsumma/dam2/intro/MainActivity.kt b/app/src/main/java/es/fpsumma/dam2/intro/MainActivity.kt index 0462544..52118eb 100644 --- a/app/src/main/java/es/fpsumma/dam2/intro/MainActivity.kt +++ b/app/src/main/java/es/fpsumma/dam2/intro/MainActivity.kt @@ -9,6 +9,7 @@ import androidx.compose.material3.Surface import androidx.compose.ui.Modifier import com.ivancorrales.basicjetpackcompose.ui.theme.IntroTheme import es.fpsumma.dam2.intro.ui.screens.CounterScreen +import es.fpsumma.dam2.intro.ui.screens.InputDemoScreen class MainActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { @@ -19,7 +20,8 @@ class MainActivity : ComponentActivity() { modifier = Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background ) { - CounterScreen() + //CounterScreen() + InputDemoScreen() } } } diff --git a/app/src/main/java/es/fpsumma/dam2/intro/ui/screens/CounterScreen.kt b/app/src/main/java/es/fpsumma/dam2/intro/ui/screens/CounterScreen.kt index 404c688..7420892 100644 --- a/app/src/main/java/es/fpsumma/dam2/intro/ui/screens/CounterScreen.kt +++ b/app/src/main/java/es/fpsumma/dam2/intro/ui/screens/CounterScreen.kt @@ -6,50 +6,71 @@ import androidx.compose.material.icons.outlined.Refresh import androidx.compose.material3.* import androidx.compose.runtime.* +import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.res.stringResource import androidx.compose.ui.semantics.contentDescription import androidx.compose.ui.semantics.semantics import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.times +import com.ivancorrales.basicjetpackcompose.ui.theme.IntroTheme +import es.fpsumma.dam2.intro.R @Composable fun CounterScreen() { - var count by remember { mutableStateOf(0) } + var count by rememberSaveable { mutableStateOf(5) } //Hace que el contador inicie en 5 + val buttonWidth = 8.dp Column( - modifier = Modifier - .fillMaxSize() - .padding(24.dp), - horizontalAlignment = Alignment.CenterHorizontally, - verticalArrangement = Arrangement.spacedBy(16.dp) - ) { - Text("Hola mi amig@!", style = MaterialTheme.typography.headlineMedium) - Text("Contador: $count", style = MaterialTheme.typography.titleLarge) - Row(horizontalArrangement = Arrangement.spacedBy(12.dp)) { - Button( - onClick = {}, - modifier = Modifier.semantics { contentDescription = "Incrementar" } - ) { Text("+1") } - - FilledTonalButton( - onClick = {}, - modifier = Modifier.semantics { contentDescription = "Decrementar" } - ) { Text("-1") } - - IconButton( - onClick = {}, - modifier = Modifier.size(48.dp) - ) { - Icon(Icons.Outlined.Refresh, contentDescription = "Reiniciar contador") + modifier = Modifier + .fillMaxSize() + .padding(24.dp), + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.spacedBy(16.dp) + ) { + Text(stringResource(id = R.string.Buenos), style = MaterialTheme.typography.headlineMedium) //Hace que muestre el mensaje que hemos puesto en el fichero res/values/strings.xml usando la funcion stringResource + Text("Contador: $count", style = MaterialTheme.typography.titleLarge) + + Row(horizontalArrangement = Arrangement.spacedBy(12.dp)) { + + Button( + onClick = {count++}, //Hace que el contador se incremente 1 + modifier = Modifier.semantics { contentDescription = "Incrementar" }, + colors = ButtonDefaults.buttonColors( //Hace que el boton del incrementar sea verde + containerColor = Color.Green, + contentColor = Color.White, + ) + ) { + Text("+1") + } + + FilledTonalButton( + onClick = {if (count>0){ // Hace que si el contador es mayor a 0 y pulsas ese boton se decrementa 1 + count-- + }}, + modifier = Modifier.semantics { contentDescription = "Decrementar" } + ) { Text("-1") } + + IconButton( + onClick = {count = 0}, // Hace que si pulsas el Icono del Boton de reiniciar te reinicia el contador a 0 + modifier = Modifier.size(48.dp) + ) { + Icon(Icons.Outlined.Refresh, contentDescription = "Reiniciar contador") + } } + Button( + onClick = {}, + modifier = Modifier.width(count * buttonWidth) //Hace que cuando pulses el boton de incrementar o de decrementar la barra suba o baje + ) { } } } -} @Preview(showBackground = true) @Composable private fun CounterPreview() { - CounterScreen() -} + CounterScreen() +} \ No newline at end of file diff --git a/app/src/main/java/es/fpsumma/dam2/intro/ui/screens/InputDemoScreen.kt b/app/src/main/java/es/fpsumma/dam2/intro/ui/screens/InputDemoScreen.kt index c11ccc9..d96f593 100644 --- a/app/src/main/java/es/fpsumma/dam2/intro/ui/screens/InputDemoScreen.kt +++ b/app/src/main/java/es/fpsumma/dam2/intro/ui/screens/InputDemoScreen.kt @@ -21,15 +21,20 @@ fun InputDemoScreen() { // Calcula el error en función del texto (sin estado extra) Pista -> derivedStateOf // TODO: valida name: no vacío, mínimo 3 caracteres (trim). - val error: String? by remember(name) { + val error: String? by remember(name) { //Sirve para la que el nombre tenga que tener minimo 3 caracteres y que no este vacio derivedStateOf { - null + if (name.trim().isEmpty()) { + "El nombre no puede estar vacío"; + }else if (name.trim().length < 3) { + "El nombre no debe tener menos de 3 caracteres"; + } + else null } } fun submit() { if (error == null) { - greeting = "Hola, 👋" + greeting = "Hola, ${name.trim()}👋" // $name hace que muestre el nombre que insertes por pantalla se muestre focusManager.clearFocus() } } @@ -49,7 +54,8 @@ fun InputDemoScreen() { Spacer(Modifier.height(16.dp)) Button( onClick = { submit() }, - modifier = Modifier.fillMaxWidth() + modifier = Modifier.fillMaxWidth(), + enabled = error === null && name.trim().isNotBlank() ) { Text("Saludar") } diff --git a/app/src/main/java/es/fpsumma/dam2/intro/ui/theme/Theme.kt b/app/src/main/java/es/fpsumma/dam2/intro/ui/theme/Theme.kt index cb6c5d5..6157dfa 100644 --- a/app/src/main/java/es/fpsumma/dam2/intro/ui/theme/Theme.kt +++ b/app/src/main/java/es/fpsumma/dam2/intro/ui/theme/Theme.kt @@ -28,8 +28,8 @@ private val LightColorScheme = lightColorScheme( @Composable fun IntroTheme( - darkTheme: Boolean = false, - dynamicColor: Boolean = true, + darkTheme: Boolean = true, //Hace que el color de la pantalla sea modo oscuro + dynamicColor: Boolean = false, //Hace que el color de la pantalla sea modo oscuro content: @Composable () -> Unit ) { val colorScheme = when { diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml index 656572b..423691e 100644 --- a/app/src/main/res/values/strings.xml +++ b/app/src/main/res/values/strings.xml @@ -1,3 +1,5 @@ Intro - \ No newline at end of file + Hola mi amig@! + Buenos dias + \ No newline at end of file