Comunicación entre actividades

Hasta el momento hemos hecho apps de una única actividad (Activity) cada una. La mayoría de aplicaciones que hemos visto tienen mas de una actividad. Por ejemplo, las apps de correos te muestran en una actividad la lista de correos, pero cuando pulsas en uno de ellos salta a otra actividad en la que te muestra todo el contenido de dicho correo. La primera actividad le pasó la información sobre el correo que seleccionaste a la segunda, y ésta ya se encargó de mostrarlo entero. Pues vamos a ver – de un modo muy simple – cómo hacer precisamente éso.

Voy a ir un poco mas deprisa, puesto que ya hemos hecho unas apps y sabemos cómo crear la mayoría de cosas. El nuevo proyecto se llama DosActividades, la actividad a crear vuelve a ser Principal y el paquete en el que se guarda será com.alberovalley.dosActividades. El target sigue siendo el 2.2.

Esta app va a mostrar en su actividad principal un TextView con el texto Elije un color. Bajo él, un RadioGroup – un conjunto de opciones RadioButton – con tres opciones, llamadas Azul, Rojo y Verde. Bajo el RadioGroup habrá un botón con el texto Envia Color. Cuando se pulse el botón se debe averiguar qué opción se pulsó y enviar la información a la segunda actividad, que llamaremos Secundario.java y que heredará (extends) de Activity. En esta actividad se mostrará un layout con un TextView cuyo mensaje será El fondo de esta pantalla muestra el color elegido. La actividad deberá recoger la información del RadioButton elegido y, en función de cuál fuera, cambiar el color del fondo del Layout. Si no se hubiera elegido ningún color, se deberá controlar y aparecerá un mensaje emergente que diga No se eligió color alguno.

Los colores se guardarán en el fichero /res/values/colors.xml y todos los mensajes irán en el /res/values/strings.xml. Reutilizaremos el layout main.xml y crearemos otro llamado secundario.xml. A continuación, el aspecto final de los ficheros xml.
strings.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="elije_color">Elije un color</string>
<string name="app_name">DosActividades</string>
<string name="color_rojo">Rojo</string>
<string name="color_azul">Azul</string>
<string name="color_verde">Verde</string>
<string name="boton">Enviar color</string>
<string name="color_elegido">El fondo de esta pantalla muestra el color elegido</string>
<string name="mensaje_error">No se eligió color alguno</string>
</resources>

colors.xml: Los tres colores que necesitaremos. Usaremos sus versiones “puras”, las que tienen su color al máximo y los otros al mínimo (recordemos que cada color se define como la composición de los tres colores primarios RGB).

<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="rojo">#FF0000</color>
<color name="azul">#0000FF</color>
<color name="verde">#00ff00</color>

</resources>

main.xml: Introducimos atributos que modifican el texto en tamaño, estilo y posición (gravity indica cómo debe comportarse el texto dentro del espacio que el TextView le ofrece, en este caso lo centra horizontalmente) y el RadioGroup, que contendrá tantos elementos RadioButton como opciones queramos. Debemos darle un ID a cada RadioButton para luego saber cuál de las opciones fue la elegida.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:text="@string/elije_color"
android:gravity="center_horizontal"
android:textSize="20sp"
android:textStyle="bold"
android:layout_margin="10dp"
android:layout_height="wrap_content"/>

<RadioGroup android:id="@+id/gruporb"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<RadioButton android:id="@+id/radio1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/color_azul" />
<RadioButton android:id="@+id/radio2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/color_rojo" />
<RadioButton android:id="@+id/radio3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/color_verde" />
</RadioGroup>
<Button android:id="@+id/boton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/boton"
/>
</LinearLayout>
 

secundario.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/fondo_secundario"
>
<TextView
android:id="@+id/mensaje_color"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="40dp"
android:text="@string/color_elegido"/>
</LinearLayout>

Empezaremos a ver el código de Principal.java:

public class Principal extends Activity implements OnClickListener {

	private RadioGroup rg;
	private Button boton;

	@Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        rg = (RadioGroup)findViewById(R.id.gruporb);

        boton = (Button) findViewById(R.id.boton);
        boton.setOnClickListener(this);

    }

	public void onClick(View v) {
		if (v.getId()==R.id.boton){
			int opcion = rg.getCheckedRadioButtonId();//el id de la opción marcada
			Log.d("2act", "opcion " + opcion);
			if(opcion > 0){
				Intent intent = new Intent(this, Secundario.class);
				intent.putExtra(Constantes.OPCION_ELEGIDA, opcion);//introduce un extra
				startActivity(intent); //inicia la actividad, enviando el extra
			}else{
				Toast t = new Toast(this);
                       		t.setText(R.string.mensaje_error);
        	        	t.setDuration(Toast.LENGTH_LONG);
                		t.show();
			}
		}

	}
}

