How can I rotate image/sprite with touch on spriteKit? - objective-c

I am trying to make a sprite rotate with one finger touch. Honestly, i have no idea how to do it, new to spriteKit.
Any ideas?

This would rotate the sprite to where you touch using an action. If you'd want it to rotate while dragging the finger. You should remove the action and do the calculation on the touchesMoved: instead.
-(void)didMoveToView:(SKView *)view {
sprite = [SKSpriteNode spriteNodeWithImageNamed:#"Spaceship"];
sprite.xScale = 0.5;
sprite.yScale = 0.5;
sprite.position = CGPointMake(self.frame.size.width / 2, self.frame.size.height/2);
[self addChild:sprite];
}
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
for (UITouch *touch in touches) {
CGPoint location = [touch locationInNode:self];
float dY = sprite.position.y - location.y;
float dX = sprite.position.x - location.x;
float angle = atan2f(dY, dX) + 1.571f;
[sprite runAction:[SKAction rotateToAngle:angle duration:0.5 shortestUnitArc:YES]];
return;
}
}
Alternatively: (Remember to remove the code from the touchesBegan:
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{
for (UITouch *touch in touches) {
CGPoint location = [touch locationInNode:self];
float dY = sprite.position.y - location.y;
float dX = sprite.position.x - location.x;
float angle = (atan2f(dY, dX)) + 1.571f;
sprite.zRotation = angle;
}
}

Related

find the distance between two CG points?

I am using these methods and these variables
CGPoint touchBegan;
CGPoint touchEnd;
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
}
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{
}
- (void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
}
But I can not get the distance between two points. For example draw a line with your finger and get the distance between a CGPoint touchBegan and CGPoint touchEnd
Any help is appreciated thanks
It doesn't seem to exist any method or function that do this directly, you must take the difference of the two points coordinates and use pythagorean theorem:
CGPoint touchBegan;
CGPoint touchEnd;
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
UITouch* touch= [touches anyObject];
touchBegan= [touch locationInView: self.view];
}
- (void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch* touch= [touches anyObject];
touchEnd= [touch locationInView: self.view];
CGFloat dx= touchBegan.x - touchEnd.x;
CGFloat dy= touchBegan.y - touchEnd.y;
CGFloat distance= sqrt(dx*dx + dy*dy);
< Do stuff with distance >
}
Just implement your own rendition of the Pythagorean theorem. For example:
CGPoint translation = CGPointMake(endPoint.x - startPoint.x, endPoint.y - startPoint.y);
CGFloat distance = sqrtf(translation.x * translation.x + translation.y * translation.y);
Or, better, as Rob Mayoff pointed out, use the Math.h hypotf method:
CGFloat distance = hypotf(translation.x, translation.y);

Objective C: fix distance between images in touches moved

How could i set up my images(points) with same fix distance to new image(point) when performing a touches moved?
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
CGPoint touchLocation = [touch locationInView:touch.view];
UIImageView *imageView=[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"Crayon_Black.png"]];
imageView.center = touchLocation;
[drawImage addSubview:imageView];
}
I hope this make sense. I just need to finish my school project. Thanks guys in advance.
This solution works as long as you don't move finger too fast:
#interface ViewController : UIViewController {
CGPoint lastLocation_;
CGFloat accumulatedDistance_;
}
...
-(CGFloat) distanceFromPoint:(CGPoint)p1 ToPoint:(CGPoint)p2 {
CGFloat xDist = (p2.x - p1.x);
CGFloat yDist = (p2.y - p1.y);
return sqrt((xDist * xDist) + (yDist * yDist));
}
-(void) addImageAtLocation:(CGPoint)location {
UIImageView *imageView=[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"Crayon_Black.png"]];
imageView.center = location;
[self.view addSubview:imageView];
}
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
[super touchesBegan:touches withEvent:event];
lastLocation_ = [[touches anyObject] locationInView:self.view];
accumulatedDistance_ = 0;
[self addImageAtLocation:lastLocation_];
}
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
CGPoint touchLocation = [touch locationInView:self.view];
CGFloat distance = [self distanceFromPoint:touchLocation ToPoint:lastLocation_];
accumulatedDistance_ += distance;
CGFloat fixedDistance = 40;
if (accumulatedDistance_ > fixedDistance) {
[self addImageAtLocation:touchLocation];
while (accumulatedDistance_ > fixedDistance) {
accumulatedDistance_ -= fixedDistance;
}
}
lastLocation_ = touchLocation;
}

Rotating OpenGL-ES object

