diseño lineal
LinearLayout es un tipo de grupo de vista que es responsable de mantener vistas en él, ya sea horizontal o verticalmente. Es un tipo de diseño en el que se pueden organizar grupos de forma horizontal o vertical.
Diagrama de ejemplo:
Sintaxis:
XML
<LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="either vertical or horizontal"> <!--ImageView, TextView, ButtonView etc.--> </LinearLayout>
Disposición relativa
RelativeLayout es un diseño en el que podemos organizar vistas/widgets según la posición de otras vistas/widgets. Es independiente de la vista horizontal y vertical y podemos organizarlo según la satisfacción de cada uno.
Diagrama de ejemplo:
Sintaxis:
XML
<RelativeLayout android:layout_width="wrap_content" android:layout_height="wrap_content"> <!--ImageView, TextView, ButtonView etc with specified position--> </RelativeLayout>
Diferencia entre LinearLayout y RelativeLayout
diseño lineal |
Disposición relativa |
---|---|
Podemos ajustar las vistas y los widgets de forma lineal, es decir, horizontal y verticalmente. | Podemos ajustar las vistas y los widgets según la satisfacción de cada uno. |
El atributo layout_weight en el diseño lineal se usa para especificar el tamaño igual o específico para el widget y la vista en particular usando el siguiente atributo. android:layout_weight = ‘0’ Aquí el peso se especifica como 0 para dar el mismo tamaño o espacio a cada vista o widget. |
Varios atributos como: layout_toRightOf, layout_toLeftOf, layout_below, layout_alignParentTop, layout_top, layout_alignParentLeft, layout_alignParentRight se utilizan para especificar la posición de cada vista y widget. |
Es útil cuando organizamos las vistas de forma lineal. | Es útil cuando organizamos las vistas de forma relativa. |
Sintaxis: <Disposición Lineal> <!–Vistas, widgets–> </LinearLayout> |
Sintaxis: <RelativeLayout> <!–Vistas, Widgets–> </RelativeLayout> |
Ejemplo: en varias aplicaciones, LinearLayout se aplica principalmente en la pantalla de registro, donde el nombre, el correo electrónico, el número de teléfono, el envío, etc. se organizan de forma lineal. | Ejemplo: en Google Play Store, cuando abrimos la aplicación, los juegos, libros, películas y las secciones de la aplicación se organizan en modo de diseño relativo. |
LinearLayout se usa menos en comparación con RelativeLayout. | RelativeLayout se usa más en aplicaciones. |
Podemos usar LinearLayout dentro de RelativeLayout. | También podemos usar RelativeLayout como elemento secundario de LinearLayout. |
Programa que explica LinearLayout
XML
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/white" android:orientation="horizontal"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_marginLeft="35dp" android:layout_marginTop="20sp" android:layout_marginRight="10sp" android:layout_weight="0" android:background="#004d00" android:text=" Geeks" android:textColor="#ffffff" android:textSize="40sp" android:textStyle="bold" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:layout_marginTop="20sp" android:layout_marginRight="10sp" android:layout_weight="0" android:background="#f2f2f2" android:text="For" android:textColor="#004d00" android:textSize="40sp" android:textStyle="bold" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:layout_marginTop="20sp" android:layout_marginRight="10sp" android:layout_weight="0" android:background="#004d00" android:text="Geeks" android:textColor="@color/white" android:textSize="40sp" android:textStyle="bold" /> </LinearLayout>
Producción:
Programa que explica RelativeLayout
XML
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/white"> <ImageView android:id="@+id/image_gfg" android:layout_width="100dp" android:layout_height="110dp" android:layout_marginLeft="10dp" android:layout_marginTop="10dp" android:layout_marginRight="10dp" android:scaleType="centerCrop" android:src="@drawable/gfg" /> <TextView android:id="@+id/gfg_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:layout_toRightOf="@id/image_gfg" android:paddingTop="5dp" android:text="Geeks For Geeks" android:textColor="#004d00" android:textSize="32sp" android:textStyle="bold" /> <TextView android:id="@+id/gfg_location" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/gfg_text" android:layout_marginLeft="10dp" android:layout_toRightOf="@id/image_gfg" android:text="Noida,UttarPradesh" android:textColor="#00b300" android:textSize="25sp" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/gfg_location" android:layout_marginLeft="10dp" android:layout_toRightOf="@id/image_gfg" android:text="Portal for CS Student" android:textColor="#009900" android:textSize="24sp" /> </RelativeLayout>
Producción:
Publicación traducida automáticamente
Artículo escrito por jagroopofficial y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA