2.1 Pestaña de módulos y subrutinas
ACTIVITY MENU
Descripción de la aplicación: Muestra un mensaje según la opción seleccionada Interfaz de usuario: Menú ítem (solo disponible desde código)
Hardware: Dispositivo Android
A partir de este punto se omitirán los pasos básicos tales como ejecutar el IDE, guardar el proyecto, etc. Se usara siempre la opción de instalar la aplicación en el almacenamiento externo, también se omitirán los comentarios de código en las imágenes para tener mayor espacio ya que se proporciona todo el código fuente con comentarios. Todo lo anterior con el fin de enfocarse en los nuevos conceptos.
Este ejemplo utiliza un tipo de control que solo se puede crear desde código conocido como menú ítem y un tipo de mensaje utilizado en el ejercicio 2 a modo de reto, llamado Toastmessage, el objetivo es entender el flujo del programa.
Nombre del Proyecto: ACTIVITY MENU Package Name: ejercicio3.android Application Label: Ejercicio 3
Los Ítems de menú aparecen cuando el usuario presiona la tecla menú del dispositivo. Para crear un ítem se utiliza el comando Activity.AddMenuItem que necesita dos parámetros uno es el texto del ítem y el otro es el evento o la subrutina asociada a el boton, recordar que los botones tiene un evento principal que es el clic. La sintaxis del comando es la siguiente:
Activity.AddMenuItem("titulo","evento")
Es un comando de inicialización o construcción por lo tanto debe declararse en el evento Activity_Create
Se ha construido dos ítems uno con el título opción 1 y el otro con el titulo opción 2. El parámetro más importante es el evento puede ser cualquier texto pero se debe usar una metodología para no equivocarse al momento de tocar el ítem opción 1 el flujo del programa buscara la subrutina evento_opcion_1, pasara lo mismo con el Ítem opción 2. Por lo tanto además de definir un evento habrá que construir la subrutina que pueden agregarse al final del código como se muestra a continuación:
Cada subrutina comienza por Sub seguido del nombre del evento que siempre debe ser el mismo que se declara como cuando construye un ítem seguido de un guion y el evento fundamental. Por ejemplo se definió evento_opcion_1 y el evento fundamental es el clic en el caso del Ítem opción 1, Por lo tanto queda como evento_opcion_1_clic. Cada subrutina termina con End Sub y es en este bloque donde se pondrán todas las acciones a realizar al tocar el Ítem. En este caso para cada Ítem aparecerá un Mensaje tipo Toast al tocarlo
Al correr la aplicación y presionar el botón menú del dispositivo aparecerán los ítems y al tocar un ítem aparecerá el mensaje Toast
Un mensaje Toast es aquel que se desvanece después de un tiempo Reto: Aumentar los ítems y los mensajes a 4
BUTTON
Descripción de la aplicación: Muestra un mensaje al tocar el botón Interfaz de usuario: 1 Button
Hardware: Dispositivo Android
En este ejemplo se hace uso del primer View para interactuar con la aplicación. Al tocar el botón se mostrara un cuadro de mensaje (MSGBOX). Diseñar el Layout agregando un Button y guardarlo con el nombre layout_ejercicio_5. El propósito de este ejemplo es vincular los Views con el código Nombre del Proyecto: BUTTON
Package Name: ejercicio5.android Application Label: Ejercicio 5
El primer paso para vincular el Boton con el código es declararlo, pero al ser un View esto se puede hacer desde el designer por medio del menú Tools->Generate Members aparecerá una ventana en la que se muestran los Views utilizados en el diseño y también la actividad
Se deben marcar los Views y eventos que se desean vincular al diseño en este caso se marcara el Button1 y su evento clic y después dar clic al botón Generate members.
Automáticamente el objeto se declara en Sub Globals
Y también la subrutina correspondiente al evento del objeto, el comando Msgbox es agregado por el usuario
Reto: Usar el Button1 con otro evento
LABEL
Descripción de la aplicación: Cambia el Texto de un Label al tocar un Button Interfaz de usuario: 1 Button, 1 Label
Hardware: Dispositivo Android
A partir de este punto se omitirá también el proceso de diseño del Layout, generar los miembros y cargar el Layout, en la parte superior de cada ejemplo se especifica los Views necesarios para la interfaz de usuario, se proporciona además los Layout de cada ejercicio están en la carpeta APLICACIONES ANDROID->FILES del CD, también se especificara las propiedades y eventos necesario para cada View.
En este ejemplo se hace de un View visto anteriormente y un view de texto llamado Label. Al tocar el boton el texto del Label cambiara.
Nombre del Proyecto: LABEL Package Name: ejercicio6.android Application Label: Ejercicio 6
El código necesario para cambiar el texto del Label es a través de la propiedad Text y su sintaxis es la siguiente:
Label1.Text="Cualquier_Texto"
El evento Click del Button1 deberá quedar de la siguiente manera
El resultado de la aplicación al tocar el Button1 será el siguiente
SEEKBAR
Descripción de la aplicación: Muestra la posición de un Seekbar en un Label Interfaz de usuario: 1 Seekbar, 1 Label
Hardware: Dispositivo Android Nombre del Proyecto: SEEKBAR Package Name: ejercicio7.android Application Label: Ejercicio 7
El Layout deberá quedar como se muestra a continuación:
El Seekbar es un tipo de View numérico, dependiendo la posición en que se encuentre será su valor, este valor se puede leer con la propiedad Value. El evento será ValueChanged que es cuando cambia su posición. Los valores que toma son enteros y por medio de la propiedad Max se puede configurar el máximo valor que puede tomar. El código necesario para leer la posición es el siguiente:
Variable=SeekBar1.Value
Donde Variable es una variable declarada necesaria para guardar el valor, pero el lenguaje Basic permite asignar directamente un valor entero a un Label. El código del evento del Seekbar deberá quedar de la siguiente forma:
El resultado de la aplicación al deslizar el Seekbar será el siguiente
Reto: Avisar al usuario cuando se ha llegado al mínimo y al máximo valor
PROGRESSBAR
Descripción de la aplicación: Muestra la posición de un Seekbar en un Label y en un ProgressBar Interfaz de usuario: 1 Seekbar, 1 Label, 1 ProgressBar
Hardware: Dispositivo Android Nombre del Proyecto: ProgressBar Package Name: ejercicio8.android Application Label: Ejercicio 8
El ProgressBar tiene el funcionamiento contrario al SeekBar se puede configurar la posición o progreso a través de la propiedad Progress, siendo 100 el valor máximo que puede tomar, y además no tiene eventos. El código necesario para escribir la posición es el siguiente:
ProgressBar1.Progress=algún valor entero
Donde algún valor entero puede ser una constante o una variable por ejemplo al leer la posición de un Seekbar se obtiene un entero por lo cual se puede asignar directamente. El código del evento del Seekbar deberá quedar de la siguiente forma:
El resultado de la aplicación al deslizar el Seekbar será el siguiente
Reto: Ajustar lo necesario para aumentar el rango a 1024
RADIOBUTTON
Descripción de la aplicación: Cambia el color del texto de un Label según la opción seleccionada Interfaz de usuario: 3 RadioButton, 1 Label
Nombre del Proyecto: RADIOBUTTON Package Name: ejercicio9.android Application Label: Ejercicio 9
El Layout deberá quedar como se muestra a continuación:
El RadioButton es un control de selección y su estado puede saberse a través de la propiedad Checked, siendo True o False los dos valores que puede tomar, el evento utilizado es el CheckedChange que es cuando cambia de estado, cuando están agrupados solo se puede seleccionar un RadioButton. El código necesario para leer su estado es el siguiente:
Variable=RadioButton1.Checked
Donde Variable es de tipo booleano, sin embargo la manera general de usar estos controles es a través de bloques IF THEN.
Un color se puede establecer de una manera fácil por medio de la función Colors, el autocompletado mostrara las diferentes opciones disponibles. Para este ejemplo se utilizan los colores rojo, verde y azul
Cada RadioButton establece un color para el texto del Label por lo tanto se pondrá una instrucción en cada evento correspondiente, el código deberá quedar como se muestra a continuación.
El resultado de la aplicación al seleccionar cada RadioButton será el siguiente:
CHECKBOX
Descripción de la aplicación: Controla el estilo de un Label según las opciones marcadas Interfaz de usuario: 3 CheckBox, 1 Label
Hardware: Dispositivo Android Nombre del Proyecto: CHECKBOX Package Name: ejercicio10.android Application Label: Ejercicio 10
El Layout deberá quedar como se muestra a continuación:
El CheckBox es un control de selección igual al RadioButton, con la diferencia de que se puede seleccionar más de uno. El código necesario para leer su estado es el siguiente:
Variable=CheckBox1.Checked
Donde Variable es de tipo booleano, sin embargo al igual que un RadioButton la manera general de usar estos controles es a través de bloques IF THEN.
Este ejemplo es parecido al anterior con la diferencia que se controla el estilo de texto: negrita, minúscula y resaltado, el código deberá quedar como se muestra a continuación.
El resultado de la aplicación al combinar las opciones será el siguiente:
En el bloque anterior se desarrollaron aplicaciones básicas utilizando los principales Views para familiarizarse con el entorno Basic4Android, a continuación se realizaran aplicaciones que incluyan el uso de librerías para explorar las funciones características de Android como los sensores, las notificaciones, el reconocimiento de voz, etc.
Al igual que en el capítulo anterior las aplicaciones listas para instalar y probar se encuentran en la carpeta APK del CD, también el código fuente y el proyecto de las aplicaciones se encuentran en la carpeta APLICACIONES ANDROID del CD
ANIMATION
Descripción de la aplicación: Anima un objeto con la librería ANIMATION Interfaz de usuario: 2 Button, 6 RadioButton
Hardware: Dispositivo Android Nombre del Proyecto: ANIMATION Package Name: ejercicio11.android Application Label: Ejercicio 11
La librería Animation está orientada a aplicar animaciones a los Views, para utilizar cualquier librería es necesario incluirla en el proyecto marcando la correspondiente de las que aparecen disponibles en la pestaña Libs del lado inferior derecho del IDE, la librería Core siempre aparecerá marcada ya que contiene los comandos básicos para cualquier aplicación.
La librería ANIMATION ofrece 6 tipos diferentes de animaciones, para construir una aplicación primero se debe declarar el objeto como tipo Animation en este caso lo que se pretende es explorar las 6 opciones por lo tanto se debe declarar esa cantidad de objetos, también se necesita
una variable que se declara como x que más adelante se explica, el código correspondiente a la declaración debe quedar de la siguiente manera:
Cualquier variable que se declara en Basic se declara de la siguiente forma:
Dim nombre_de_la_variable Astipo_de_variable
En la parte Sub Globals del código aparecen también los objetos declarados ya que esto lo hace automáticamente el designer al generar miembros. El siguiente paso es construir cada una de las animaciones, ya que esto es una creación o inicialización el código deberá ir en la parte Activity_Create como se muestra a continuación:
Para una animación se debe definir 4 cosas: el tipo de animación, la duración de la animación, las veces que se repetirá y el modo de repetición. Las tres últimas son iguales para todos los tipos y se establecen por medio de las propiedades Duration, RepeatCount y RepeatMode respectivamente. El desarrollador no debe olvidar para acceder a las propiedades primero se escribe el nombre del objeto seguido de punto y el autocompletado muestra todas sus propiedades, constantes y funciones. La duración se expresa en milisegundos, la cantidad de repeticiones en un entero y el modo de repetición por medio de una constante del propio objeto que puede ser REPEAT_REVERSE O REPEAT_RESTART, lo que significa que la animación hará reversa o reiniciara
para repetir. Un punto muy importarte para tener una idea de la sintaxis de los comandos es identificar qué tipo de propiedad es, en un objeto pueden aparecer los siguientes símbolos:
El primero (mano) indica que la propiedad necesita un valor proporcionado a través del operador de asignación =, Como es el caso de Duration. El segundo símbolo (cuadro purpura) indica que la propiedad es más compleja que necesita ciertos parámetros como es el caso de LoadLayout() , casi siempre de esa forma con los paréntesis. El último icono (cuadro azul) significa que es una constante y se debe usar como en el caso de Repeat_Reverse. El IDE muestra también ejemplos de sintaxis como en el caso de los tipos de animación. Para ilustrar cada tipo de animación se utilizan 6 RadioButton y un boton para ejecutar la acción de iniciar la animación. Por lo tanto se debe checar el estado de cada RadioButton y de alguna forma hacerle saber al boton cual esta seleccionado. Esto se hace por medio de la variable X como se muestra a continuación:
El Button2 será el encargado de iniciar las animaciones por medio de la propiedad Start, cabe aclarar que el Button1 solo sirve para que a través de él se muestre la animación de un View, el código quedara de la siguiente manera:
El resultado de la aplicación (animaciones alpha, rotate y scale) será el siguiente
Reto: Controlar las coordenadas de la animación translate por medio del evento Touch de la actividad
TTS