How to properly use weight property?

Question

I want to achieve below layout in which there is a fix space for textview and image.

I am using relative layout,which doesn't have "weight" property. How to achieve below layout using LinearLayout ?

Below is my code

              <RelativeLayout>
                <TextView
            android:id="@+id/txt"
            android:paddingLeft="5dp"               
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"                 
            android:gravity="left" 
            android:textSize="14dp"     
            android:textColor="@android:color/white"/>        

              <TextView
                   android:id="@+id/date_n_time"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content" 
           android:padding="5dp"        
                   android:textColor="#E0FFFF"       
                   android:layout_below="@+id/txt"  />   

               <ImageView  android:id="@+id/imageview"
                   android:layout_height="wrap_content"
                   android:paddingRight="5dp"          
                   android:contentDescription="Image"
                   android:layout_width="wrap_content"          
                   android:layout_alignParentRight="true"
                   android:src="@drawable/icon"/>
      </RelativeLayout> 

I have used RelativeLayout for placing the textview and image like the above image. but textview and imageview are overlapping each other.

Answer 1

You can easily put the TextView to left of your image like this:

android:layout_toLeftOf="@+id/yourimg"

Add margin, and you should be able to easily achieve this layout

Answer 2

You can provide a fixed space by providing padding/margin either to the right of the text view or to the left of the image view. Alternatively if you would like to use an linear layout provide a weight of 7 to the text view and 3 to the image view.

Answer 3

Use LinearLayout with layout_weightSum and layout_weight.

Below is example of to divide the screen in 2 parts vertically.

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" 
        android:layout_weigthSum="1">

     <LinearLayout 
         android:layout_width="fill_parent"
         android:layout_height="0dp"
         android:layout_weight="0.9">

        <ListView
            android:id="@+id/frontpagetasklistid"
            android:layout_width="fill_parent"
            android:layout_height="375dp" >

        </ListView>
        </LinearLayout>
        <LinearLayout 
         android:layout_width="fill_parent"
         android:layout_height="0dp"
         android:layout_weight="0.1">

        <RelativeLayout 
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            >
        <EditText 
            android:id="@+id/edittextidAddTodayTask"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:background="@drawable/edittextselector"
            android:hint="Add Today Task"/>

        <ImageButton
            android:id="@+id/imagebuttonidAddTodayTask"
            android:layout_width="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:src="@drawable/addtask" />

        </RelativeLayout>
        </LinearLayout>

    </LinearLayout>

Answer 4

you should use linearLayout with horizontal orientation, inside put a textView and an imageView, set both layout_width to 0dp, and weight to whatever relative weight you want them to have, for example

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

<TextView 
    android:layout_width="0dip"
    android:layout_height="wrap_content"
    android:layout_weight="4"
/>

<ImageView 
    android:layout_width="0dip"
    android:layout_height="wrap_content"
    android:layout_weight="1"

/>
</LinearLayout>

the textView has a weight of 4, and the imageView has a weight of 1, this means the textview will get 4/5 of the space, and the textView will get 1/5 of the space, just try it out