CODEWITHSUNDEEP
android
Charles W
Charles W

Reputation: 2292

How do you place an item behind another item in android?

I'd like to place an ImageView behind an ImageButton. What's the best way to go about doing this?

Upvotes: 1

Views: 3974

Answers (4)

Stephan Branczyk
Stephan Branczyk

Reputation: 9375

The easiest way is to use an ImageButton only.

ImageButton has a background attribute for the background image

and a src attribute for the image in the foreground.

See this existing example on StackOverflow. 

<ImageButton
    android:id="@+id/ImageButton01"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/album_icon"
    android:background="@drawable/round_button" />

enter image description here

Upvotes: 0

AndyRoid
AndyRoid

Reputation: 5057

Alternatively you can use a RelativeLayout like matiash said:

Here's an example code for a custom header for a navigation drawer containing your profile facebook picture

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:facebook="http://schemas.android.com/apk/res-auto"
android:id="@+id/customHeader"
android:layout_width="match_parent" android:layout_height="match_parent">

 <ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:src="@drawable/green_gradient"/>

<com.facebook.widget.ProfilePictureView
    android:id="@+id/leftPic"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentBottom="true"
    facebook:preset_size="small"
    android:paddingBottom="4dp"
    android:paddingLeft="3dp"
    />

</RelativeLayout>

enter image description here

RESULT

You can add an ImageButton where you would like, just add the following code into your layout

<ImageButton
android:id="@+id/myImageButton
android:layout_width="SET YOUR WIDTH"
android:layout_height="SET YOUR HEIGHT"
android:background="ADD YOUR BACKGROUND" />

Upvotes: 0

panini
panini

Reputation: 2026

I believe the easiest way to do this is to wrap both the ImageView and ImageButton in a FrameLayout. eg:

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/your_image" />
    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center" />
</FrameLayout>

Upvotes: 3

matiash
matiash

Reputation: 55340

You can overlap views in certain layouts (e.g. FrameLayout, RelativeLayout).

Just place both views in the xml layout, so that the overlap (e.g. for FrameLayout, both with width and height as match_parent). The last one you add goes on top.

Upvotes: 1

Related Questions