Reset Button for draggable images

[Scruffy]

I am creating a fairly simple app with several draggable images in a view, and I want a reset button which will reset all the images to their original positions. Can anyone help with the code for this, or point me to some useful resources?

Thanks in advance.

ps my code in the .m file looks like this:


- (void)touchesMovedNSSet *)touches withEventUIEvent *)event {

UITouch *touch = [[event allTouches] anyObject];

if ([touch view] == img13) {
CGPoint location = [touch locationInView:self.view];
img13.center = location;
}

if ([touch view] == img14) {
CGPoint location = [touch locationInView:self.view];
img14.center = location;
}

if ([touch view] == img15) {
CGPoint location = [touch locationInView:self.view];
img15.center = location;
}

[Bobarino]

- (IBAction)buttonPressed {
image.center = CGPointMake (x,y);
}

[Scruffy]

Hi there,
Excellent, i got it working now. I have just one other issue i am unable to solve so far; when i grab an image to drag it, as soon as i start moving it the image jumps so that it's centre moves to the cursor [on my IOS Simulator]. The drag action still works, it just looks a bit sloppy, or jumpy, instead of smooth. Any ideas?

(Thanks Bobarino

Originally Posted by Bobarino

- (IBAction)buttonPressed {
image.center = CGPointMake (x,y);
}

[architectpianist]

Instead of

CGPoint location = [touch locationInView:self.view];
img.center = location;

use

CGPoint location = [touch locationInView:self.view];
[UIView animateWithDuration:0.3 animations:^{
	img.center = location;
}];

[Scruffy]

Thanks architectpianist, but i can't get that code to work; the image can be dragged, but it still jumps when i begin dragging it.

scruffy

Originally Posted by architectpianist

Instead of

CGPoint location = [touch locationInView:self.view];
img.center = location;

use

CGPoint location = [touch locationInView:self.view];
[UIView animateWithDuration:0.3 animations:^{
	img.center = location;
}];

[Bobarino]

this should help...

Part 1

iPhone SDK Tutorial: Making An Image Dodging Game (Part 1) - YouTube

Part 2

iPhone SDK Tutorial: Making An Image Dodging Game (Part 2) - YouTube

Part 3

iPhone SDK Tutorial: Making An Image Dodging Game (Part 3) - YouTube

[Duncan C]

Originally Posted by Scruffy

Thanks architectpianist, but i can't get that code to work; the image can be dragged, but it still jumps when i begin dragging it.

scruffy

I would suggest not moving the image location to the point the user touches, but instead, detecting a dragging motion, and offsetting the image location by the amount the user drags.

UIGestureRecognizers make this much easier. Do a search in Xcode on "touches" and download the sample app with that name. That will get you 2 projects, one that does it the old way, with touchesBegan/touchesMoved, and the other that uses gesture recognizers. Take a look at the gesture recognizer one.

[Scruffy]

Hi Guys,
Thanks for your help. I have followed all advice and tried out all the above suggestions but unfortunately i don't know enough to make any of them work. However i found an example by Navaneethan Thambu called MyDragApp which i can get to work so i will follow that trail for the moment. It uses the older method but it works and as a novice at this thats all i can go by atm.

Thanks again, and catch you all later

[Scruffy]

Hi Duncan,
Regarding the Touches app that you recommended, i have found some of the things i need in an app, using UIGestureRecognizers, but i cannot set Touches into landscape mode. I can make it turn to the right, but the images move 90 degrees as well. I have spent some days on this, exploring lots of image movement apps trying to find one that does all the things i need it to do and i have found all the elements i need, but not all in the one app. Anyway, thanks for your help.

Originally Posted by Duncan C

I would suggest not moving the image location to the point the user touches, but instead, detecting a dragging motion, and offsetting the image location by the amount the user drags.

UIGestureRecognizers make this much easier. Do a search in Xcode on "touches" and download the sample app with that name. That will get you 2 projects, one that does it the old way, with touchesBegan/touchesMoved, and the other that uses gesture recognizers. Take a look at the gesture recognizer one.

[Duncan C]

Originally Posted by Scruffy

Hi Duncan,
Regarding the Touches app that you recommended, i have found some of the things i need in an app, using UIGestureRecognizers, but i cannot set Touches into landscape mode. I can make it turn to the right, but the images move 90 degrees as well. I have spent some days on this, exploring lots of image movement apps trying to find one that does all the things i need it to do and i have found all the elements i need, but not all in the one app. Anyway, thanks for your help.

Dragging with gesture recognizers has very little to do with auto-rotation. Auto-rotation is a separate issue. If you find one example of how to do it, it's a simple matter to adapt the technique to most applications.

You're unlikely to find a single sample app that does exactly what you want. You need to be able to use samples to learn new techniques, and then adapt and synthesize those techniques into new applications.

[Scruffy]

I know that the following code normally allows for auto-rotation but i just wonder why it doesn't work on the Touches app.

- (BOOL)shouldAutorotateToInterfaceOrientationUIIn terfaceOrientation)interfaceOrientation {
// Return YES for supported orientations
return (YES);
}

Originally Posted by Duncan C

Dragging with gesture recognizers has very little to do with auto-rotation. Auto-rotation is a separate issue. If you find one example of how to do it, it's a simple matter to adapt the technique to most applications.

You're unlikely to find a single sample app that does exactly what you want. You need to be able to use samples to learn new techniques, and then adapt and synthesize those techniques into new applications.

[Duncan C]

Originally Posted by Scruffy

I know that the following code normally allows for auto-rotation but i just wonder why it doesn't work on the Touches app.

- (BOOL)shouldAutorotateToInterfaceOrientationUIIn terfaceOrientation)interfaceOrientation {
// Return YES for supported orientations
return (YES);
}

