YouTube

Got a YouTube account?

New: enable viewer-created translations and captions on your YouTube channel!

Spanish subtitles

← LinearLayout

Get Embed Code
13 Languages

Showing Revision 1 created 10/06/2015 by sp12.

  1. Ya hemos visto
    que esta disposición lineal contiene
  2. dos TextViews hijos dentro.
  3. Por cierto, los colores escogidos
    para el fondo solo son para ayudarte
  4. a comprender que estas dos TextViews
    son hijos y que lo de fuera es su padre.
  5. El rojo y el azul
    no aparecerán en el dispositivo
  6. a no ser que se ajusten específicamente
    como colores de fondo para estas vistas.
  7. Voy a enseñártelo en el visor de XML.
  8. Si entramos en el código
    en el visor de XML,
  9. así es como aparecería en el dispositivo.
  10. Primero tenemos el ViewGroup
    LinearLayout [DisposiciónLineal].
  11. Es transparente porque no hemos escogido
    ningún color de fondo.
  12. El primer hijo es una TextView que pone
    "Guest List" [Lista de invitados].
  13. Aparece aquí arriba.
  14. El segundo hijo es una TextView
    que dice "Kunal".
  15. Aparece aquí,
    debajo de la primera TextView.
  16. Si copio esta TextView
    y la pego debajo de esta,
  17. ¿qué crees que pasará?
  18. Sí, tenemos otro "Kunal"
    justo debajo del primero.
  19. Parece que el patrón dice
    que si añadimos más TextViews aquí,
  20. aparecerán una tras otra en esta lista.
  21. Vamos a fijarnos bien en el código.
  22. Comienza
    con un corchete angular de apertura
  23. seguido del nombre de la vista,
    que en este caso es LinearLayout.
  24. Luego aparecen una lista de atributos
  25. y al final está
    el corchete angular de cierre.
  26. No hay ninguna barra
  27. porque esta es la etiqueta de apertura
    de LinearLayout.
  28. La etiqueta de cierre
    está abajo del todo
  29. porque queremos añadir elementos
    como si fueran hijos
  30. entre las etiquetas
    de apertura y de cierre.
  31. Pero en esta vista de prueba,
    como no contiene ningún hijo,
  32. podemos utilizar
    una etiqueta propia de cierre para ello.
  33. Lo mismo pasa con esta TextView de aquí
    y con esta de aquí.
  34. Cuando vemos que un ViewGroup
    contiene varios hijos,
  35. tenemos que ponerlos entre las etiquetas
    de apertura y de cierre.
  36. Otra cosa que habrás visto
    es que hay un atributo llamado
  37. android:orientation="vertical".
  38. Nunca lo habíamos visto,
  39. así que vamos a buscarlo en los documentos
    de Android que os enseñé antes.
  40. Abro una nueva ventana
    y escribo "android orientation".
  41. El primer resultado
    habla de LinearLayout
  42. y está en la página developer.android.com,
    así que hacemos clic.
  43. Al igual que con la TextView,
    la información que hay es apabullante.
  44. Podemos obviar la mayor parte del texto.
  45. Solo tenemos que confirmar
    que la página va sobre LinearLayout,
  46. y luego bajamos
    y buscamos en los atributos XML.
  47. Vamos a buscar el atributo que se llama
    android:orientation. Aquí está.
  48. Vamos a entrar para ver qué dice.
  49. En la descripción pone que este atributo
  50. determina si la disposición
    debe hacerse en columna o en línea.
  51. El valor del atributo puede ser
    "horizontal" para ponerse en línea,
  52. o "vertical" para ponerse en columna.
  53. Luego pone los dos valores aquí.
  54. Vale, entonces nuestro código dice
    que android:orientation es vertical.
  55. Ahora sabemos
    por qué las vistas se ven en una columna.
  56. Para satisfacer nuestra curiosidad,
    vamos a cambiar el valor.
  57. Vamos a poner que la orientación
    es horizontal para ver qué pasa.
  58. Voy al código
    y borro el valor "vertical".
  59. Voy a escribir "horizontal" y mira,
    las vistas están en una línea horizontal.
  60. No sé tú, pero a mí no me gustaría leer
    la lista de invitados en horizontal.
  61. Aunque habrá muchas ocasiones
  62. donde prefieras utilizar
    la disposición lineal horizontal.
  63. Por ejemplo, si estás creando
    una lista de elemento,
  64. puede que quieras poner
    una imagen al lado izquierdo
  65. y luego una descripción a la derecha.
  66. Voy a dejar que lo pruebes
    por ti mismo en un momento,
  67. pero antes quiero señalar
    esta otra línea del código.
  68. Aquí va el namespace [Espacio de nombre]
    del XML.
  69. Lo utilizamos para poder especificar
  70. que todos estos atributos
    pertenecen a Android.
  71. Por eso todos comienzan por android:.
  72. Es una nota básica
    para esta URL específica,
  73. solo válida para Android.
  74. Puedes crear
    tus propios atributos personalizados.
  75. Para evitar conflictos con el nombre,
    donde dos atributos no se llaman igual
  76. pero se comportan de forma diferente,
    añadimos siempre este prefijo:
  77. android:, para señalar
    que son atributos para Android.
  78. Lo que no puedes olvidar
    es añadir un namespace al XML
  79. en la etiqueta de apertura
    de la vista root de tu archivo XML.
  80. Ahora te toca a ti.
  81. Queremos que experimentes
    con el código de la disposición lineal.
  82. Añade más TextViews para que haya
    más elementos en esta columna.
  83. ¿A quién incluirás en esta lista exclusiva
    de invitados para tu fiesta?
  84. También tienes que cambiar la orientación
    del atributo LinearLayout.
  85. Recuerda que se puede poner
    en vertical u horizontal.