studio porcentaje linearlayout layout_width elementos ejemplo contenedores amontonados android android-layout

android - layout_width - linearlayout porcentaje



¿Definir un ancho de porcentaje para LinearLayout? (10)

* Puede usar propiedades layout_weight . Si desea obtener el 70% del ancho principal, debe establecer el valor de propiedad de layout_width niño 0dp, como android:layout_width="0dp" *

Quiero definir un ancho porcentual (70%) para un LinearLayout que contenga algunos botones, de forma que pueda centrarlo y para que los botones secundarios puedan fill_parent. Aquí hay una imagen que muestra lo que quiero decir:

Mi diseño actual se ve así:

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/layoutContainer" android:orientation="vertical"> <LinearLayout android:layout_width="fill_parent" android:id="@+id/barContainer" android:orientation="horizontal" android:layout_height="40dp" android:background="@drawable/titlebackground"> <ImageView android:id="@+id/barLogo" android:src="@drawable/titlelogo" android:layout_gravity="center_vertical" android:adjustViewBounds="true" android:layout_height="25dp" android:layout_width="wrap_content" android:scaleType="fitXY" android:paddingLeft="5dp"></ImageView> </LinearLayout> <TextView android:layout_height="wrap_content" android:layout_width="fill_parent" android:gravity="center_horizontal" android:id="@+id/searchTip" android:text="@string/searchTip" android:paddingTop="10dp" android:paddingBottom="10dp"></TextView> <LinearLayout android:layout_height="wrap_content" android:id="@+id/linearLayout1" android:orientation="vertical" android:layout_width="wrap_content"> <Button android:text="Button" android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button> <Button android:layout_width="wrap_content" android:id="@+id/button2" android:layout_height="wrap_content" android:text="Button"></Button> <Button android:layout_width="wrap_content" android:id="@+id/button3" android:layout_height="wrap_content" android:text="Button"></Button> </LinearLayout> </LinearLayout>

El LinearLayout al que me refiero tiene el ID: linearLayout1. ¿Cómo hago esto?


Como última actualización de Android en 2015, Google ha incluido una biblioteca de soporte porcentual

com.android.support:percent:23.1.0

Puede referirse a este sitio, por ejemplo, de usarlo

https://github.com/JulienGenoud/android-percent-support-lib-sample

Gradle:

dependencies { compile ''com.android.support:percent:22.2.0'' }

En el diseño:

<android.support.percent.PercentRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <View android:id="@+id/top_left" android:layout_width="0dp" android:layout_height="0dp" android:layout_alignParentTop="true" android:background="#ff44aacc" app:layout_heightPercent="20%" app:layout_widthPercent="70%" /> <View android:id="@+id/top_right" android:layout_width="0dp" android:layout_height="0dp" android:layout_alignParentTop="true" android:layout_toRightOf="@+id/top_left" android:background="#ffe40000" app:layout_heightPercent="20%" app:layout_widthPercent="30%" /> <View android:id="@+id/bottom" android:layout_width="match_parent" android:layout_height="0dp" android:layout_below="@+id/top_left" android:background="#ff00ff22" app:layout_heightPercent="80%" /> </android.support.percent.PercentRelativeLayout>


Conozco otra solución que funciona con peso:

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent" android:weightSum="10" android:gravity="center_horizontal"> <LinearLayout android:orientation="vertical" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_weight="7"> </LinearLayout> </LinearLayout>


Creo que el enfoque de Emiam es correcto. Pero también estoy de acuerdo con Simon Veloper (uno de los comentaristas de la respuesta de Emiam): cuando necesitamos los botones en un 70% de ancho, debemos usar orientación horizontal para Linearlayout y establecer el ancho de cada Relativelayout en 0dip y su peso como se especifica. Sugiero esto versión :

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/layoutContainer" android:orientation="horizontal"> <RelativeLayout android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="3"> </RelativeLayout> <RelativeLayout android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="14"> //This is where you add buttons. You can make them "fill_parent". </RelativeLayout> <RelativeLayout android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="3"> </RelativeLayout> </LinearLayout>


