Search code examples
androidandroid-layoutscreen-resolution

Divide screen by percentage from top and sides


I am trying to create a layout with image situated 20% size of screen from left, 20% size of screen from right and 30% size of screen from top. I can situate an image as 20% of the distance from the sides but don't know how to combine the percentages from the top and sides simultaneously. Now I'm using android:layout_marginTop to jump from the top edge. I want to use something what will make 30% free space of screen from top on any screen resolution. Please take a look on Fig.1. Thanks a lot for any help.

Fig. 1

XML Code:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:weightSum="100" >

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

    <ImageView
        android:id="@+id/imageView4"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        android:layout_marginTop="100dp"
        android:layout_weight="60"
        android:src="@drawable/logo_line" />

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

Solution

  • use a RelativeLayout or wrap the ImageView in a LinearLayout :

    ---- EDIT ----

    on the ImageView : take out the layout_gravity and margin_top attributes and set layout_height to 0dp

    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:weightSum="100" >
    
    <TextView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20" />
    
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="60"
        android:orientation="vertical"
        android:weightSum="100" >
    
    <TextView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="30" />
    <ImageView
        android:id="@+id/imageView4"
        android:layout_width="match_parent"
        android:layout_height="0dp"
         android:layout_weight="40"
        android:src="@drawable/logo_line" />
    </LinearLayout>
    <TextView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="20" />
    </LinearLayout>