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>