Tercer ejercicio con Android. En este vamos a ver cómo pedir el nombre de un usuario y su edad, para que al presionar un botón se abra otra actividad y le muestre:
- Si es menor de edad: una imagen de un juguete (con un mensaje de que todavía no está preparado)
- Si es mayor de edad: una imagen de un auto
En ambos casos el mensaje debe contener el nombre del usuario.
Repositorio en GitHub
El código completo lo puedes encontrar en mi perfil de GitHub.
Agregar imágenes
Me he descargado unas imágenes de Pixabay (por cosas como esa página es que uno confía en el mundo); una de un juguete y otra de un auto.
Para poder tener una referencia a ellas las ponemos en la carpeta drawable dentro de res. En mi caso se ve así:
La ruta absoluta es nombreDelProyecto/app/src/main/res/drawable
.
Dentro del código vamos a acceder a ellas con R.drawable.nombre_imagen
.
Diseñar layout principal
Antes de continuar, vamos a ver el layout principal. Este pide el nombre del usuario y su edad, con un botón para mostrar la segunda actividad. El XML, que es un ConstraintLayout, queda así:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<EditText
android:id="@+id/editText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:ems="10"
android:hint="Nombre"
android:inputType="textPersonName"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<EditText
android:id="@+id/editText2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:ems="10"
android:hint="Edad"
android:inputType="number"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText" />
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:text="Entrar"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/editText2" />
</android.support.constraint.ConstraintLayout>
Tenemos dos EditText con un Button.
Programar actividad con Java
Desde Java vamos a obtener los valores que el usuario ha escrito y los vamos a enviar a una segunda actividad. La comprobación para saber si es mayor de edad y la configuración de la imagen la vamos a ver en la otra actividad.
Por el momento el código queda así:
package me.parzibyte.imagenesmayordeedad;
import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Obtener referencias
final EditText editTextNombre = findViewById(R.id.editText),
editTextEdad = findViewById(R.id.editText2);
Button botonEntrar = findViewById(R.id.button);
// Ahora escuchamos el click del botón
botonEntrar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// Obtener nombre y edad como texto
String nombre = editTextNombre.getText().toString(),
edadComoString = editTextEdad.getText().toString();
// Si están vacíos detenemos la ejecución de este código
if (nombre.isEmpty() || edadComoString.isEmpty()) return;
// Si no, entonces vamos a convertir la edad a entero
int edad = Integer.parseInt(edadComoString);
// Ahora vamos a mandar esos datos que tenemos a la otra actividad
Intent intent = new Intent(MainActivity.this, Actividad2.class);
// Le agregamos el nombre
intent.putExtra("nombre", nombre);
//La edad también
intent.putExtra("edad", edad);
// Lo iniciamos y nos vemos en Actividad2
startActivity(intent);
}
});
}
}
La Actividad2 todavía no existe, en un momento la vamos a crear. Únicamente estamos recuperando los valores, haciendo una “validación” y en caso de que todo vaya bien pasamos los valores a la otra actividad.
El diseño de la segunda actividad
La segunda actividad tendrá un ImageView con un TextView. He agregado al ConstraintLayout una guía horizontal del 50 % para que la imagen siempre quede fija a la mitad de la pantalla y no ocasione que el texto se baje demasiado.
El diseño queda así:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Actividad2">
<ImageView
android:id="@+id/imageView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="8dp"
app:layout_constraintBottom_toTopOf="@+id/guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:text="TextView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/imageView" />
<android.support.constraint.Guideline
android:id="@+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.5" />
</android.support.constraint.ConstraintLayout>
El id del TextView es textView y el de la ImageView es imageView; qué creativo soy.
No definimos la fuente de la imagen ni el texto en el XML porque eso lo vamos a hacer desde Java.
Código de la segunda actividad
En la segunda actividad recuperamos los datos enviados desde la MainActivity (el nombre con la edad) y hacemos la comparación. Al menos en México la mayoría de edad es de 18 años, así que hacemos el if
con ello.
Para ponerle la fuente al ImageView usamos setImageResource
, y le pasamos un entero que viene de la clase pública estática R
.
En resumen, ponemos R.drawable.nombre_imagen
El mensaje lo armamos igualmente dentro de la comprobación.
package me.parzibyte.imagenesmayordeedad;
import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.ImageView;
import android.widget.TextView;
public class Actividad2 extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_actividad2);
// Obtener referencias al ImageView y al TextView
TextView textView = findViewById(R.id.textView);
ImageView imageView = findViewById(R.id.imageView);
// Obtener el intent que se nos fue enviado
Intent intent = getIntent();
// Recuperar los datos. Recuerda que el segundo argumento es el valor por defecto
// en caso de que no exista un dato con la clave solicitada
int edad = intent.getIntExtra("edad", 0);
// Ahora el nombre, ese es una cadena
String nombre = intent.getStringExtra("nombre");
// Hacer la comprobación
if (edad >= 18) {
// Es mayor de edad, así que ponemos un mensaje de "Bienvenido"
String mensaje = "Bienvenido, " + nombre;
textView.setText(mensaje);
// Al ImageView le ponemos el auto
imageView.setImageResource(R.drawable.auto);
} else {
// Si no, un mensaje de "no permitido"
String mensaje = "No puedes ver el contenido, " + nombre;
textView.setText(mensaje);
// Y le ponemos la imagen del juguete
imageView.setImageResource(R.drawable.juguete);
}
}
}
Así de simple y sencillo.