Soluciones Móviles I

LABORATORIO 1
“Activities”
I. MARCO TEORICO

La experiencia con la app para dispositivos móviles difiere de la versión de escritorio, ya que la
interacción del usuario con la app no siempre comienza en el mismo lugar. En este caso, no hay
un lugar específico desde donde el usuario comienza su actividad. Por ejemplo, si abres una
app de correo electrónico desde la pantalla principal, es posible que veas una lista de correos
electrónicos. Por el contrario, si usas una app de redes sociales que luego inicia tu app de
correo electrónico, es posible que accedas directamente a la pantalla de la app de correo
electrónico para redactar uno.

La clase Activity está diseñada para facilitar este paradigma. Cuando una app invoca a otra, la
app que realiza la llamada invoca una actividad en la otra, en lugar de a la app en sí. De esta
manera, la actividad sirve como el punto de entrada para la interacción de una app con el
usuario. Implementas una actividad como una subclase de la clase Activity.

Una actividad proporciona la ventana en la que la app dibuja su IU. Por lo general, esta ventana
llena la pantalla, pero puede ser más pequeña y flotar sobre otras ventanas. Generalmente, una
actividad implementa una pantalla en una app. Por ejemplo, una actividad de una app puede
implementar una pantalla Preferencias mientras otra implementa una pantalla Seleccionar foto.

La mayoría de las apps contienen varias pantallas, lo cual significa que incluyen varias
actividades. Por lo general, una actividad en una app se especifica como la actividad principal,
que es la primera pantalla que aparece cuando el usuario inicia la app. Luego, cada actividad
puede iniciar otra actividad a fin de realizar diferentes acciones. Por ejemplo, la actividad
principal de una app de correo electrónico simple podría proporcionar una pantalla en la que se
muestra una casilla de correo electrónico. A partir de aquí, la actividad principal podría iniciar
otras actividades que proporcionan pantallas para tareas como redactar correos y abrir correos
electrónicos individuales.

Si bien las actividades trabajan en conjunto a fin de crear una experiencia del usuario coherente
en una app, cada actividad se relaciona vagamente con otras actividades; por lo general, hay
una pequeña cantidad de dependencias entre las actividades de una app. De hecho, estas
suelen iniciar actividades que pertenecen a otras apps. Por ejemplo, una app de navegador
podría iniciar la acción de "Compartir actividad" de una app de redes sociales.

1
 Soluciones Móviles I

Ciclo de vida de una actividad

II. DESARROLLO

En esta parte vamos a observar cómo se despliega una aplicación, cómo funcionan los métodos
“callback” y cómo se comunican las Actividades en Android.

1. Inicie un Nuevo Proyecto (Empty Activity) en Android Studio llamado LabActividad.

2. Como ya se ha explicado, se procederá a dar revisión a los métodos Callback de Android.
3. Agregue el siguiente código en el fichero MainActivity.java

package com.example.labactividad;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

Toast.makeText(getBaseContext(),"onCreate()",Toast.LENGTH_SHORT).show();
}

@Override
protected void onStart(){
super.onStart();
Toast.makeText(getBaseContext(),"onStart()",Toast.LENGTH_SHORT)
.show();
}
2
Soluciones Móviles I

@Override
protected void onResume() {
super.onResume();
Toast.makeText(getBaseContext(),"onResume()",Toast.LENGTH_SHORT)
.show();
}

@Override
protected void onPause(){
super.onPause();
Toast.makeText(getBaseContext(),"onPause()",Toast.LENGTH_SHORT)
.show();
}

@Override
protected void onStop(){
super.onStop();
Toast.makeText(getBaseContext(),"onStop()",Toast.LENGTH_SHORT)
.show();
}

@Override
protected void onRestart(){
super.onRestart();
Toast.makeText(getBaseContext(),"onRestart()",Toast.LENGTH_SHORT)
.show();
}
}

4. Proceda a compilar la aplicación y observe el resultado.

CREAR UNA NUEVA ACTIVIDAD DE MODO MANUAL

5. Ahora se creará un fichero xml que será el marco (Layout), de nuestra opción creada, el
fichero se llamará acercade.xml y se creará en la carpeta de Layouts de la aplicación.
6. Cambie al modo de texto y cambie el contenido de modo tal que el código sea el siguiente:

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

<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/TextView01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Este programa ha sido desarrollado como
ejemplo en la asignatura de Soluciones Móviles para
demostrar cómo se pueden lanzar nuevas actividades
desde la actividad principal.">
</TextView>

3
Soluciones Móviles I

7. Ahora es necesario crear una Clase que será la responsable de dar el comportamiento al
Layout generado anteriormente, para esto cree la Clase AcercaDeActivity, la cual heredará de
la Clase Activity, y que se asociará con el layout acercade.xml.

package com.example.labactividad;

import android.app.Activity;
import android.os.Bundle;

public class AcercaDeActivity extends Activity {

@Override
public void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.acercade);
}
}
8. Ahora para llamar a la actividad creada, es necesario crear un botón, con el cual se pueda
desencadenar una acción.
9. En la actividad principal, precisamente en el fichero activity_main.xml, agregue un botón, de
modo tal que quede el siguiente código en el fichero.

<?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">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:text="Hello World!"
app:layout_constraintBottom_toTopOf="@+id/button"
app:layout_constraintHorizontal_bias="0.485"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.375" />

<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
4
Soluciones Móviles I