Touches is a dirt-simple application. It doesn't even have a view controller. (I'm a little surprised the system doesn't complain about that. Newer OS versions expect your app to create a view controller on launch.)

The method shouldAutorotateToInterfaceOrientation is a view controller method.

If you create an app with a view controller, and add your shouldAutorotateToInterfaceOrientation method above, then it should allow the UI to rotate to all user interface orientations. You then need set up the "struts and springs" (resize controls) in your views so that they resize as the window size changes. For most apps, that's all there is to it.

[Scruffy]

Finally got it, thanks to a lot of help and a tutorial. Added Pan Gesture Recognizers from the objects library to the image containers on the storyboard, added some code and hooked it up and it works!

The code looks like this:

In ViewController.h ---->

- (IBAction)handlePanUIPanGestureRecognizer *)recognizer;


In ViewController.m ---->


- (IBAction)handlePanUIPanGestureRecognizer *)recognizer {

CGPoint translation = [recognizer translationInView:self.view];
recognizer.view.center = CGPointMake(recognizer.view.center.x + translation.x,
recognizer.view.center.y + translation.y);
[recognizer setTranslation:CGPointMake(0, 0) inView:self.view];

}

Then you select the UIPanGestureRecongizer in Interface Builder, bring up the Connections inspector, and drag a line from the selector to the View Controller, and choose handlePan and thats it.
Now everything works smoothly, and it rotates too

Thanks again
Scruffy

Originally Posted by Duncan C

Touches is a dirt-simple application. It doesn't even have a view controller. (I'm a little surprised the system doesn't complain about that. Newer OS versions expect your app to create a view controller on launch.)

The method shouldAutorotateToInterfaceOrientation is a view controller method.

If you create an app with a view controller, and add your shouldAutorotateToInterfaceOrientation method above, then it should allow the UI to rotate to all user interface orientations. You then need set up the "struts and springs" (resize controls) in your views so that they resize as the window size changes. For most apps, that's all there is to it.

[kmt]

Hi Scuffy/Duncan,

So, I am using this same code but, getting some very odd reactions. When I pan up down, the view moves left and right. When I pan left/right, the view moves up and down. If I change the code (flip the x and y's) to below, it at least works up down but, then the pan left move it right and the pan right moves it left.

I am dropping the action on the 'whole' view. IE: not just an image view but attaching it to the main view by highlighting the outside of the outline in the .xib file.

Anyone encounter anything strange like this? Happens on both the simulator and the iPad.

- (IBAction)handlePanUIPanGestureRecognizer *)recognizer {
CGPoint translation = [recognizer translationInView:recognizer.view];
recognizer.view.center = CGPointMake(recognizer.view.center.x + translation.y, recognizer.view.center.y + translation.x);
[recognizer setTranslation:CGPointMake(0, 0) inView:recognizer.view];
}

Originally Posted by Scruffy

Finally got it, thanks to a lot of help and a tutorial. Added Pan Gesture Recognizers from the objects library to the image containers on the storyboard, added some code and hooked it up and it works!

The code looks like this:

In ViewController.h ---->

- (IBAction)handlePanUIPanGestureRecognizer *)recognizer;


In ViewController.m ---->


- (IBAction)handlePanUIPanGestureRecognizer *)recognizer {

CGPoint translation = [recognizer translationInView:self.view];
recognizer.view.center = CGPointMake(recognizer.view.center.x + translation.x,
recognizer.view.center.y + translation.y);
[recognizer setTranslation:CGPointMake(0, 0) inView:self.view];

}

Then you select the UIPanGestureRecongizer in Interface Builder, bring up the Connections inspector, and drag a line from the selector to the View Controller, and choose handlePan and thats it.
Now everything works smoothly, and it rotates too

Thanks again
Scruffy