Replacing image in UIScrollView on selected item

Question

I created simple UIScrollView that have images. Each time an image pressed i want to change that image, how can I do it?

I creating this UIScrollView and initializing it with NSMutableArray with images.

      UIScrollView *myScroll = [[UIScrollView alloc] initWithFrame: CGRectMake (0,100,200,30)];
        NSMutableArray = *images = [NSMutableArray alloc] initWithObjects: img1,img2,img3,nil];

for (int i=0; i<3; i++)
{
        UIImageView *imageV = [UIImageView alloc];
        [imageV setImage:[images objectAtIndex:i]];
        [myScroll addSubview:imageV];
        [imageV release];
}


    UITapGestureRecognizer *singleTap = [[UITapGestureRecognizer alloc] initWithTarget: self action:@selector (changeImg:)];
    [myScroll addGestureRecognizer: singleTap];

and the toucing I'm cathing with the touched place on the scroll:

- (void) singleTapGestureCaptured:(UITapGesturerecongnizer *) gesture
{
    CGPoint touch = [gesture locationInView:myScroll];

}

By X,Y of touched item i know what image was selected

Here I need to change for example the first image of myScroll...How can i do it?

what is img1,img2,img3 ???? dont say these are `UIImage`. You made me totally confused in `UIImageView` and `UIImage` .... — TheTiger, Sep 22 '12 at 12:43

Rajneesh071 · Answer 1 · 2012-09-22T15:04:35.930

1

Your application will crash because you are accessing the index 3, but there is not any object at index 3.

UIScrollView *myScroll = [[UIScrollView alloc] initWithFrame: CGRectMake (0,100,200,30)];
NSMutableArray = *images = [NSMutableArray alloc] initWithObjects: img1,img2,img3,nil];
[myScroll addSubview:[images objectAtIndex:0];
[myScroll addSubview:[images objectAtIndex:1];
[myScroll addSubview:[images objectAtIndex:2];

Now you can access the image view with tagValue

-(void)changeImg :(UIGestureRecognizer*)recog
{
    UIScrollView *scroll = (UIScrollView*)recog.view;
    CGPoint point = scroll.contentOffset;
    int imagetag = (point.y/scroll.frame.size.height);

    UIImageView *image=(UIImageView*)[[scroll subviews] objectAtIndex:imagetag];
    NSLog(@"Image tag = %d",image.tag);

    image.image=[UIImage imageNamed:@"Icon-72.png"];
}

edited Sep 22 '12 at 15:04

answered Sep 22 '12 at 12:18

Rajneesh071

30,846
15
61
74

Yes you right @Rajneesh071 it will crash, i wrote one extra line to just by copying my code :) (its works fine). But I cant see where exactly i changing the image's with your code, lets say i want to change the second image with `NewImage.png`, where i'm saying to `scrollBar` what item exatclly to change ? – vadim Sep 22 '12 at 12:30
its always printing `tag 0` on each image that i touch... I changed my code followed code above and replaced the `UIGestureRecognizer to` `scrollView` to each `UIImageView`. The `point` in each step is 0. – vadim Sep 22 '12 at 15:24
which scrolling do you have....horizontal or vertical...if horizontal then replace point.y with point.x..and set breakPoint and make changes according to your code...its not task of copy and paste – Rajneesh071 Sep 24 '12 at 05:16

TheTiger · Accepted Answer · 2012-09-22T15:54:15.560

1

Add UITapGestureRecognizer on UIImageView and set its userInractionEnabled: YES which is NO by default for UIImageView.

UIScrollView *myScroll = [[UIScrollView alloc] initWithFrame: CGRectMake (0,100,200,30)];
NSMutableArray = *images = [NSMutableArray alloc] initWithObjects: img1,img2,img3,nil];

for (int i=0; i<3; i++)
{
    //In your question you didn't set `imageView` frame so correct it
    UIImageView *imageV = [[UIImageView alloc]initWithFrame:yourFrame];
    [imageV setImage:[images objectAtIndex:i]];
    [imageV setUserInteractionEnabled:YES];
    UITapGestureRecognizer *singleTap = [[UITapGestureRecognizer alloc] initWithTarget: self action:@selector (changeImg:)];
    [imageV addGestureRecognizer: singleTap];
    [myScroll addSubview:imageV];
    [imageV release];
}

After adding all imageView successfully you get them click like this :-

-(void)changeImg:(id)sender
 {
     UIGestureRecognizer *recognizer = (UIGestureRecognizer*)sender;
     UIImageView *imageView = (UIImageView *)recognizer.view;
     [imageView setImage:[UIImage imageNamed:@"anyImage.png"]];
 }

edited Sep 22 '12 at 15:54

answered Sep 22 '12 at 12:25

TheTiger

13,264
3
57
82

I added the `UITapGestureRecongnizer` to the `scrollView`, so by touching each image i know what image was selected exactly. Can i change for example image atIndex 3 on `myScroll` (edited the question) – vadim Sep 22 '12 at 12:44
You're saying that img1,img2,img3 are `UIImage` and you're able to add them on `scrollView`..... and your array has object at index 0,1,2 how can you use 1,2,3 ..... Please clear your issue. Do you know the difference b/w `UIImage` and `UIImageView` ??? and what is `subView` ?? – TheTiger Sep 22 '12 at 13:00
Yes i know..i posted half of the code, forgot the main loop...please see my edited question again – vadim Sep 22 '12 at 13:03
Now your question make sense :) – TheTiger Sep 22 '12 at 13:05
yeah, sorry for all that, forgot it...as you can see i know each time by the X,Y what image was selected, didn't found an idea how to take image at place 2 after was touched and replace it with `newImage` – vadim Sep 22 '12 at 13:07
1

