CODEWITHSUNDEEP
androidandroid-layout
David McRae
David McRae

Reputation: 24

Android View Layout

I am trying to create a bar at the top of my android app that has three buttons and a logo, one button on the far left, logo centered, and two buttons on the right side. My issue is that the two buttons on the right side are overlapping, how do I get them both to be on the right side but not stacked?

Here is my XML structure for the view:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="fill_parent" 
          android:layout_height="42px" 
          android:orientation="horizontal"
          android:background="@drawable/header_background">

    <RelativeLayout
         android:layout_width="fill_parent"
         android:layout_height="fill_parent" >

    <Button android:id="@+id/button_menu"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""
        android:background="@drawable/menu_button"
        android:layout_gravity="left"
        android:layout_alignParentLeft="true" />

    <ImageView
            android:id="@+id/imageViewLogo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/logo_white" 
            android:layout_centerInParent="true"/>

    <Button android:id="@+id/button_camera"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""
        android:background="@drawable/camera_button"
        android:layout_gravity="right"
        android:layout_alignParentRight="true" />

    <Button android:id="@+id/button_switch"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""
        android:background="@drawable/two_up_button"
        android:layout_gravity="right"
        android:layout_alignParentRight="true" />

    </RelativeLayout>
</LinearLayout>

Any advice would be great! Thanks.

Upvotes: 0

Views: 140

Answers (3)

confused_at_times
confused_at_times

Reputation: 545

I think your first button (button_camera) needs to be aligned to the right of button_switch using layout_toRightOf="@id/button_switch.

Upvotes: 1

David McRae
David McRae

Reputation: 24

Just needed another RelativeLayout-

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="fill_parent" 
          android:layout_height="42px" 
          android:orientation="horizontal"
          android:background="@drawable/header_background">

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

    <Button android:id="@+id/button_menu"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""
        android:background="@drawable/menu_button"
        android:layout_gravity="left"
        android:layout_alignParentLeft="true" />

    <ImageView
            android:id="@+id/imageViewLogo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/bloom_logo_white" 
            android:layout_centerInParent="true"

            />

    <Button android:id="@+id/button_camera"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""
        android:background="@drawable/camera_button"
        android:layout_gravity="right"
        android:layout_alignParentRight="true" />

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/button_camera">

            <Button android:id="@+id/button_switch"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text=""
       android:background="@drawable/two_up_button"
       android:layout_gravity="right"
       android:layout_alignParentRight="true" />
    </RelativeLayout>

</RelativeLayout>
</LinearLayout>

Upvotes: -1

DroidBender
DroidBender

Reputation: 7892

Both button_switch and button_camera are aligned right inside the parent as the obvious attribute states: android:layout_alignParentRight="true"

Use the attributes layout_toLeftOf or layout_toRightOf to specify in detail.

Upvotes: 1

Related Questions