Defining a percentage width for a LinearLayout? [duplicate]
I want to define a percentage width (70%) for a LinearLayout that contains some buttons, so that I can center it and so that the child buttons can fill_parent. Here's a picture showing what I mean:
My current layout looks like this:
<?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>
The LinearLayout im referring to has the id: linearLayout1. How do I do this?
Solution 1:
You have to set the weight property of your elements. Create three RelativeLayouts as children to your LinearLayout and set weights 0.15, 0.70, 0.15. Then add your buttons to the second RelativeLayout(the one with weight 0.70).
Like this:
<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>
Why are the weights 0.15, 0.7 and 0.15? Because the total weight is 1 and 0.7 is 70% of the total.
Result:
Edit: Thanks to @SimonVeloper for pointing out that the orientation should be horizontal and not vertical and to @Andrew for pointing out that weights can be decimals instead of integers.
Solution 2:
i know another solution, that work with weight:
<?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>
Solution 3:
Hope this can help
<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) Set layout_width to "0dip" (2) Set the layout_height to .xx (% you want)