Search code examples
androidxmllayoutgravitylayout-gravity

XML Android layout problems


So I am having problems with some XML layout coding... I am supposed to replicate this image

http://s28.postimg.org/n257m4dil/Untitled.png

but so far I seem to be only able to get this far and the checkout button refuses to stay to the right even when I do use android:gravity="right" to float right within its container... :/

http://s29.postimg.org/bqzspid13/pic3.png

This is the code I have so far:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
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=".CartActivity" >

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
   >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textColor="#FFFFFF"
        android:text="Shopping Cart"
        android:background="@android:color/holo_blue_dark" />

    <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:background="@android:color/holo_blue_light"
         >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Subtotal:" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#800000"
            android:text="£???" />

        <Button
            android:id="@+id/checkout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="right"
            android:text="Checkout" >
        </Button>
    </LinearLayout>
</LinearLayout>


Solution

  • use a android:weightSum="3" for your inner

    Layout with the three elements, and after that,

    android:layout_weight="1" to each view

    this will make the views to hold 1/3 of the available space

    <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:background="@android:color/holo_blue_light"
        android:weightSum="3"
         >
    
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Subtotal:" 
            android:layout_weight="1"/>
    
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#800000"
            android:text="£???"
            android:layout_weight="1" />
    
        <Button
            android:id="@+id/checkout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="right"
            android:text="Checkout" 
            android:layout_weight="1">
        </Button>
    </LinearLayout>
    

    EDIT fill_parent is deprecated use match_parent