android:layout_marginBottom="216dp"
android:text="Acerca de ..."
android:onClick="acercaDe"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent" />

</android.support.constraint.ConstraintLayout>

10. Ahora se procederá a crear el método citado en la propiedad onClick del botón.

public class MainActivity extends AppCompatActivity {

public void acercaDe(View view){

Intent intent = new Intent(this,AcercaDeActivity.class);
startActivity(intent);
}

11. Compile la aplicación y observe el resultado.

12. Para poder continuar, y que se observe el resultado esperado, es necesario tener en
cuenta el Manifiesto de la aplicación, el cual se encuentra en el fichero
AndroidManifest.xml, en el que se registran todos los componentes internos de la
aplicación.

<activity android:name=".AcercaDeActivity"
android:label="Acerca de..."/>

13. Ejecuta la aplicación y observa el resultado al momento de pulsar el botón “Acerca de…”.
14. El resultado es adecuado, pero dista mucho de lo que probablemente vendría a ser un
Diálogo de información, así que vamos a agregar una propiedad en el manifiesto de modo tal
que se cambie el comportamiento de la actividad AcercaDe.

<activity android:name=".AcercaDeActivity"
android:label="Acerca de..."
android:theme="@style/Theme.AppCompat.DayNight.Dialog"/>/>

15. Ahora con el nuevo cambio, compile la aplicación y observe el cambio.

COMUNICACIÓN ENTRE ACTIVIDADES

5
Soluciones Móviles I

16. Para esta parte del Laboratorio, deberá crear una nueva aplicación, el nombre podría ser
LabComunicacion.
17. En el fichero activity_main.xml, proceda a crear un formulario, que contenga una caja de texto
y un botón, lo que servirán para enviar un mensaje de una actividad a otra.
18. El fichero quedará de la siguiente forma:

<?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_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:hint="Ingrese su nombre"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.122"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.139" />

<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:text="Saludar"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.476"
app:layout_constraintStart_toEndOf="@+id/editText"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.124" />
</android.support.constraint.ConstraintLayout>

19. Ahora en el método onCreate de la Clase MainActivity, se escribirá código que permita utilizar
el botón Saludar, esto se realizará implementando una interface “OnClick”.

6
Soluciones Móviles I

package com.example.labcomunicacion;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

Button saludar = (Button)findViewById(R.id.button);

saludar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(getBaseContext(),"Aquí debería llamar a la
nueva actividad",Toast.LENGTH_SHORT).show();
}
});

}
}

20. Como puede ver, se ha colocado un mensaje, puesto que aún no se ha construido la nueva
actividad.
21. En la ventana del Proyecto, haga click derecho en el folder app y seleccione
New>Activity>Empty Activity, como nombre de la actividad, coloque MostrarSaludoActivity.

22. Ahora sí se dispone

de una actividad

7
Soluciones Móviles I

que recibirá el saludo, por lo que deberá modificar el evento “onClick” en la Clase MainActivity,
en el que se dejó un simple mensaje.

saludar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {

Intent intent = new

Intent(getApplicationContext(),MostrarSaludoActivity.class);
EditText editText = (EditText)findViewById(R.id.editText);

String nombre = editText.getText().toString();

intent.putExtra(EXTRA_MESSAGE,nombre);
startActivity(intent);
}
});

23. Ahora vamos modificar activity_mostrar_saludo.xml

<?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=".MostrarSaludoActivity"
android:id="@+id/mostrarSaludo">

</android.support.constraint.ConstraintLayout>

24. Con ese código ya se ha empaquetado el mensaje escrito, que sería un nombre, ahora en la
clase MostrarSaludoActivity, se deberá recibir el extra enviado e interpretarlo para mostrar el
saludo.

public class MostrarSaludoActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_mostrar_saludo);

Intent intent = getIntent();

String saludo= "Buenas noches" + ((Intent)
intent).getStringExtra(MainActivity.EXTRA_STRING);
8
Soluciones Móviles I

TextView textView = new TextView( this);

textView.setText(saludo);
textView.setTextSize(40);

ViewGroup viewGroup = (ViewGroup)findViewById(R.id.mostrarSaludo);

viewGroup.addView(textView);
}
}

25. Con ese código, se creará de forma dinámica el componente TextView que mostrará el saludo
para el nombre ingresado. Para comprobar compile y observe el resultado.

Puede clonar el Repositorio de esta solución en: https://github.com/aljofloro/Actividades

PRÁCTICA CALIFICADA

Deseas comprar videojuegos en la tienda de la ciudad, en la que todos los juegos cuestan el
mismo valor. Se sabe que para el próximo mes habrá una oferta que te permitirá adquirir
juegos a precios con rebaja, específicamente vendría de la siguiente manera, el primer juego
costará p soles, y cada juego subsecuente costará d soles menos que el anterior. Esto
continúa hasta que el costo sea menor que o igual a m soles, luego de lo cual cada juego
costará m soles. Por este motivo, se plantea elaborar una aplicación que durante esa época
de oferta, me permita saber cuántos juegos pueda comprar.

Ejemplo:
Primer juego = 20
D segundo juego = 3
m=6
s = 70
El siguiente sería el costo de los primeros 10 juegos: 20, 17, 14, 11, 8, 6, 6, 6, 6, 6. Ahora,
teniendo en cuenta que el presupuesto es de s = 70, podrías comprar únicamente 5 juegos:
20 + 17 + 14 + 11 + 8 = 70.