I would like to change an image each time the user touches the screen. I would like to have user tap the screen and the image changes each time and at the 5th touch it would loop back to the original image with added text.
I have looked at
How would I set an ImageButton to change only when my finger is touching it
I have tried both IUevents and StateListdrawable. I couldn't figure out how to actually change the image after each touch (anywhere in the screen).
And why can't you use the normal ImageView? Do this:
ArrayList<Integer> picList = new ArrayList<Integer>();
// populate the list with the int value of the pictures in drawable.
picList.add(R.drawable.apple);
picList.add(R.drawable.horse);
//etc
int touches = 0;
int loop = 0;
ImageView picture = (ImageView) findViewById(R.id.your_picture);
picture.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if (touches < 4)
v.setBackgroundDrawable(picList.get(touches));
touches++;
} else {
touches = 0;
loop = 1;
v.setBackgroundDrawable(picList.get(touches));
}
if (loop = 1){
// Create a TextView and set the text or make it in the xml with Visible="Gone" and make is visible here.
}
});
you need to create the Custom class which extends the ImageView now display this imageview to whole screen.
> First store the path/location of images into an array/list etc.
> In custom class implement the onTouch event.
> create the counter object in this custom class.
> now in onTouch check in down event that check the counter value with array size if counter==array.length()-1 then set counter as 0 otherwise increment in counter object.
> now get the path of the image and set into the imageview as background
Related
I have the following scenario:
In a layout, I have imageviews aligned horizontally and vertically as shown in image.
First, which layout should be used for this purpose? RelativeLayout or FrameLayout? ListView inside the layout?
Also, instead of writing setOnClickListener for every imageview, how can I write just one click listener to get the clicked imageview?
A GridView is perfect for this. For more information on GridView, look here.
As for your onClickListener question: there is no easy way to do this, but what you can do is something like this:
Have an array containing every ImageView id like so:
public static final int[] IMAGE_VIEWS = {R.id.imageView1, R.id.imageView2, R.id.imageView3 /*etc*/}; //Make sure to list from the first imageview to the last image view in correct order
Define an onClickListener
private View.OnClickListener imageViewListener = new View.OnClickListener() {
#Override
public void onClick(View v) {
for (int i = 0; i < IMAGE_VIEWS.length; i++) {
if (v.getId() == IMAGE_VIEWS[i]) {
doSomethingWithImageViewClick(i); //if ImageView 4 was clicked, variable 'i' will be 3 (because arrays start at index = 0).
}
}
}
}
Set the onClickListeners for all your imageViews:
final ImageView view1 = (ImageView) view.findViewById(R.id.imageView1);
view1.setOnClickListener(imageViewListener);
//etc
Use 'GridView' in the layout and use 'setOnItemClickListener' to handle click events,
You can find more details in below link
GridView.
GridView can achieve the effect. I think you can look at this Grid View.
I have 15 ImageView where I assign a 'shape' as background. What I want to achieved is when I click these ImageViews, the shape's stoke property will change from 0dp to 4dp. But when I clicked the ImageView again, it will turn back to 0dp. I also want to limit the number of ImageView that can be clicked. For example, If I have clicked 8 ImageView already (that changes their stroke property from 0dp to 4dp), it won't allow me to change others ImageView stroke property anymore, unless I clicked one ImageView (that will removed it's 2dp stroke and will reset it to 0dp).
This is the code I have so far. Which allows me to click the ImageViews and change their stroke property to 4dp. I am googling/stackoverflow for solutions but can't find one. Hope you can help me.
private int[] colors = {R.color.filter_dark_blue, R.color.filter_rouge, R.color.filter_blue, R.color.filter_burgundy,
R.color.filter_turquoise, R.color.filter_navy, R.color.filter_green, R.color.filter_black,
R.color.filter_yellow, R.color.filter_charcoal, R.color.filter_orange, R.color.filter_grey,
R.color.filter_warm_red, R.color.filter_white, R.color.filter_pink};
private ImageView[] color = new ImageView[colors.length];
for (int i = 0 ; i < color.length ; i++) {
color[i] = (ImageView) findViewById(ivCirclesId[i]);
final GradientDrawable ivCircleOnClick = (GradientDrawable) color[i].getBackground();
color[i].setOnClickListener(new OnClickListener() {
public void onClick(View v) {
ivCircleOnClick.setStroke(4, Color.WHITE);
}
});
}
here is snippet,
some quick ideas ...
1- use the setTag(Object) and getTag() to set 0/1 value, as clicked flag
color[i] = (ImageView) findViewById(ivCirclesId[i]);
final GradientDrawable ivCircleOnClick = (GradientDrawable) color[i].getBackground();
//add this
color[i].setTag("0");//not clicked when created.
2- use global variable as counter for total clicked images, to control the limit 8 issue, if its set to 4 then increment the counter ++counter, if reset to 0, decrement the counter --counter, and change setTag()
public void onClick(View v) {
if(v.getTag().toString().equals("1")){
--clicked;
v.setTag("0");
ivCircleOnClick.setStroke(0, Color.WHITE);
}else{
if(clicked >= 8){
//max limit reached, nothing to do... add toast if you want ...
return;
}
++clicked;
v.setTag("1");
ivCircleOnClick.setStroke(4, Color.WHITE);
}
}
I have a task to show 5 images periodically. I'm using ViewFlipper for this. The images are loaded dynamically from gallery or camera.
I got stuck with modifying the image source at runtime i.e user should be able to change the current image he is viewing.
I can get the current index, now I want to change the image source from gallery at run time
// code to initialise the flipper
vf_profile_slide = (ViewFlipper) this.findViewById(R.id.profile_slide_vf);
int gallery_grid_Images[]={R.drawable.image1,R.drawable.image2};
for(int i=0;i<gallery_grid_Images.length;i++)
{
setFlipperImage(gallery_grid_Images[i]);
}
/* tempBmp = BitmapFactory.decodeFile(imgPath);
addNewImageToFlipper(mContext, tempBmp);
*/
vf_profile_slide.setAutoStart(true);
vf_profile_slide.setFlipInterval(5000);
vf_profile_slide.startFlipping();
//On button click i m feteching the image index
PROFILE_INDEX = vf_profile_slide.getDisplayedChild();
//calling this function...
private void addImageToFlipperAt(Context mContext,int index,Bitmap bm)
{
ImageView iv_new = (ImageView) findViewById(vf_profile_slide.getChildAt(index).getId());
iv_new.setImageBitmap(bm);
vf_profile_slide.addView(iv_new,index);
}
the new image is added successfully.... but i want the current image at that index gone... that is not happening .... tell me where i m going wrong
Is this possible?
I am overlapping couple of view's dynamically in my app over a bitmap. I would like to delete those view's before saving the bitmap to gallery. Below in the function which adds view's on my bitmap
public void add()
{
relLayout.addView(newRect);
relLayout.addView(newSpeech);
relLayout.addView(editImgv);
relLayout.addView(resizeImgv);
}
There is a button on pressing it the above add() function gets called and all those views get added over my bitmap again.
Before saving the bitmap I would like to delete all editImgv and resizeImgv which were added
over my bitmap.
Any ideas on how to do it?
Thanks in advance :)
I have resolved it by using Vector arrays - I placed all the 'resizeImgv' and 'editImgv' image views which I am adding dynamically in a vector array of type 'ImageView' and when I am about to save I am just setting their visibility to 'GONE' one by one. It was a simple solution in the end :)
//Global
Vector<ImageView> imgv = new Vector<ImageView>();
....
//Adding views to my vector array
public void setImageViewArray(ImageView imgview){
imgv.add(imgview);
}
.....
//when I am about to save
for(int i = 0; i < imgv.size(); i++ ){
if(imgv.get(i).getVisibility() == View.VISIBLE){
imgv.get(i).setVisibility(View.GONE);
}
}
i have a simple game ..theres a snow move down and a penguin in bottom layout ..we must protec the penguin from falling snow
And i want to ask you
how we can destroy the imageview (snow pictures) when we click it?
i set:
lebah2.setVisibility(View.GONE);
but it just hidding ..because i create a timer to check the collision ..when the snow collision with penguin so the live is minus one ..if i put this code, the timer will always decrease live ..
for(int awal = 1 ; awal<=akhir; awal++)
{
ImageView lebah2 = (ImageView) findViewById(awal);
int atas = lebah2.getTop();
int left = lebah2.getLeft();
if(atas >=180)
{
if(left >180 && left <240)
{
data.live--;
TextView nyawa = (TextView) findViewById(R.id.live);
nyawa.setText(String.valueOf(data.live));
lebah2.setVisibility(View.GONE);
}
}
what must i do?
You can remove the view like this:
((LinearLayout)lebah2.getParent()).removeView(lebah2);
you can also just skip the loop if the view is not visible:
if(iv.getVisibility() == View.VISIBLE) {
for(int awal = 1 ; awal<=akhir; awal++) {
//Check if collision
}
}
The view is not removed when you set the visibility as GONE. For exemple If you get all childs for a parent the view will be counted.
Use This:
ImageView lebah2 = (ImageView) findViewById(R.id.lebah2);
((RelativeLayout)lebah2.getParent()).removeView(lebah2);