erijack
erijack

Reputation: 57

Bring an ImageView in front of another?

Is there anyway to bring an ImageView in front of another in android . For example , i have a big image and how i put a small one in the top left of the big ones. Something like the small one will overlap the bigs one . thanks for helping

Upvotes: 4

Views: 29378

Answers (6)

Edward Dunn
Edward Dunn

Reputation: 55

I have tried to do a similar thing with an edit text in front of a linear layout, I found that just placing the XML for the edit text after the XML for the linear layout brought it on top when the app was run. Hope this helps.

Upvotes: 0

Nikola Lukic
Nikola Lukic

Reputation: 4246

For me frameLayout is best choose , Than you will need just to call this line

ImageViewSmall.bringToFront();

no need even for this line , just create from code imageViews first big after small. position x y also with :

ImageViewSmall.setX( float X );
ImageViewSmall.setY( float X );

Upvotes: 3

Houssem
Houssem

Reputation: 36

You can use RelativeLayout; you can test this code, I test it and it works fine:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/relay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >

<ImageView
    android:id="@+id/a_t1"
    android:layout_width="60dp"
    android:layout_height="60dp"
    android:layout_marginLeft="10dp"
    android:background="#000000" />

<ImageView
    android:id="@+id/a_t2"
    android:layout_width="34dp"
    android:layout_height="34dp"
    android:layout_gravity="top|left"
    android:background="#c12fff" />

Upvotes: 0

rcbevans
rcbevans

Reputation: 8882

I used this to create a video "play" overlay over a thumbnail as suggested by Randy.

Here's some slightly more complete code which also makes sure the images are centered in the parent

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center">

    <ImageView
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:id="@+id/ivBackground"
            android:scaleType="fitCenter"
            android:layout_centerInParent="true"
            android:src="@drawable/downloadplaceholder"/>

    <ImageView
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:scaleType="fitCenter"
            android:layout_width="wrap_content"
            android:layout_centerInParent="true"
            android:id="@+id/ivPlayOverlay"
            android:src="@drawable/play_button_overlay"/>
</RelativeLayout>

Upvotes: 0

Qadir Hussain
Qadir Hussain

Reputation: 8856

Use framelayout as your root layout and then place your big image and then your small image

like this

<framelayout
......
......
......>

<ImageView 
// your big image
......
.....
.....>
</ImageView>



<ImageView 
// your Small image
......
.....
.....>
</ImageView>


</framelayout>

Upvotes: 5

Randy
Randy

Reputation: 4381

Wrap the images in a RelativeLayout. Place the image you want on top last in the xml, like so:

<RelativeLayout
    ...>
    <ImageView
        android:background="@drawable/backgroundimage"
        ... />
    <ImageView
        android:background="@drawable/foreground"
        ... />
</RelativeLayout>

Upvotes: 14

Related Questions