Displaying multiple ImageView in an activity

Question

Basically my android activity displays a Pizza with 4 different toppings represented by 4 imageview over one another and having their visibility set to gone. There are 4 checkboxes that when checked displays the respective imageview by setting it to visible. However the app crashes on the emulator everytime and only when I reduce the imageview to 2 did the activity runs smoothly. I managed to create 3 imageview without crashing but the all the imageview are of low quality and the app has very noticeable lag. So how do you create an app such as mine that displays multiple imageview over one another without forsaking image quality for the sake of saving memory and having lag?

Here's my code:

public class MainActivity extends Activity{

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    CheckBox extracheese = (CheckBox) findViewById(R.id.checkBox1);
    CheckBox pineapple = (CheckBox) findViewById(R.id.checkBox2);
    CheckBox chicken = (CheckBox) findViewById(R.id.checkBox3);
    CheckBox seafood = (CheckBox) findViewById(R.id.checkBox4);


    extracheese.setOnClickListener(new OnClickListener() {
        public void onClick(View v) {
    ImageView extracheesee = (ImageView)findViewById(R.id.imageView2);
        if(((CheckBox) v).isChecked()){
        extracheesee.setVisibility(View.VISIBLE);
    }else{
        extracheesee.setVisibility(View.GONE);
    }
        }
    });

    pineapple.setOnClickListener(new OnClickListener() {
        public void onClick(View vi) {
            ImageView extracheeseee = (ImageView)findViewById(R.id.imageView2);
        if(((CheckBox) vi).isChecked()){
            extracheeseee.setVisibility(View.VISIBLE);
        }else{
            extracheeseee.setVisibility(View.GONE);

    }
        }
    });
    chicken.setOnClickListener(new OnClickListener() {
        public void onClick(View vi) {
            ImageView extracheeseee = (ImageView)findViewById(R.id.imageView3);
        if(((CheckBox) vi).isChecked()){
            extracheeseee.setVisibility(View.VISIBLE);
        }else{
            extracheeseee.setVisibility(View.GONE);
        }
        }
    });

}

}

Have you tested this on a real device? I have noticed that the emulator easily runs out of memory unless you configured it correctly. The fact that it works sometimes on 2 or 3 depending implies it could be a memory allocation issue with the emulator itself. If it still crashes on a device then it could be you are wasting resources and we'd need to see code in order to evaluate it. — , Feb 26 '14 at 19:28
Hey thx for answering! I have posted my code. The code runs fine on the emulator but crashes immediately on my lower-end android phone and logcat shows out of memory error. I just want to confirm does the code above plays a part in taking up huge memory and if so are there any other ways to create a better and more efficient code? — BarryHub20, Mar 02 '14 at 02:58

score 0 · Answer 1 · answered Feb 26 '14 at 23:34

0

I guess you're loading the full sized images into memory (even though you're displaying them in smaller imageViews)? If so, i guess this is your problem.

You probably want to make use of BitmapFactory's inSampleSize to load a scaled-down image into memory.

You only have a few MB of memory to play with in an Android app, so you need to be very mindful of this when dealing with images.

See the docs here: http://developer.android.com/training/displaying-bitmaps/load-bitmap.html

answered Feb 26 '14 at 23:34

Jasongiss

278
1
4
11

Thx for answering! Yup I load high-definition images into scaled-down imageViews. – BarryHub20 Mar 02 '14 at 02:56
Looking at your code, I don't see you manually loading the image data. Are you just using the *android:src* attribute in your layout xml file? Sorry, I thought you had 4 imageViews side by side, but seems they're actually on top of each other, right? I think it's a bad idea to have multiple imageViews already populated with individual images and then show /hide them. It also doesn't scale well at all as you add more images. You should really be using a single imageView, and manually load the image data into it yourself. The link I added above should explain this process. – Jasongiss Mar 02 '14 at 10:34

score 0 · Answer 2 · answered Mar 03 '14 at 04:11

Looking at your code now and previous comments I can see how you might have issues with memory. The first thing is you want your image to be the quality it displayed in. Take use of Android ability to load different quality images into the app depending on the screen size.

Also loading all the images as once and then just marking them as gone will make things a bit more choppy. You are using more memory.

Since you have a single view per layer I'm guessing you'll have a picture covering the whole pizza. Can you have a single image and redraw it multiple times (this would cut down on the amount of memory that needs to be loaded and still render the same image). What I mean by this is for a pepperoni pizza have one pepperoni and paint the pepperoni image multiple times over the pizza instead of having one image with like 20 pepperoni pieces in it. This would drastically improve the speed of your image loading.

Displaying multiple ImageView in an activity

2 Answers2