Angelfg: /* Vistas posicionadas en relación ao pai e a outras vistas */

2020-11-21T13:02:42Z

Vistas posicionadas en relación ao pai e a outras vistas

Wiki en 17:11 7 oct 2019

2019-10-07T17:11:33Z

Wiki: Página creada con «==Introdución== Tamén é outro dos layouts máis comúns. As vistas (views) poden '''posicionarse''' en relación: ** a '''outras views''' (o que está arriba, abaixo,...»

2016-09-05T14:18:14Z

Página creada con «==Introdución== *Tamén é outro dos layouts máis comúns. *As vistas (views) poden '''posicionarse''' en relación: ** a '''outras views''' (o que está arriba, abaixo,...»

Página nueva

==Introdución==
*Tamén é outro dos layouts máis comúns.
*As vistas (views) poden '''posicionarse''' en relación:
** a '''outras views''' (o que está arriba, abaixo, a dereita,...). Para iso vai facer falla usar '''IDs'''.
***android:layout_above
***android:layout_below
***android:layout_toLeftOf
***android:layout_toRightOf
***android:layout_alignLeft
***android:layout_alignRight
***android:layout_alignTop
***android:layout_alignBottom
***android:layout_alignBaseline
** ao seu '''contedor ou pai''', que é un layout (arriba, centrado, abaixo, ...).
***android:layout_alignParentLeft
***android:layout_alignParentRight
***android:layout_alignParentTop
***android:layout_alignParentBottom
***android:layout_centerHorizontal
***android:layout_centerVertical
***android:layout_centerInParent

[[Image:00_relativelayout.png]]

*É un layout moi potente, que facilita o deseño e fai sinxelo entender o arquivo xml.
*Como norma, se un layout ten varios LinearLayout aniñados, é necesario substituílos por un RelativeLayout.
*Como se dixo, o posicionamento dun View faise en base a o seu contedor pai ou en base a outro View referenciado polo seu id.
*Se non se referencia a posición, por defecto, todos as views fillas son postas na parte esquerda superior do seu contedor.

Pódense consultar todas as opcións de posicionamento en:
*Referencias:
**RelativeLayout: http://developer.android.com/guide/topics/ui/layout/relative.html
**Opcións de posicionamento: http://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html

==Casos prácticos==
*Comezamos creando un novo proxecto: '''U2_05_Relative'''

===Vistas sen referencias de posición===
*No seguinte xml as vistas (botóns neste caso) non teñen unha referencia de posición, polo tanto, todas van estar ubicadas na posición esquerda-superior.

<syntaxhighlight lang="xml" line highlight="1,21">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 1"/>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 2" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 3" />

</RelativeLayout>
</syntaxhighlight>

[[Image:Android_2013_U2_05_Relative_01.jpg|300px]]

===Vistas posicionadas en relación a outras vistas===
*Para iso precisamos crear un identificador (ID) para a vista/s que se van usar como referencia.
[[Image:Android_2013_U2_05_Relative_02.jpg|350px]]

*E logo na vista que se desexa ubicar en relación a outra vista facer uso dese ID.
[[Image:Android_2013_U2_05_Relative_03.jpg|350px]]

*A continuación o contido XML do layout:
<syntaxhighlight lang="xml" line highlight="7,13,19">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<Button
android:id="@+id/btBoton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 1"/>

<Button
android:layout_toRightOf="@id/btBoton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 2" />

<Button
android:layout_below="@id/btBoton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 3" />

</RelativeLayout>
</syntaxhighlight>

*A imaxe amosa a representación gráfica do layout.
[[Image:Android_2013_U2_04_Linear_03A.jpg|300px]]

===Vistas posicionadas en relación ao pai e a outras vistas===

<syntaxhighlight lang="xml" line highlight="7,13,19,25,32">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<Button
android:id="@+id/btBoton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 1"/>

<Button
android:layout_toRightOf="@id/btBoton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 2" />

<Button
android:layout_below="@id/btBoton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 3" />

<Button
android:id="@+id/btBoton4"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 4" />

<Button
android:layout_alignBaseline="@id/btBoton4"
android:layout_alignParentRight="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Preme 5" />

</RelativeLayout>
</syntaxhighlight>

*Observar os botóns '''Preme 4''' e '''Preme 5''' como teñen algunha referencia ao Pai para ser ubicados.
[[Image:Android_2013_U2_05_Relative_04.jpg|300px]]

<br> -- [[Usuario:angelfg|Ángel D. Fernández González]] e [[Usuario:Carrion|Carlos Carrión Álvarez]] -- (2015).

← Revisión anterior		Revisión del 13:02 21 nov 2020
Línea 164:		Línea 164:


		+
		+	<br />
		+	'''[https://wiki.cifprodolfoucha.es/index.php?title=Programaci%C3%B3n_de_dispositivos_m%C3%B3biles#UNIDADE_2:_A_interface_de_usuario. Enlace a la página principal de la UD2]'''
		+	<br />
		+	<br />
		+	'''[https://wiki.cifprodolfoucha.es/index.php?title=Programación_de_dispositivos_móbiles Enlace a la página principal del curso]'''
		+	<br />
	<br> -- [[Usuario:angelfg\|Ángel D. Fernández González]] e [[Usuario:Carrion\|Carlos Carrión Álvarez]] -- (2015).		<br> -- [[Usuario:angelfg\|Ángel D. Fernández González]] e [[Usuario:Carrion\|Carlos Carrión Álvarez]] -- (2015).

@@ Línea 1: / Línea 1: @@
 ==Introdución==
-*Tamén é outro dos layouts máis comúns.
+*Tamén é outro dos layouts máis comúns e máis empregados ata a aparición do '''ConstraintLayout'''.
 *As vistas (views) poden '''posicionarse''' en relación:
 ** a '''outras views''' (o que está arriba, abaixo, a dereita,...). Para iso vai facer falla usar '''IDs'''.
@@ Línea 29: / Línea 30: @@
 *Como se dixo, o posicionamento dun View faise en base a o seu contedor pai ou en base a outro View referenciado polo seu id.
 *Se non se referencia a posición, por defecto, todos as views fillas son postas na parte esquerda superior do seu contedor.
 Pódense consultar todas as opcións de posicionamento en:

RelativeLayout - Historial de revisiones

Angelfg: /* Vistas posicionadas en relación ao pai e a outras vistas */

Wiki en 17:11 7 oct 2019

Wiki: Página creada con «==Introdución== *Tamén é outro dos layouts máis comúns. *As vistas (views) poden '''posicionarse''' en relación: ** a '''outras views''' (o que está arriba, abaixo,...»

Wiki: Página creada con «==Introdución== Tamén é outro dos layouts máis comúns. As vistas (views) poden '''posicionarse''' en relación: ** a '''outras views''' (o que está arriba, abaixo,...»