Espero que esto pueda ayudar

<LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal"> <LinearLayout android:layout_width="0dip" android:layout_height="wrap_content" android:orientation="horizontal" android:id="@+id/linearLayout_dummy1" android:layout_weight=".15"> </LinearLayout> <LinearLayout android:layout_height="wrap_content" android:id="@+id/linearLayout1" android:orientation="vertical" android:layout_width="0dip" android:layout_weight=".7"> <Button android:text="Button" android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center"> </Button> <Button android:layout_width="wrap_content" android:id="@+id/button2" android:layout_height="wrap_content" android:text="Button" android:layout_gravity="center"></Button> <Button android:layout_width="wrap_content" android:id="@+id/button3" android:layout_height="wrap_content" android:text="Button" android:layout_gravity="center"></Button> </LinearLayout> <LinearLayout android:layout_width="0dip" android:layout_height="wrap_content" android:orientation="horizontal" android:id="@+id/linearLayout_dummy2" android:layout_weight=".15"> </LinearLayout> </LinearLayout>

(1) Establezca layout_width en "0dip" (2) Establezca el layout_height en .xx (% que desea)


Google presentó una nueva API llamada PercentRelativeLayout

Agregar dependencia de compilación como

compile ''com.android.support:percent:22.2.0''

en que PercentRelativeLayout es lo que podemos hacer por ciento de diseño


No puede definir ancho / alto / márgenes / ... usando porcentajes en su XML. Pero lo que querrías usar es el atributo "peso", que es, IMO, lo más parecido.

Otro método sería establecer los tamaños mediante programación después de inflar el diseño en el código, obteniendo el tamaño de la pantalla y calculando los márgenes necesarios.


Resolví un problema similar aplicando algo de relleno al LinearLayout así:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/app_background" android:padding="35dip"> <RelativeLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="@color/black"> </RelativeLayout> </LinearLayout>

Esto probablemente no le dará un porcentaje exacto, pero puede graduarse fácilmente y evitar elementos de diseño innecesarios adicionales.


Tienes que establecer la propiedad de peso de tus elementos. Cree tres RelativeLayouts como secundarios en su LinearLayout y configure los pesos 0.15, 0.70, 0.15. Luego agregue sus botones al segundo RelativeLayout (el que tiene un peso de 0.70).

Me gusta esto:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/layoutContainer" android:orientation="horizontal"> <RelativeLayout android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="0.15"> </RelativeLayout> <RelativeLayout android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="0.7"> <!-- This is the part that''s 70% of the total width. I''m inserting a LinearLayout and buttons.--> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_centerInParent="true" android:orientation="vertical"> <Button android:text="Button1" android:layout_width="fill_parent" android:layout_height="wrap_content"> </Button> <Button android:text="Button2" android:layout_width="fill_parent" android:layout_height="wrap_content"> </Button> <Button android:text="Button3" android:layout_width="fill_parent" android:layout_height="wrap_content"> </Button> </LinearLayout> <!-- 70% Width End--> </RelativeLayout> <RelativeLayout android:layout_width="0dip" android:layout_height="fill_parent" android:layout_weight="0.15"> </RelativeLayout> </LinearLayout>

¿Por qué los pesos son 0.15, 0.7 y 0.15? Porque el peso total es 1 y 0.7 es 70% del total.

Resultado:

Editar: Gracias a @SimonVeloper por señalar que la orientación debe ser horizontal y no vertical y a @Andrew por señalar que los pesos pueden ser decimales en lugar de enteros.


Usar una nueva biblioteca de soporte porcentual

compile ''com.android.support:percent:24.0.0''

Ver ejemplo abajo

<android.support.percent.PercentRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView app:layout_widthPercent="50%" app:layout_heightPercent="50%" app:layout_marginTopPercent="25%" app:layout_marginLeftPercent="25%"/> </android.support.percent.PercentRelativeLayout>

Para más información Tutorial1 Tutorial2 Tutorial3