Percentage width in a RelativeLayout Percentage width in a RelativeLayout android android

Percentage width in a RelativeLayout


You are looking for the android:layout_weight attribute. It will allow you to use percentages to define your layout.

In the following example, the left button uses 70% of the space, and the right button 30%.

<LinearLayout    android:layout_width="match_parent"     android:layout_height="wrap_content"    android:orientation="horizontal">    <Button        android:text="left"         android:layout_width="0dp"         android:layout_height="wrap_content"         android:layout_weight=".70" />     <Button        android:text="right"         android:layout_width="0dp"         android:layout_height="wrap_content"         android:layout_weight=".30" /></LinearLayout>

It works the same with any kind of View, you can replace the buttons with some EditText to fit your needs.

Be sure to set the layout_width to 0dp or your views may not be scaled properly.

Note that the weight sum doesn't have to equal 1, I just find it easier to read like this. You can set the first weight to 7 and the second to 3 and it will give the same result.


This does not quite answer the original question, which was for a 70/30 split, but in the special case of a 50/50 split between the components there is a way: place an invisible strut at the center and use it to position the two components of interest.

<RelativeLayout     android:layout_width="match_parent"    android:layout_height="wrap_content">    <View android:id="@+id/strut"        android:layout_width="0dp"        android:layout_height="0dp"         android:layout_centerHorizontal="true"/>    <Button        android:layout_width="0dp"        android:layout_height="wrap_content"        android:layout_alignRight="@id/strut"        android:layout_alignParentLeft="true"        android:text="Left"/>     <Button         android:layout_width="0dp"        android:layout_height="wrap_content"        android:layout_alignLeft="@id/strut"        android:layout_alignParentRight="true"        android:text="Right"/></RelativeLayout>

As this is a pretty common case, this solution is more than a curiosity. It is a bit of a hack but an efficient one because the empty, zero-sized strut should cost very little.

In general, though, it's best not to expect too much from the stock Android layouts...


Update 1

As pointed by @EmJiHash PercentRelativeLayout is deprecated in API level 26.0.0

Below quoting google comment:

This class was deprecated in API level 26.0.0.consider using ConstraintLayout and associated layouts instead. The following shows how to replicate the functionality of percentage layouts with a ConstraintLayout


Google introduced new API called android.support.percent

Then you can just specify percentage to take by view

Add compile dependency like

implementation 'com.android.support:percent:22.2.0

in that, PercentRelativeLayout is what we can do a percentage wise layout

 <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>