CODEWITHSUNDEEP
androidimageview
Moyeen
Moyeen

Reputation: 469

Android: Display image over an Image in ImageView

I'm using LinearLayout to place two ImageView horizontally. I have image placed on ImageView. Now I need to add an small image over the image on ImageView. I have seen a lot of post but all of them deals with Relativelayout or Framelayout. Here is the XML code segment that I have used.

<LinearLayout
    android:id="@+id/relativeLayout2"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dip"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/imgmode31"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="10dp"
        android:adjustViewBounds="true"
        android:maxHeight="180dp"
        android:maxWidth="140dp"
        android:scaleType="fitXY"
        android:src="@drawable/i5" >
    </ImageView>

    <ImageView
        android:id="@+id/imgmode32"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:longClickable="false"
        android:maxHeight="180dp"
        android:maxWidth="280dp"
        android:scaleType="fitXY"
        android:src="@drawable/i1" >
    </ImageView>

</LinearLayout>

Any help will be highly appreciated.

Upvotes: 1

Views: 8306

Answers (3)

Siddhesh
Siddhesh

Reputation: 1380

you can do it easily with relative layout

<RelativeLayout 
android:id="@+id/relativeLayout2" 
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
    <ImageView     
     android:layout_height="wrap_content"     
     android:layout_width="wrap_content"   
     android:adjustViewBounds="true" 
     android:scaleType="fitXY"
     android:src="@drawable/i5"
     android:id="@+id/imgmode31" 
     android:maxHeight="180dp" 
     android:maxWidth="140dp">
   </ImageView>
   <ImageView     
     android:layout_height="wrap_content"     
     android:layout_width="wrap_content"  
     android:scaleType="fitXY" 
     android:longClickable="false"  
     android:adjustViewBounds="true" 
     android:src="@drawable/i1" 
     android:id="@+id/imgmode32" 
     android:maxHeight="180dp" 
     android:maxWidth="280dp">
   </ImageView>
</RelativeLayout>

if you want ImagView to overlap each other then make their Height and Width same and you can also bring any of the ImageView at front in runtime

Upvotes: 1

cstrutton
cstrutton

Reputation: 6187

This is exactly what a linear layout is supposed to prevent. You may however be able to override the positioning of the next element using negative padding. The problem with that is what happens on different screen densities.

I think this is what a surface view is meant for. It provides a transparent drawing surface over the entire screen allowing you to draw in top of other views.

One last idea would be to place your first image in a frame layout inside your linear layout. Then you could add your superimposed image to the frame layout using padding to position it.

Upvotes: 1

K-ballo
K-ballo

Reputation: 81349

A LinearLayout places elements linearly, one next to the other. If you want to place an element on top of another, then you need to resort to a FrameLayout or RelativeLayout.

If you change your LinearLayout to a FrameLayout you should see the two ImageViews overlapping.

Upvotes: 0

Related Questions