CODEWITHSUNDEEP
androidandroid-layout
Henley Wing Chiu
Henley Wing Chiu

Reputation: 22515

Android: Setting width percentage of view in RelativeLayout

I'm using a RelativeLayout, and want to center the orange bar below in the center and fill up 90% of the width. I know this is possible to do using a LinearLayout using percentage, but how do I do so with a RelativeLayout?

Do I have to programatically calculate how wide is the screen (in dp), and set this 90% of this as the width of the orange view?

In short, I want something like this, where the orange bar takes up 90% of the screen centered in the middle using a RelativeLayout, without hardcoding x and y coordinates, so that it works on all screen densities. (The dark bars in the edge are the edge of the phone)

enter image description here

Upvotes: 1

Views: 3914

Answers (2)

Magesh Pandian
Magesh Pandian

Reputation: 9369

Use new percentage support library

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

See below example

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

*For More Info * Tutorial1 Tutorial2 Tutorial3

Upvotes: 0

Chandan Adiga
Chandan Adiga

Reputation: 576

Just a guess, but worth a try :) Please redesign your layout structure like below:

<LinearLayout[with 90% width]>
    <RelativeLayout
           android:layout_width="fill_parent" 
           ...
         <!--this will fill up its parent i.e above LinearLayout which is 90% of the screen width -->
     >
           <!--child views goes here.. -->
     </RelativeLayout>
</LinearLayout>

Upvotes: 1

Related Questions