En el método onCreate sólo tenemos que asignar el botón y el RadioGroup. No es necesario asignar cada uno de los RadioButton. Por supuesto, hay que darle al botón su Listener para el evento onClick.

En el método onClick, confirmamos que el elemento clickado sea el botón. Una vez seguros de ello, inicializamos la variable entera opcion con el valor que nos devuelva getCheckedRadioButtonId(), que nos indicará cuál de las opciones está marcada. Si no hay ninguna marcada, devuelve -1. Si hay alguna opción marcada (o sea, si el valor de opcion no es -1), instanciaremos un Intent que apunte a la otra actividad, Secundario.class, y con el método putExtra le metemos el valor de opcion. Tras ello, con el método startActivity y pasándole el intent al que le hemos metido el valor de opción señalada, iniciará la actividad Segundo.java.
Si no se hubiera marcado ninguna opción (el valor de opcion sería -1) creamos un mensaje emergente con la clase Toast, indicándole el texto a mostrar y la opción de duración larga, y lo mostramos con el método show().

Como para pasar variables entre actividades a través de los Intent hay que darle una clave de tipo String a cda variable para poder distinguirla en la actividad destino, usaremos una constante que guardaremos en una Interfaz aparte que llamaremos Constantes.java.

public interface Constantes {
	public static final String OPCION_ELEGIDA ="opcion_elegida";
}

Vamos con el código de la otra actividad, Segundo.java:

public class Secundario extends Activity {

	LinearLayout lay;

	public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.secundario);

        lay = (LinearLayout)findViewById(R.id.fondo_secundario);

        int opcionColor = getIntent().getIntExtra(Constantes.OPCION_ELEGIDA, -1);
        switch(opcionColor){
        	case R.id.radio1 :
        		lay.setBackgroundColor(getResources().getColor(R.color.azul));
        		break;
        	case R.id.radio2:
        		lay.setBackgroundColor(getResources().getColor(R.color.rojo));
        		break;
        	case R.id.radio3:
        		lay.setBackgroundColor(getResources().getColor(R.color.verde));
        		break;

        }

    }

}

En este caso sólo tenemos que asignar el LinearLayout para poder cambiarle el color según la opción elegida. El valor de la opción lo recuperamos sacándolo del Intent con getIntent().getIntExtra, dándole la clave de la variable y el valor por defecto (por si acaso no se hubiera pasado la variable, daría este valor).
Luego, en función de la opción seleccionada (que compararemos con los ID de los RadioButton), usamos el método setBackgroundColor para realizar el cambio. El argumento de este método lo obtenemos con getResources().getColor(ID_del_color).

Cuando tenemos listo todo esto, ejecutamos el proyecto. Saldrá la primera pantalla:
Principal
Elegimos un color y pulsamos el botón. Pero en vez de salirnos la pantalla de Secundario, nos sale un error. Toca ir al LogCat a buscar qué pasa.

05-09 17:21:00.782: ERROR/AndroidRuntime(498): android.content.ActivityNotFoundException: Unable to find explicit activity class {com.alberovalley.dosActividades/com.alberovalley.dosActividades.Secundario}; have you declared this activity in your AndroidManifest.xml?

Nos está diciendo que NO hemos declarado la actividad en el fichero AndroidManifest.xml, así que vamos a ello. Este fichero xml tiene varias pestañas de interfaz gráfica. Podemos registrar nuestra nueva actividad en Application o hacerlo a mano.

A mano:

<!--?xml version="1.0" encoding="utf-8"?-->

Hay que introducir el código dentro de la etiqueta
A través de la interfaz, en la pestaña Application vamos a la parte inferior, al botón Add, elegimos Activity y saldrá a la derecha un formulario para registrar la actividad:Registrar Actividad

Por ahora bastará con que pongamos el nombre de la actividad en el campo Name y dejemos el resto tal cual. Guardamos cambios y aparecerá en la lista de la izquierda:
lista de actividades registradas

Ahora volvemos a ejecutar el proyecto, y esta vez al pulsar el botón tras elegir un color, nos aparecerá la pantalla de Secundario, que mostrará el color que elegimos en la actividad Principal:
secundario

El código completo de esta app puede encontrarse en el repositorio correspondiente de github

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: