Stacking 2 Images Android

Question

I have been debugging this issue for the past 6 hours and have simplified my issue to the most simple case (taking out the bulk of my logic). I am trying to stack 2 (chickens) images on top of each other in a view.

I have followed numerous examples including the last answer to : Draw multiple bitmap on a view in android

My activity looks like:

public class FinalDisplay extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_final_display);

    LinearLayout layout = (LinearLayout) findViewById(R.id.activity_final_display);

    ImageView iv = new ImageView(this);
    iv.setBackgroundResource(R.drawable.images);
    layout.addView(iv);

    ImageView iv2 = new ImageView(this);
    iv.setBackgroundResource(R.drawable.images);
    layout.addView(iv2);

}

R.drawable.images is an image of a chicken I took from the Internet and placed in my drawable folder.

http://images3.wikia.nocookie.net/__cb20130606165308/animalcrossing/images/4/41/Chicken.jpg

My xml page looks like

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_final_display"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".FinalDisplay" >

However, only one chicken appears. Any help would be very much appreciated.

how are you supposed to see the image below? is there transparency for this image? — null pointer, Sep 19 '13 at 03:57
Sorry, my mistake. I should have clarified I meant that there should be two images (1 higher up on the page and one on the lower half). Not overlapping. — user1431282, Sep 19 '13 at 04:01
A `LinearLayout` isn't suitable for 'stacking' views; it'll place child views either horizontally or vertically next to each other. In stead, try using a `FrameLayout` or `RelativeLayout`. — MH., Sep 19 '13 at 04:27
setLayoutParams(ViewGroup.LayoutParams(int width, int height)) — JRowan, Sep 19 '13 at 04:30
try this buddy, it may help you.... http://stackoverflow.com/questions/2739971/overlay-two-images-in-android-to-set-an-imageview — Anil kumar, Sep 19 '13 at 05:36

score 1 · Answer 1 · answered Sep 19 '13 at 04:05

1

ImageView iv = new ImageView(this);
iv.setBackgroundResource(R.drawable.images);
layout.addView(iv);

ImageView iv2 = new ImageView(this);
iv2.setBackgroundResource(R.drawable.images);
layout.addView(iv2);

Try that

answered Sep 19 '13 at 04:05

SuNnY_sYeD

513
1
6
19

score 1 · Accepted Answer · answered Sep 19 '13 at 06:08

@MH (in comments) is correct.

Replace the LinearLayout with RelativeLayout. The view which is on top is the view which was last added (or declared in XML).

This should work the way you want it to.

Java:

RelativeLayout layout = (RelativeLayout) findViewById(R.id.activity_final_display);

ImageView iv = new ImageView(this);
iv.setBackgroundResource(R.drawable.images);
layout.addView(iv);

ImageView iv2 = new ImageView(this);
iv.setBackgroundResource(R.drawable.images);
layout.addView(iv2);

XML:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_final_display"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".FinalDisplay" >

Stacking 2 Images Android

2 Answers2