Android – Interface Gráfica Rogelio Ferreira Escutia.

Presentación del tema: "Android – Interface Gráfica Rogelio Ferreira Escutia."— Transcripción de la presentación:

1 Android – Interface Gráfica Rogelio Ferreira Escutia

2 2 Interfaz Gráfica

3 3 ? activity_main.xml Entre los recursos creados por defecto, cabe destacar el layout activity_main.xml, que contiene la definición de la interfaz gráfica de la pantalla principal de la aplicación. Si hacemos doble clic sobre el fichero Eclipse nos mostrará esta interfaz en su editor gráfico (tipo arrastrar y soltar) y como podremos comprobar, en principio contiene tan sólo una etiqueta de texto centrada en pantalla con el mensaje Hello World!.

4 4 ? activity (editor gráfico)

5 5 ? activity (código xml)

6 6 Componentes

7 7 Texto Imprime un mensaje en pantalla. <TextView android:id="@+id/LblNombre" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/nombre" /> Escribe tu nombre ARCHIVO: strings.xml ARCHIVO: activity_main.xml

8 8 Cuadro de Texto Sirve para introducir información a un programa, como cuando nos pregunta el nombre de una persona, teléfono, etc. <EditText android:id="@+id/TxtNombre" android:layout_width="match_parent" android:layout_height="wrap_content" android:inputType="text" /> ARCHIVO: activity_main.xml

9 9 Checkbox Sirve para seleccionar alguna opción. ARCHIVO: activity_main.xml

10 10 Reloj Nos imprime en pantalla un reloj analógico. <AnalogClock android:layout_width="wrap_content" android:layout_height="wrap_content" /> ARCHIVO: activity_main.xml

11 11 Imagen Imprime en pantalla una imagen (jpg, png, gif) <ImageView android:id="@+id/ImgFoto" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/itm" /> ARCHIVO: activity_main.xml NOTA: La fotografía itm.jpg (que se encuentra aquí), deberá ser copiada dentro de la carpeta drawable (que no existe), dentro del directorio res del proyecto creado.

12 12 Botón Sirve para ejecutar alguna opción, como enviar datos, imprimir, etc. <Button android:id="@+id/BtnEnviar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/enviar" /> Enviar!!! ARCHIVO: activity_main.xml ARCHIVO: strings.xml

13 13 Distribución de Componentes

14 14 LinearLayout Nos ordena los componentes uno en seguida de otro. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/LinearLayout1" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > ARCHIVO: activity_main.xml

15 15 TableLayout Nos ordena los componentes en forma de una tabla.

16 16 RelativeLayout Nos ordena los componentes en relación a otro ó a su padre.

17 17 AbsoluteLayout Nos ordena los componentes en forma absoluta (en una posición de coordenadas exacta).

18 18 FrameLayout Permite el cambio dinámico de los componentes.

19 Rogelio Ferreira Escutia Instituto Tecnológico de Morelia Departamento de Sistemas y Computación Correo:rogeplus@gmail.com rferreir@itmorelia.edu.mx Página Web:http://antares.itmorelia.edu.mx/~kaos/ http://www.xumarhu.net/ Twitter:http://twitter.com/rogeplus Facebook:http://www.facebook.com/group.php?gid=155613741139728