Realmente va a ser mas largo revisar el código que creamos en el capitulo anterior, que lo que nos costo escribirlo, sin embargo es importante que entendáis donde esta cada cosa y para que sirve, de forma que, a por ello.
Las carpetas del proyecto
Cuando terminamos de crear el proyecto, nos encontramos con una ventana tan terrorífica como esta
Sin embargo, gran parte de todo esto es código generado que será automantenido, por lo que es mejor que no intentemos modificarlo desde el editor.
Para empezar a aclarar ideas, lo primero que tenemos que saber es que el código que queremos que tenga una actividad, lo pondremos en el fichero java que tiene el nombre de la actividad; en nuestro ejemplo, «inicio»
y según vemos estará en la carpeta de nuestro «package» (com.recursosformacion.miguel), que esta dentro de Java, dentro de «main»……
Según indicamos durante la generación, esta será nuestra actividad principal, y así como el código java esta en
src/main/java/
El layout de esta pantalla, osea su representación gráfica se encontrará en
src/mail/res/layout/
Si os acordáis, dijimos que el layout se llamaba «activity_inicio.xml», y ese es el fichero que encontramos, y que nos definirá que tiene la pantalla de esa actividad.
Realmente, el directorio «src» es el que vamos a centrar nuestra atención…. de momento. Hemos hablado que toda aplicación Android funciona sobre la base de «Activitis», y para cada una de ellas, deberemos contar un código java que establezca el comportamiento, y con la descripción del layout en su correspondiente fichero.
El fichero de layout, establece el contenido inicial de la pantalla de la actividad, luego, desde java, podemos generar los componentes del layout que nos interese; eso significa, que podríamos empezar con un layout totalmente vacío y generarlo todo desde java, aunque no sea la mejor opción.
En las siguientes imágenes veremos como nos puede ayudar a diseñar Android Studio.
El diseñador gráfico
Lo primero que hacemos, es seleccionar el fichero de layout sobre el que quiero actuar, que en nuestro caso es «activity_inicio.xml», a continuación, escondemos la ventana de exploración pulsando en el icono que nos aparece en (1).
Toda nuestra pantalla queda ocupada por el texto que describe el layout; si ahora pulsamos en la pestaña «Design», quedamos en vista diseñador:
Si habéis trabajado con algún sistema de diseño de «arrastrar y soltar», no tendréis problemas con el:
- En la parte superior los layouts característicos de Java, que establecen como se van a situar los componentes, en la parte inferior los componentes:botones, checkbox, textos,… que podemos arrastrar al área de diseño y soltar en donde nos convenga.
- Área de diseño; nos presenta el Nexus 4, pero con (5), lo podemos cambiar
- Árbol de componentes, con la raíz de la pantalla del dispositivos, podemos ir anidando layouts y/o componentes dentro de los layouts, hasta que quede el diseño que nos interese
- Propiedades del componente seleccionado
- Selector de periféricos. Podemos escoger sobre que periférico queremos diseñar
- Selección de conjunto de colores y características por medio de Temas
Para añadir un componente, por ejemplo un botón, lo seleccionamos en el cuadro (1) y lo arrastramos sobre el diseñador. según el layout que tengamos, nos lo dejará colocar en uno o en otro lugar, por fin lo soltamos
Con él todavía seleccionado, podemos ir hasta la ventana de propiedades (4) y bajar hasta encontrar «text», y allí podemos indicar el texto que deseamos que figure en el botón,para hacerlo, pulsamos el botón (1) con «…» que aparece a la derecha y nos aparece la ventana
Que contiene una lista de Resources, nos interesan los del proyecto (pestaña Project), en la misma, tenemos una lista de «string» y queremos añadir una mas, por lo que pulsamos en el botón (2) y en la siguiente pantalla introducimos los datos que deseamos
Hemos creado un nombre de recurso, que hubiera sido mas apropiado que fuera «Hola_Holita», luego hemos indicado el valor de este recurso, y hemos dejado igual el fichero, ya que no vemos ningún motivo para guardarlo aparte. Aunque en función de la estructura del proyecto, podría ser interesante partir las «strings» en varios ficheros.
Tras esto, al pulsar sobre «OK», volvemos al diseñador con el nuevo componente en si sitio, y con el texto deseado, aunque no hay nada de Java que lo sustente…..
también podemos seleccionar el letrero que nos saluda con «Hello world» y lo podemos hacer tanto el área (2) del diseñador, como seleccionando en el árbol de componentes (3) el componente
«TextView – @string/hello_word»
Pasamos a la ventana de Propiedades (4) y buscamos la linea «text»; si queréis, podéis ignorar la extraña estructura con la @ delante, y teclear directamente «Hola Mundo Android»
veréis que el sistema acepta el cambio, aunque os indica que habéis indicado un texto «harcoded»…Quizas, esta misma modificación, la hubiéramos podido hace sin cambiar nada aquí, utilizando el botón de la derecha, y en la pantalla de «Resources», Crear un nuevo «resource string» llamado «hola_mundo_android» y definir ahí el valor deseado. Valorad ventajas e inconvenientes vosotros mismos.
Cuando acabemos de diseñar, podemos volver a ver nuestro proyecto:
Utilizando el botón de la izquierda «Project» para mostrar nuestro árbol de directorios, la pestaña inferior de «Text» para ver la versión XML del layout con el que hemos estado trabajando, y
El botón de la derecha «Preview» para ver nuevamente el dispositivo, ahora ya con nuestro nuevo botón.
y en la pestaña «Text» podemos ver el texto que nos ha añadido el diseñador, al incorporar el botón:
En el siguiente artículo revisaremos el lado Java de todo esto, y seguiremos avanzando con nuestro IDE.
Relacionado
Descubre más desde Recursos para formacion
Suscríbete y recibe las últimas entradas en tu correo electrónico.