Search code examples
androidandroid-viewandroid-preferencesandroid-styles

How to use Percentage for android layout?


How can we use percentage values for android view elements? something like this

<TextView
        android:id="@+id/"
        android:layout_width="75%"
        android:layout_height="50%"/>

Solution

  • UPDATE 2018:

    PercentRelativeLayout and PercentFrameLayout are deprecated. Consider using ConstraintLayout

    Old Answer:

    So far Android Support library has limited on where to use this:

    1. with RelativeLayout

      android.support.percent.PercentRelativeLayout
      
    2. with FrameLayout

      android.support.percent.PercentFrameLayout
      

    How to use it?

    Well, first make sure to include the dependency at build.grade(Module: app) in your android app.

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

    Then navigate to your xml layout in this example (.MainActivity)

    <android.support.percent.PercentRelativeLayout
    
      xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      xmlns:tools="http://schemas.android.com/tools"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:paddingBottom="@dimen/activity_vertical_margin"
      android:paddingLeft="@dimen/activity_horizontal_margin"
      android:paddingRight="@dimen/activity_horizontal_margin"
      android:paddingTop="@dimen/activity_vertical_margin"
      tools:context=".MainActivity">
    
    
      <Button
        android:id="@+id/button"
        android:text="Button"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        app:layout_widthPercent="30%"/>
    
      <Button    
        android:id="@+id/button2"
        android:text="Button 2"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/button"
        app:layout_widthPercent="60%"/>
    
      <Button
        android:id="@+id/button3"
        android:text="Button 3"
        android:layout_height="wrap_content"
        android:layout_below="@+id/button"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        app:layout_widthPercent="90%"/>
    
    </android.support.percent.PercentRelativeLayout>
    

    For more detail please check here: