PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
INSTITUTO TECNICO SUPERIOR DE COMERCIO “INSCO”
CARRERA DE SISTEMAS INFORMATICOS
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
SEGUNDO AÑO
ÁREA DE CONOCIMIENTO
ASIGNATURA: PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
programación
Docente: Ing. Humberto Aguilar Lobo LABORATORIO 19
Calificación:
Estudiante: Teoría Practica
LABORATORIO 19.
(Pasar de un Activity a otra)
1. INTRODUCCIÓN.
Para navegar a través de las distintas pantallas que puede tener una aplicación, es necesario
iniciar una nueva Activity en cada ocasión. Es decir que, por cada cambio de pantalla dentro de
la aplicación, se debe lanzar o iniciar una nueva Activity, de lo contrario, el cambio de pantalla no
se realizará.
Para lograr este objetivo, es necesario recurrir a un objeto del tipo “Intent”,
¿Qué es una Intent?
Una Intent, es un objeto de acción que se puede usar para solicitar una acción de otro
componente de la aplicación. El “Intent” representa la “intención de hacer algo” de una App.
Para crear un “Intent”, se crea un objeto de ese mismo nombre, es decir:
Intent i = new Intent ();
Y se le asigna 2 parámetros:
1
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
• El 1ro es el Activity donde uno se encuentra.
• El 2do parámetro, es a donde se quiere ir.
Finalmente se tiene que hacer uso del método “starActivity”, colocando dentro del paréntesis el
nombre del objeto, el cual nos permitirá realizar el cambio de pantalla, es decir:
Intent i = new Intent (this, Activity2.class);
startActivity(i);
EJERCICIO RESUELTO.
Para la construcción de la aplicación, se utilizará un NUEVO PROYECTO en Android Studio, que
se creará con el nombre de “Pasar_Activity-A-Otra”, y se tendrá:
Recuerde que, para un diseño más adecuado de una aplicación resulta imprescindible definir
algunos términos de forma más precisa, y hay dos aspectos que resultan fundamentales:
• Diseño gráfico: Es la parte grafica (diseño de la interfaz) de la aplicación.
• Diseño Lógico: Es la parte lógica (programación) en la cual se utiliza distintos
algoritmos para que la aplicación cumpla con su objetivo general.
1. MODO DISEÑO DE LA 1ra “ACTIVITY”.
Primeramente, se elimina el texto que ha sido creado por defecto en el centro de la aplicación,
(“Hello Word!”), utilizando el botón (SUPRIMIR - DELETE).
Y a continuación, se realiza el diseño de la aplicación, utilizando diferentes componentes y
atributos, bajo las siguientes características:
2
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
TIPO NOMBRE
CANT COMPONENTE ATRIBUTOS
COMPONENTE ID
text: INGRESE MEDIANTE RECURSOS
1 Text TextView DE CADENA(strings.xml) textView2
(ID por defecto)
text size: 24 sp
text: INGRESE MEDIANTE RECURSOS
1 Buttons Button DE CADENA(strings.xml) button
(ID por defecto)
text size: 24 sp
2. MODO BLUEPRINT DE LA 1ra “ACTIVITY”.
A continuación, se asigna las distancias que debe de mantener cada control (Componentes),
respecto a los bordes de la Activity.
Recuerde que en el modo blueprint se puede ver la "radiografía" de nuestro proyecto, y en el
cual se debe asignar las distancias de todos los componentes de la aplicación, para que no haya
una superposición (un componente encima de otro) en el momento de la ejecución de la
aplicación. Una vez realizada las asignaciones de las distancias de todos los componentes,
respecto a los bordes del Activity, se tendrá:
3. ADVERTENCIAS DE LA 1ra “ACTIVITY”.
Las aplicaciones desarrolladas en Android Studio, tienen advertencias, que en realidad son
sugerencias que realiza Android para que los desarrolladores no utilicen “texto directo” dentro de
los componentes de manera vertical.
Las advertencias de la aplicación, son las siguientes (Cuadros marcados):
3
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
A continuación, para poder solucionar las advertencias, se realiza el INGRESO DE TEXTO
MEDIANTE RECURSOS DE CADENA (strings.xml), para de cada uno de los componentes, para
poder realizar este procedimiento se debe realizar los siguientes pasos:
PASO 1. Se ingresa a la siguiente dirección de raíz del proyecto: “app/res/values/strings.xml”
En este apartado, se debe crear ETIQUETAS XML, para cada una de las ADVERTENCIAS de la
aplicación (que son el resultado del ingreso manual de las etiquetas de texto).
4
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
Recuerde, que se tiene que crear referencias del tipo “@strings”, las cuales se ingresan de la
siguiente manera.
LA CODIFICACIÓN que se tiene que realizar, VIENE DE LA SIGUIENTE MANERA:
<resources>
<string name="app_name">Pasar_Activity-A-Otra</string>
<string name="tv1">Primer Activity</string>
Parte del <string name="Buton">SIGUIENTE</string>
código que ya </resources> Colocar el TEXTO que se
viene creada Asignar un nombre cualquiera, que quiere que aparezca en cada
de manera represente al componente de la parte uno de los componentes
directa grafica
Una vez realizado el procedimiento, el código quedara de la siguiente manera:
A continuación, debemos de realizar el enlace de cada uno de nuestros STRINGS en la parte
gráfica, para cada uno de nuestros componentes.
Se lo debe realizar la conexión, utilizando las teclas:
“CTRL + ESPACIO”
Una vez utilizado la combinación de teclas “CTRL+ESPACIO”, se puede observar, que se nos
despliega todas las líneas que se escribió en XML en el apartado “strings.xml”
5
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
Este proceso se lo tiene que realizar para cada una de los componentes creados, y en este caso,
todos los componentes referenciados que se tiene, lo que quedaría de la siguiente manera:
Una vez ingresado nuestras referencias, se puede que observar nuestras ADVERTENCIAS,
desaparecieron de nuestra aplicación:
6
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
A continuación, se debe de crear el 2do Activity de la aplicación:
CREACIÓN DE LA 2DO ACTIVITY.
Para crear un 2do “Activity”, se debe de ir a la siguiente ruta de raíz;
“App(Clic derecho)/New/Activity/Empty Activity”
Es decir:
7
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
Una vez hecho eso, se desplegará una nueva ventana, es decir:
Y como te puedes dar cuenta, es muy similar a la ventana que aparece al momento de la
creación de un nuevo proyecto. Aca se debe de asignar el nombre de la segunda Activity, se
colocará el nombre de “SegundoActivity”
Una vez que realiza ese procedimiento, se puede ver que se crea:
UNA PARTE GRÁFICA Y UNA PARTE LÓGICA (NUEVAS).
8
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
4. MODO DISEÑO DE LA 2da “ACTIVITY”.
Al igual que la primera “Activity”, en esta segunda se realiza el diseño de la “Activity”, utilizando
diferentes componentes y atributos, bajo las siguientes características:
TIPO NOMBRE
CANT COMPONENTE ATRIBUTOS
COMPONENTE ID
text: INGRESE MEDIANTE RECURSOS
1 Text TextView DE CADENA(strings.xml) TextView
(ID por defecto)
text size: 24 sp
text: INGRESE MEDIANTE RECURSOS
1 Buttons Button DE CADENA(strings.xml) button2
(ID por defecto)
text size: 24 sp
5. MODO BLUEPRINT DE LA 2da “ACTIVITY”.
A continuación, se asigna las distancias que debe de mantener cada control (Componentes),
respecto a los bordes de la Activity.
Recuerde que en el modo blueprint se puede ver la "radiografía" de nuestro proyecto, y en el
cual se debe asignar las distancias de todos los componentes de la aplicación, para que no haya
una superposición (un componente encima de otro) en el momento de la ejecución de la
aplicación. Una vez realizada las asignaciones de las distancias de todos los componentes,
respecto a los bordes del Activity, se tendrá:
9
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
6. ADVERTENCIAS DE LA 2da “ACTIVITY”.
Las aplicaciones desarrolladas en Android Studio, tienen advertencias, que en realidad son
sugerencias que realiza Android para que los desarrolladores no utilicen “texto directo” dentro de
los componentes de manera vertical.
Las advertencias de la aplicación, son las siguientes (Cuadros marcados):
A continuación, para poder solucionar las advertencias, se realiza el INGRESO DE TEXTO
MEDIANTE RECURSOS DE CADENA (strings.xml), para de cada uno de los componentes, para
10
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
poder realizar este procedimiento se debe realizar los siguientes pasos:
PASO 1. Se ingresa a la siguiente dirección de raíz del proyecto: “app/res/values/strings.xml”
En este apartado, se debe crear ETIQUETAS XML, para cada una de las ADVERTENCIAS de la
aplicación (que son el resultado del ingreso manual de las etiquetas de texto).
Recuerde, que se tiene que crear referencias del tipo “@strings”, las cuales se ingresan de la
siguiente manera.
LA CODIFICACIÓN que se tiene que realizar, VIENE DE LA SIGUIENTE MANERA, DEBAJO
DE LAS QUE YA SE CREO EN LA 1ER “ACTIVITY”:
<resources>
<string name="app_name">Pasar_Activity-A-Otra</string>
<string name="tv1">Primer Activity</string>
Parte del <string name="Buton">SIGUIENTE</string>
código que ya Colocar el TEXTO que se
viene creada <string name="tv2">Segundo Activity</string> quiere que aparezca en cada
de manera uno de los componentes
directa
<string name="Buton2">ANTERIOR</string>
</resources>
Asignar un nombre cualquiera, que
represente al componente de la parte
grafica
Una vez realizado el procedimiento, el código quedara de la siguiente manera:
11
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
A continuación, debemos de realizar el enlace de cada uno de nuestros STRINGS en la parte
gráfica, para cada uno de nuestros componentes.
Se lo debe realizar la conexión, utilizando las teclas:
“CTRL + ESPACIO”
Una vez utilizado la combinación de teclas “CTRL+ESPACIO”, se puede observar, que se nos
despliega todas las líneas que se escribió en XML en el apartado “strings.xml”
12
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
Este proceso se lo tiene que realizar para cada una de los componentes creados, y en este caso,
todos los componentes de la 2da “Activity” que se tiene, lo que quedaría de la siguiente manera:
Una vez ingresado nuestras referencias, se puede que observar nuestras ADVERTENCIAS,
desaparecieron de nuestra aplicación:
A continuación, se debe de seguir con el diseño lógico (Programación)de la aplicación.
13
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
7. DISEÑO LOGICO DE LA 1ra “Activity”.
A continuación, realizamos el diseño lógico de nuestra aplicación, en el apartado de
(MainActivity.java), de la 1ra “Activity” donde se desarrollará la programación en lenguaje JAVA.
• IMPORTANTE: Para poder realizar la programación de cualquier proyecto utilizando el
LENGUAJE JAVA, se tiene que seguir siempre, LA SIGUIENTE ARQUITECTURA.
Para este ejercicio, solo se
trabajará en la parte del
MÉTODO
LA CODIFICACIÓN que se tiene que realizar, VIENE DE LA SIGUIENTE MANERA:
• ENCAPSULAMIENTO: Para este ejercicio, no se utiliza el encapsulamiento.
• CASTING: Para este ejercicio, no se utiliza el Casting.
• METODO: Consiste en un trozo de código separado del cuerpo principal, que realiza una
tarea específica y devuelve un valor al cuerpo principal o a otra función que la invoque.
SIEMPRE se utiliza el
METODO “View” seguido de
Realizamos un un nombre cualquiera, que
método para el //método para la 1ra Activity en este caso es “view”
Button
public void Siguiente (View view)
{
Intent siguiente = new Intent(this, SegundoActivity.class);
startActivity(siguiente);
}
Se crea un objeto del Los parámetros del objeto “Intent” son:
tipo “Intent” para pasar • El nombre de la Activity donde te encuentras,
a la siguiente pantalla, en este caso “this”
con el nombre de • El segundo parámetro es hacia donde se
“Siguiente” El método “startActivity” ayuda a quiere ir, en este caso “SegundoActivity”
dirigirse a la otra actividad.
14
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
Una vez terminado la CODIFICACION (programación) debe quedar de la siguiente manera:
Una vez terminado la CODIFICACION, debemos asignar EL MÉTODO CREADO al botón de la
1ra “Activity”:
A continuación, se debe de seguir con el diseño lógico (Programación)de la 2da “Activity”.
8. DISEÑO LOGICO DE LA 2da “Activity”.
A continuación, realizamos el diseño lógico de nuestra aplicación, en el apartado de
15
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
(MainActivity.java), de la 2da “Activity” donde se desarrollará la programación en lenguaje JAVA.
• IMPORTANTE: Para poder realizar la programación de cualquier proyecto utilizando el
LENGUAJE JAVA, se tiene que seguir siempre, LA SIGUIENTE ARQUITECTURA.
Para este ejercicio, solo se
trabajará en la parte del
MÉTODO
LA CODIFICACIÓN que se tiene que realizar, VIENE DE LA SIGUIENTE MANERA:
• ENCAPSULAMIENTO: Para este ejercicio, no se utiliza el encapsulamiento.
• CASTING: Para este ejercicio, no se utiliza el Casting.
• METODO: Consiste en un trozo de código separado del cuerpo principal, que realiza una
tarea específica y devuelve un valor al cuerpo principal o a otra función que la invoque.
SIEMPRE se utiliza el
METODO “View” seguido de
Realizamos un un nombre cualquiera, que
método para el //método para la 1ra Activity en este caso es “view”
Button
public void Anterior (View view)
{
Intent anterior = new Intent(this, MainActivity.class);
startActivity(anterior);
}
Se crea un objeto del Los parámetros del objeto “Intent” son:
tipo “Intent” para pasar • El nombre de la Activity donde te encuentras,
a la pantalla anterior, en este caso “this”
con el nombre de • El segundo parámetro es hacia donde se
“anterior” El método “startActivity” ayuda a quiere ir, en este caso “MainActivity”
dirigirse a la otra actividad.
Una vez terminado la CODIFICACION (programación) debe quedar de la siguiente manera:
16
Esta estructura condicional es para
cuando el usuario si ha ingresado todos
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
Una vez terminado la CODIFICACION, debemos asignar EL MÉTODO CREADO al botón de la
2da “Activity”:
EJECUCIÓN DE LA APLICACIÓN.
Una vez terminada la codificación de nuestra aplicación, y que no exista errores en la
compilación, se debe EJECUTAR LA APLICACIÓN. En el cual debemos elegir uno de los
dispositivos virtuales que tenemos instalados en la computadora.
17
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
RECUERDA, ANDROID EMULADOR. Es un dispositivo simulado que se muestra en la
computadora de desarrollo, permitiendo desarrollar y probar una aplicación en un dispositivo
hardware simulado, teniendo el siguiente resultado:
18
PROGRAMACIÓN PARA DISPOSITIVOS MÓVILES
| CARRERA DE SISTEMAS INFORMÁTICOS
REPORTE Y/O CONCLUSIONES
Anote sus Conclusiones u Observaciones; del punto requerido.
1. PREGUNTAS TEORICAS.
1.- ¿Investigue porque en este ejercicio no se utiliza el ENCAPSULAMIENTO?
2.- ¿Investigue porque en este ejercicio no se utiliza el CASTING?
La investigación debe de ser de manera detallada para cada uno de los puntos anteriores.
2.- PREGUNTA PRACTICA.
Realice construcción del diseño gráfico y lógico de la siguiente aplicación, siguiendo la lógica de
este laboratorio.
19