After many hours of struggle i was finally able to draw a object, but got stuck when it came to rotating. I am trying to make a rotation around the y-axis, but i cannot seem to make the rotation smooth in any way. Its pretty much jumping around. There might be some bits and pieces of uneccessary in between hence i used a template.
- (void)update
{
float aspect = fabsf(self.view.bounds.size.width / self.view.bounds.size.height);
GLKMatrix4 projectionMatrix = GLKMatrix4MakePerspective(GLKMathDegreesToRadians(65.0f), aspect, 0.1f, 100.0f);
self.effect.transform.projectionMatrix = projectionMatrix;
GLKMatrix4 baseModelViewMatrix = GLKMatrix4MakeTranslation(0.0f, 0.0f, -4.0f);
// Compute the model view matrix for the object rendered with ES2
GLKMatrix4 modelViewMatrix = GLKMatrix4MakeTranslation(0.0f, 0.0f, 0.0f);
modelViewMatrix = GLKMatrix4Rotate(modelViewMatrix, startPoint.y, 0.0f, 1.0f, 0.0f);
dx = dy = 0;
modelViewMatrix = GLKMatrix4Multiply(baseModelViewMatrix, modelViewMatrix);
_normalMatrix = GLKMatrix3InvertAndTranspose(GLKMatrix4GetMatrix3(modelViewMatrix), NULL);
_modelViewProjectionMatrix = GLKMatrix4Multiply(projectionMatrix, modelViewMatrix);
_rotation += self.timeSinceLastUpdate * 0.5f;
}
And my touch behaviours:
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
startPoint = [touch locationInView:self.view];
}
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
CGPoint point = [touch locationInView:self.view];
dx = point.y - startPoint.y;
dy = point.x - startPoint.x;
startPoint = point;
}
- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
}
Thanks in advance.
going through the below link of apple library it can be solve your problem
[http://developer.apple.com/library/ios/#samplecode/GLSprite/Introduction/Intro.html#//apple_ref/doc/uid/DTS40007325

Rotate UIView based on position in superview

I have a UIImageView that is an arrow image. I added this view to a parent view with a frame of 500x500 dimensions. I want to rotate the UIImageView so that the arrow is always pointing to the center of its parent when the user touches and moves it around.
I was looking into CGAffineTransform and trigonometry rotations, but I'm having trouble getting started. Can anyone provide some insight?
Thanks!
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];
CGPoint point = [touch locationInView:self];
pointerView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"pointer.png"]];
pointerView.layer.anchorPoint = CGPointMake(0, 0.5);
pointerView.center = point;
[self setPointerRotation];
[self addSubview:pointerView];
[pointerView release];
}
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];
CGPoint point = [touch locationInView:self];
pointerView.center = point;
[self setPointerRotation];
}
- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
[pointerView removeFromSuperview];
pointerView = nil;
}
- (void)setPointerRotation {
CGAffineTransform transform = // calculate rotation so that pointerView points to the center of the superview
pointerView.transform = transform;
}

How to drag only one image with iPhone SDK

I want to create a little app that takes two images and i want to make only the image over draggable.
After research, i found this solution:
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [[ event allTouches] anyObject];
image.alpha = 0.7;
if([touch view] == image){
CGPoint location = [touch locationInView:self.view];
image.center = location;
}
It works but the problem is that the image is draggable from its center and I don't want that.
So I found another solution:
- (void) touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event {
// Retrieve the touch point
CGPoint pt = [[touches anyObject] locationInView:self.view];
startLocation = pt;
[[self view] bringSubviewToFront:self.view];
}
- (void) touchesMoved:(NSSet*)touches withEvent:(UIEvent*)event {
// Move relative to the original touch point
CGPoint pt = [[touches anyObject] locationInView:self.view];
frame = [self.view frame];
frame.origin.x += pt.x - startLocation.x;
frame.origin.y += pt.y - startLocation.y;
[self.view setFrame:frame];
}
It works very well but when I add another image, all the images of the view are draggable at the same time. I'm a beginner with the iPhone development and I have no idea of how I can only make the image over draggable.
You can use if condition in the touchesBegan: method, See this-
-(void)ViewDidLoad
{
//Your First Image View
UIImageView *imageView1 = [UIImageView alloc]initWithFrame:CGRectMake(150.0, 100.0, 30.0, 30.0)];
[imageView1 setImage:[UIImage imageNamed:#"anyImage.png"]];
[imageView1 setUserInteractionEnabled:YES];
[self.view addSubview:imageView1];
//Your Second Image View
UIImageView *imageView2 = [UIImageView alloc]initWithFrame:CGRectMake(150.0, 200.0, 30.0, 30.0)];
[imageView2 setImage:[UIImage imageNamed:#"anyImage.png"]];
[imageView2 setUserInteractionEnabled:YES];
[self.view addSubview:imageView2];
}
//Now Use Touch begin methods with condition like this
- (void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [[event allTouches]anyObject];
if([touch view] == imageView1)
{
CGPoint pt = [[touches anyObject] locationInView:imageView1];
startLocation = pt;
}
if([touch view] == imageView2)
{
CGPoint pt = [[touches anyObject] locationInView:imageView2];
startLocation = pt;
}
}
//Use same thing with touch move methods...
- (void) touchesMoved:(NSSet *)touches withEvent: (UIEvent *)event
{
UITouch *touch = [[event allTouches]anyObject];
if([touch view] == imageView1)
{
CGPoint pt = [[touches anyObject] previousLocationInView:imageView1];
CGFloat dx = pt.x - startLocation.x;
CGFloat dy = pt.y - startLocation.y;
CGPoint newCenter = CGPointMake(imageView1.center.x + dx, imageView1.center.y + dy);
imageView1.center = newCenter;
}
if([touch view] == imageView2)
{
CGPoint pt = [[touches anyObject] previousLocationInView:imageView2];
CGFloat dx = pt.x - startLocation.x;
CGFloat dy = pt.y - startLocation.y;
CGPoint newCenter = CGPointMake(imageView2.center.x + dx, imageView2.center.y + dy);
imageView2.center = newCenter;
}
}
These two images will move only when you touch on it and move it. I hope my tutorials will help you.
Simply use these two methods
-(void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [[event allTouches] anyObject];
CGPoint location = [touch locationInView:touch.view];
myImage.center = location;
}
-(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
[self touchesBegan:touches withEvent:event];
}
Let's break it down. You should have a main containerView (object of UIView) in your view controller. Within that, you should have DragableImageView objects.
DragableImageView inherits UIImageView and within that, you add your touches code. (Right now you are doing self.frame = position which is wrong - and obviously it will move all images at once - because if I understand correctly, you are adding these touches in your view controller).
Create only DragableImageView first, test it. Then add two DragableImageView instances. test them in different configurations.. you might want to hit test in the containerView to see which DragableImageView should be dragged (e.g. if you have jigsaw pieces, you might want to pick the one that is at the back rather than the front one).