See my answer now .... no need to compare `scrollView` co-ordinates' you can directly add gesture on `imageView` and can use them on click. – TheTiger Sep 22 '12 at 13:13
looks nice...getting exception on `[imageView setImage:[UIImage imageNamed:@"anyImage.pmg"]];` saying `-[UIScrollView setImage:]: unrecognized selector sent to instance...` – vadim Sep 22 '12 at 13:31
1

I think you have added gesture on scrollView instead of UIImageView thats why you're getting a instance of UIScrollView and getting this type or error.... So plz check code again.... do as above. – TheTiger Sep 22 '12 at 15:57
Many thanks @Vakul!! its working...but the image i'm changing hard coded now,can i know from what image (number) the touch came from so to change image by the selected one? – vadim Sep 22 '12 at 16:06
1

on which imageView you would click it would automatically make its reference .... well if you want to number of clicked imageView then set each imageView tag like imageV.tag = 1; and you can get it in -(void)changeImg:(id)sender method by imageView.tag . – TheTiger Sep 22 '12 at 16:12
Ok!! and option to know if it was pressed already or not? or i need to handle it in a separate variable instance? – vadim Sep 22 '12 at 16:44

score 0 · Answer 3 · answered Sep 22 '12 at 12:18

0

A simple implementation will be, if you use a custom button and change its image on its IBAction.. Still you can addGesture to ur UIImageView too and on the

if(recognizer.state == UIGestureRecognizerStateBegan)

you can change the image on runtime. I hope this helps. Cheers!!

answered Sep 22 '12 at 12:18

Apple_iOS0304

1,092
1
9
19

This is the question...How to change it on runtime, with the recognizer i don't have problems, i can catch every touch on selected item, the problem is changing image X with image Y – vadim Sep 22 '12 at 12:35
when you have added a gesture recogniser on any UIImage. then the method attached to it will be called automatically, here you can check the state of the gesture as "UIGestureRecognizerStateBegan" then in the if block do an image change as per your requirement. here is a link to somewhat your relevance.... its how to build a small photo gallery in iPhone. http://mobile.tutsplus.com/tutorials/iphone/uigesturerecognizer/ I hope this helps you! – Apple_iOS0304 Sep 23 '12 at 06:37

Replacing image in UIScrollView on selected item

3 Answers3