Complex CATransition

I am trying to create a CATransition to a UIView.

I want to move the UIView to the right, and at the same time (and always on the same point), rotate it.

It is better explained by the image.

I am able to move it with a CATransition, and also to rotate it with a CABasicAnimation, but I don't know how to do those together.

Thanks.

-(void)scaleAndRotate:(UIImageView*)myView andAngle:(float)angle {

CGAffineTransform scaleTrans = CGAffineTransformMakeScale(1.5,1.5);
CGAffineTransform rotateTrans =CGAffineTransformMakeRotation(angle * M_PI / 180);
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
myView.transform = CGAffineTransformConcat(scaleTrans, rotateTrans);
[UIView commitAnimations];

}

In the above method : replace & with what u want ... It'll work ,,, surely :) All the best

You should consider making two copies of the image, rotating one, and masking them both so that they can be placed next to each other in the L shape.

Using this technique, you'll be doing two translations at once (moving the mask and the underlying image) to both images A and T. But, notice that rotation will not be animated. You'll put image T into the rotated state immediately and just reveal it by moving it under the mask (while simultaneously doing the opposite on image A to hide it). So you're not actually combining translation and rotation into one animation, but rather using just translation with a mask on both the original image (A) and a rotated copy (T).

You'll need to mask the left side of one and the right side of the other. The shape of the mask should have an opposite 45 degree angle on both, then you can bring those angled edges together to form the L. As time progress, you just move the mask in each until the first image is totally gone and you're left with your end state.

The masking part is the hard part. See this answer on masking a UIImage with CoreGraphics: masking a UIImage

The mask PNG would basically just be a rectangle with one side at a 45 degree angle. You could create that in the image editor of your choice (Photoshop, GIMP, Acorn).

Note: this approach will create a sharp edge at the corner. The other approach would be to warp the pixels around that corner as they move from the vertical downward motion to the horizontal rightward motion. (I think) This would be much more involved.