How do I create an ImageView in java code, within an existing Layout?

Question

I'm looking for an easy way for the user to see how many drinks they've had for a BAC calculator.

Picture of the app:

On button press, I would like an image to be added to the screen, directly under the spinner and with left alignment. When I press the button again, I want another image to be added to the screen.

So if I pressed the add beer button, a drawable of a beer would appear below the spinner. If I pressed the add beer button again, I want there to be TWO drawables of beers under the spinner, preferably with them being added from the right.

(Also, having them reach their width limit, wrapping around, and starting again on the left, but below a full line, would be AWESOME)

I can't figure out how to do this. I assume adding a ImageView in code to a relative layout (because it needs to be positioned to the right) would be the best route, but if it's possible in xml I'd be more than happy to use that. Any help?

Solution

In the button's click callback, create an ImageView object, set the bottle image, and position it. For example (I'm assuming the names of your elements):

ImageView imageView = new ImageView(this);
imageView.setImageResource(R.drawable.beerbottle);

RelativeLayout relativeLayout = (RelativeLayout) findViewById(R.id.RelativeLayout01);
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(
    RelativeLayout.LayoutParams.WRAP_CONTENT,
    RelativeLayout.LayoutParams.WRAP_CONTENT
);
layoutParams.addRule(RelativeLayout.BELOW, R.id.ButtonRecalculate);
layoutParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);

relativeLayout.addView(imageView, layoutParams);

I haven't tested this, mind you, but it should give you a good start. You'll probably need to add other parameters to the ImageView and possibly to the LayoutParams to make it look good, plus tracking how many bottles are displayed, etc.

Comments

[Dan T]

Ah! Nearly! Only the top line "ImageView iv = new ImageView(this);" throws an exception "The constructor ImageView () is undefined."

[Dan T]

I can replace "this" with "null" and it runs but then the picture doesn't show up...

[Jeffrey]

Ah yes, it's in the callback so it lacks the appropriate Context. Replace "this" with "ParentActivity.this", where ParentActivity is the Activity class that you're setting the listener in.

[Dan T]

Brilliant! Now when I try to make more than one (reclicking the button) it piles on top of itself. Can I put in a rule about it being RIGHT_OF itself?

[Jeffrey]

You probably want to set a unique id for each ImageView you create, store them, and then set the new ones to be RIGHT_OF the last one added.

[Dan T]

I figured how to add multiples: just embedded a LinearLayout within the Relative one... now to figure out how to get it to goto a new line when it reaches the end.

[Dan T]

Got it! created a overflow variable and when it hit the max number that the screen could hold i told it to print to ANOTHER linearlayout below that one! Thanks so much Daniel!

[Jeffrey]

Ah, duh, LinearLayout - I should have thought of that ;-P So glad you got it to work! My pleasure.