Android: Align one button to left and second button to right in same horizontal line

Question

I want to show two buttons in a way that one button should align to the left side of the screen and the other one should align to right side of the screen in same horizontal line. Settings button has aligned to the left but i am not able to right align About button. Here is the activity xml layout:

<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"
tools:context=".MainPageActivity"

 >

<RelativeLayout
    android:id="@+id/relativeLayout1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_marginLeft="95dp"
    android:layout_marginTop="96dp" >
</RelativeLayout>

<TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/relativeLayout1"
    android:layout_alignParentLeft="true"
    android:layout_marginLeft="24dp"
    android:text="@string/welcomeText"
    android:textAppearance="?android:attr/textAppearanceLarge"
    />



<Button android:text="Find out Now!" 
    android:id="@+id/button1" 
    android:background="@drawable/selectbutton" 
    style="@style/FindOutButtonStyle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/textView1"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="54dp"/>

<Button android:text="Settings" 
    android:id="@+id/button2" 
    android:background="@drawable/selectbutton" 
    style="@style/SettingsButtonStyle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/button1"
    android:layout_marginTop="204dp"/>

<Button android:text="About" 
    android:id="@+id/button3" 
    android:background="@drawable/selectbutton" 
    style="@style/AboutButtonStyle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/button1"
    android:layout_toRightOf="@+id/button2"
    android:layout_marginTop="204dp"/>


</RelativeLayout>

strings.xml:

<style name="FindOutButtonStyle">
    <item name="android:layout_width">fill_parent</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:textColor">#ffffff</item>
    <item name="android:gravity">center</item>
    <item name="android:layout_margin">3dp</item>
    <item name="android:textSize">30dp</item>
    <item name="android:textStyle">bold</item>
    <item name="android:shadowColor">#000000</item>
    <item name="android:shadowDx">1</item>
    <item name="android:shadowDy">1</item>
    <item name="android:shadowRadius">2</item>
</style>

<style name="SettingsButtonStyle">
    <item name="android:layout_width">60dp</item>
    <item name="android:layout_height">50dp</item>
    <item name="android:textColor">#ffffff</item>
    <item name="android:gravity">left</item>
    <item name="android:layout_margin">3dp</item>
    <item name="android:textSize">20dp</item>
    <item name="android:textStyle">bold</item>
    <item name="android:shadowColor">#000000</item>
    <item name="android:shadowDx">1</item>
    <item name="android:shadowDy">1</item>
    <item name="android:shadowRadius">2</item>
</style>

<style name="AboutButtonStyle">
    <item name="android:layout_width">60dp</item>
    <item name="android:layout_height">50dp</item>
    <item name="android:textColor">#ffffff</item>
    <item name="android:gravity">right</item>
    <item name="android:layout_margin">3dp</item>
    <item name="android:textSize">20dp</item>
    <item name="android:textStyle">bold</item>
    <item name="android:shadowColor">#000000</item>
    <item name="android:shadowDx">1</item>
    <item name="android:shadowDy">1</item>
    <item name="android:shadowRadius">2</item>
</style>

selectbutton.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
    <shape>
        <solid
            android:color="#449def" />
        <stroke
            android:width="1dp"
            android:color="#2f6699" />
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>
</item>
<item>
    <shape>
        <gradient
            android:startColor="#449def"
            android:endColor="#2f6699"
            android:angle="270" />
        <stroke
            android:width="1dp"
            android:color="#2f6699" />
        <corners
            android:radius="4dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>
</item>
</selector>

Here is the output of above code:

I want to place About button to right side of the screen. Please help.

Answer 1

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:minWidth="25px"
    android:minHeight="25px"
    android:background="@android:color/holo_blue_light">

    <ImageView           
        android:id="@+id/wifiStatusImage"
        android:layout_marginTop ="10dp"     
        android:layout_marginLeft ="10dp"
        android:layout_alignParentLeft="true"
        android:layout_height="60dp"
    android:layout_width="70dp"
    android:src = "@drawable/WifiOn" />

         <ImageView           
        android:id="@+id/SearchP2PDevices"       
        android:layout_marginTop ="0dp" 
        android:layout_marginRight ="10dp"
        android:layout_alignParentRight="true"
        android:layout_height="70dp"
    android:layout_width="70dp"
    android:src = "@drawable/search"
     />
</RelativeLayout>

I have two image views instead of button. Note that android:layout_alignParentRight="true" & android:layout_alignParentLeft="true" will do the work.

Answer 2

Give the About button the attribute android:layout_alignParentRight="true", to make it align on the right margin, and the attribute android:layout_alignParentBottom="true" to make it stay at that bottom, finally remove the android:layout_toRightOf="@id..."

Answer 3

add android:layout_alignParentRight="true" to the about button