Divide screen by percentage

Question

I am trying to create a Relative layout in when it 3 views layed out vertically. The first view is text and supposed to take 10% of the screen. Second view is image and is supposed to take 50% of the screen. 3rd view is text and is supposed to take the remaining 40%.

The way I do it is that by adjusting the dimensions of the image manually and estimating that it is close to what I want by looking at it. I am sure this is not the right way. So how can I do it? Bascially how can I devide the screen percentage wise and can I do it with Relative layout

Thank you

Answer 1

You should use LinearLayout with android:weightSum.

use android:weightSum="100" on the root layout and give the android:layout_weight according to your requirement. And android:layout_height="0dp" for each View.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="100" >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="10" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="50"
        android:contentDescription="@string/image"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="40" />

</LinearLayout>

Hope this will help you.

Answer 2

You can do it using LinearLayout and android:layout_weight attribute:

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <View
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <View
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight="5" />

    <View
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight="4" />

</LinearLayout>