I'm making a game which uses multiple UIViews for its displaying of content.
There are 2 UIViews. One of which is a map; another is a plane.
The plane's view is static. It doesn't move, rotate, scale etc.
I'd like to have the map translating under the plane, rotating at the same time. The map's origin (or center point) needs to be set as the plane's center point every frame.
How do I achieve this?
I'm using CGAffineTransform for this, and it works okay, until I want to turn round back on the map once I've left it.
Here's what I'm doing now:
CGAffineTransform oldTransformation = CGAffineTransformTranslate(CGAffineTransformIdentity, 0, frames);
oldTransformation = CGAffineTransformRotate(oldTransformation, rotation);
cityView.transform = oldTransformation;
Any help appreciated.
This blog here talks about using CAAnimationGroup to apply multiple animations (center point, rotation, and bounds) at the same time. It includes a sample application which you can get on github here. (Note: run the app in iPad simulator).
The animation used in that project combines the simultaneous change of center point and rotation of a view.
Hope this helps.
Related
I wish to emulate this effect in Xcode with Swift. After some research I managed to find some articles about drawing smooth curves using a set of points .But I am still unclear about how I could to dynamically modify curves when the user touches/holds the screen.
Question :
I know how to make a smooth Bezier curve, but how can I add gesture recognizers such that by dragging the curve its shape changes.
I only need someone to point me in the right direction. Is there a guide or article in particular that could be useful?
Create transparent ControlPointView for every control point of the curve with a size of 50*50pt, so that users can easily tap them and drag.
Add a small image in the middle of every ControlPointView, so that users can see where the control point is located.
Add UIPanGestureRecognizer on every ControlPointView and handle it in view controller.
Use centers of control points to rebuild UIBezierPath every time gesture recognizer's state is changed.
I’m trying to support both landscape and portrait orientations in my iPhone Cocos2D game, but I’m having trouble getting the coordinates to translate properly.
Here’s what I’m doing so far.
I have a GameWorld layer that I always keep in portrait, regardless of the device orientation. The following code is in my DeviceRotated event for UIDeviceOrientationLandscapeLeft. (‘self’ is my GameWorld layer)
[self runAction:[CCMoveTo actionWithDuration: 0.25f position:ccp(80, 0)]];
[self runAction:[CCRotateTo actionWithDuration:0.25f angle:90]];
So that I don’t have to write different code for each orientation I was hoping to use the following in my Sprite class to translate Sprite coordinates.
CGPoint spriteLoc = ccp(0,0);
CGPoint translatedSpriteLoc = [self.parent convertToNodeSpace:spriteLoc];
self.position = translatedSpriteLoc;
However, this doesn’t work.
If the device is in portrait mode with the sprite in the lower left corner and I rotate the device to the left, the sprite appears in the lower right. I want the sprite to be in the lower left in landscape just like it is in portrait.
Am I missing something or is there a better way to translate coordinates?
Well, if you don't mind a "jump cut" when you switch orientations, you can just use the built-in orientation support within Cocos2d. See this post at the Cocos2d forums.
If, however, you need pretty orientation, you may have to do something along the lines of what you were showing above, orienting things manually via rotation using actions.
Without more detail, it's hard to say why your approach doesn't work, but my guess is that you are seeing the sprite positioning you describe as a result of the fact that if you don't change orientation, the lower left in portrait IS the lower right in landscape when rotated left, i.e., it's the same point in GL space: (0,0). You're going to have to move the "origin point" of your GameWorld Layer as well as rotating it.
Try adding a full-screen image to your layer to see what's actually happening when rotating it. That should help you narrow down what you need to do.
I m trying to do slideshow effect in iPhone as like in iTunes. One Image at the middle and the others at the left and ride side arranged in the manner of floppies in rack. but I not even a single clue for that. Can any one help me out?
I'm guessing that you're talking about "coverflow" rather than "slideshow"... if that's right, there are some libraries to help you: here's one I found by searching for "coverflow replacement":
http://apparentlogic.com/openflow/
You can achieve this effect using the .transform property of CALayers. All iPhone UIViews have a CALayer, and you can apply 3D perspective transformations using a transform matrix like this:
CATransform3D m = CATransform3DIdentity;
m.m34 = -0.006;
[[containerView layer] setSublayerTransform: m];
The views within containerView will now have a perspective distortion applied! Instant coverflow affect. Just move the views to the left and right by changing their frames.
I'm having a performance issue.
I've created an UIView and overwrited it's drawRect function. At this function, I was drawing an image (big one), and over that, an white square at the entire screen with a polygon inside it, with CGContextEOFillPath. The result is an white screen with portion of the image (defined by the polygon) displayed.
After that, I created a function to animate the transition of that polygon to another one. Besides the polygon animation, the image should also be scaled and moved to fix the diplayed at the screen. I did that with an NSTimer. The animation of the polygon consists in calculating the distance between each vertex and moving then to a position according to elapsedTime. It worked just fine at the simulator, but got really stucked at device.
Reading about performance, here at stackoverflow, I found the alternative to use beginAnimations and commitAnimations. I'm changing everything to use that approach with the image. But what can I do with the polygon. The polygon is drawn with CGContextMoveToPoint and CGContextAddLineToPoint, so I believe it can't be animated with beginAnimations. An I correct? Is there a better approach to do that?
The desired result is something like this comic reader app: http://www.comixology.com/iphoneapp (click on guided tour. at the middle of the video they show the "automatic masking" feature)
My suggestion would be to use a CAShapeLayer overlaid on your main image view, with the CAShapeLayer being the size of the view you want to mask and having a polygon path for a hole in the center of it. CAShapeLayers let you animate from one CGPathRef to another smoothly, as long as the two paths have the same number of control points. You will need to use a CABasicAnimation here to do that animating, rather than a UIView begin / commitAnimations block, but it's not too difficult.
Joe Ricioppo has a nice example of animating CAShapeLayer paths in his post here.
With Core Animation you can animate "animatable" (sic) properties. Apple's documentation enumerates animatable properties in Mac OS X:
http://url.akosma.com/55
In the case of the iPhone, the UIView documentation explicitly says "animatable" when a given property is, hum, animatable. The most powerful of these are (IMHO) UIView's "transform" property, which takes CGAffineTransform structs as inputs, or CALayer's "transform" property (which takes CATransform3D structs). Both are animatable and give you tremendous power to create any kind of transition you want.
Now, in your case, indeed, you can't animate the polygon in an "easy" way. My bet would be in your case to try to map CGAffineTransforms that fit your needs (scale, translation) and apply that to a fixed view, non-animated, created using your Quartz code.
I hope I'm clear enough :)
On an iPhone 3Gs, if you click the little "show my location" symbol on the lower left of the window twice, it switches to a mode that causes the map to rotate so that north on the map faces towards north according to the compass. I don't have a 3Gs, so I just found out about this from a buddy who does have one.
I tried applying a rotation transformation to a MKMapView's layer, like this:
CATransform3D rotationTransform = CATransform3DIdentity;
rotationTransform = CATransform3DRotate(rotationTransform, degreesToRadians(-20), 0.0, 0.0, 1.0);
theMapView.layer.transform = rotationTransform;
That sort of works, but not really. The contents of the map do rotate, but the frame rotates and stretches. The map view ends up in a strip that stretches diagonally across the screen, and it ends up under the buttons in my view.
I tried enclosing the map in another view to isolate it, but that doesn't work either. Next I'll try rotating the enclosing view, but I'm hoping somebody else has figured this out. Getting it to work by trial and error is likely to be difficult at best.
Regards,
Duncan C
I have the same problem. I was able to solve the stretching by placing the MkMapView in a UIView container.