UIImageView上的旋转动画

问题描述:

我有阳光图像。我喜欢把它的背景,使其在慢动作时间可持续旋转..UIImageView上的旋转动画

的形象是这样的..

alt text

我试着CABasicAnimation旋转它,但它旋转整个框架..我只想阳光旋转在不是整个框架的背景..

有没有办法做到这一点?

更新:

这里是什么M做......请您指出我的错误... :(

我没有得到笏u've解释.. :(

这里是什么M做...

- (void)viewDidLoad { 
sunraysContainer = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 1024, 768)]; 
sunraysContainer.clipsToBounds = YES; 
[self.view addSubview:sunraysContainer]; 


sunrays = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 1024, 768)]; 
[sunrays setImage:[UIImage imageNamed:@"sunlight-background copy2.jpg"]]; 
[sunraysContainer addSubview:sunrays]; 

backgroundBuilding = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 1024, 768)]; 
[backgroundBuilding setImage:[UIImage imageNamed:@"hira-background_fade.png"]]; 
[sunraysContainer addSubview:backgroundBuilding]; 

[UIView beginAnimations:nil context:nil]; 
[UIView setAnimationDuration:5]; 
CABasicAnimation *rotationAnimation; 
rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"]; 
rotationAnimation.toValue = [NSNumber numberWithFloat:M_PI * 2.0 * 4.0]; 
rotationAnimation.duration = 1; 
rotationAnimation.cumulative = YES; 
rotationAnimation.repeatCount = 10; 
rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; 
[sunrays.layer addAnimation:rotationAnimation forKey:@"rotationAnimation"]; 
[UIView commitAnimations]; 

} 

更新...

我做了什么ü说,纳乔...感谢您的回复,但m如果一个blankscreen .. :(

我编写DIS ...

sunrays = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sunlight-background copy2.jpg"]]; 
UIView *container = [[UIView alloc] initWithFrame:CGRectMake(0,0,sunrays.frame.size.height,sunrays.frame.size.height)]; 
[container setClipsToBounds:YES]; 
[container addSubview:sunrays]; 
[sunrays setCenter:CGPointMake(container.bounds.size.width/2, container.bounds.size.height/2)]; 
[UIView beginAnimations:nil context:nil]; 
[UIView setAnimationDuration:5]; 
CABasicAnimation *rotationAnimation; 
rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"]; 
rotationAnimation.toValue = [NSNumber numberWithFloat:M_PI * 2.0 * 4.0]; 
rotationAnimation.duration = 1; 
rotationAnimation.cumulative = YES; 
rotationAnimation.repeatCount = 10; 
rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; 
[sunrays.layer addAnimation:rotationAnimation forKey:@"rotationAnimation"]; 
[UIView commitAnimations]; 

什么是错的妇女参与发展的代码? ?

我认为你是在正确的方式;)你必须有一个容器,它剪辑它,因此它不会看起来像孔框架旋转。

UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image.png"]]; 
UIView *container = [UIView alloc] initWithFrame:CGRectMake(0,0,imageView.frame.size.height, image.frame.size.height)]; //i used the height because is the min(height, width). 
[container setClipsToBounds:YES]; 
[container addSubview:imageView]; 
[imageView setCenter:CGPointMake(container.bounds.size.width/2, container.bounds.size.height/2)]; 
//animate your image here 
... 

另外。如果可能的话使用的CALayer而不是ImageView的;)

CALayer *imageLayer = [CALayer layer]; 
imageLayer.contents = (id)[UIImage imageNamed:@"myimage.png"].CGImage; 
// and do basically the same as above, 
[container.layer addSublayer:imageLayer]; 
//... 

注:上面的代码是大脑编译,所以可能有一些小错误,但这个想法是明确的;)

希望它可以帮助

编辑:

嘿;)我想你忘了添加容器到您的视图。 ;)

我刚刚尝试了代码,我意识到容器的帧计算是不精确的(即使你不这样做,它会工作,但动画看起来有点难看) 这是代码:

UIImage *image = [UIImage imageNamed:@"sunrays.jpg"]; 
    UIImageView *sunrays = [[UIImageView alloc] initWithImage:image]; 
    float side = (MIN(image.size.height, image.size.width)/(2.0*sqrt(2))); 
    UIView *container = [[UIView alloc] initWithFrame:CGRectMake(0,0,side,side)]; 
    [container setClipsToBounds:YES]; 
    [container addSubview:sunrays]; 
    [sunrays setCenter:CGPointMake(container.bounds.size.width/2, container.bounds.size.height/2)]; 

    [self.view addSubview:container]; //you forgot this? ;) 

    [UIView beginAnimations:nil context:nil]; 
    [UIView setAnimationDuration:5]; 
    CABasicAnimation *rotationAnimation; 
    rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"]; 
    rotationAnimation.toValue = [NSNumber numberWithFloat:M_PI * 2.0 * 4.0]; 
    rotationAnimation.duration = 1; 
    rotationAnimation.cumulative = YES; 
    rotationAnimation.repeatCount = 10; 
    rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; 
    [sunrays.layer addAnimation:rotationAnimation forKey:@"rotationAnimation"]; 
    [UIView commitAnimations]; 
+0

米没得到什么ü解释.. :( – Hisenberg 2010-12-01 11:37:08

+0

我已经编辑我的代码。 ..现在它显示为空白屏幕... – Hisenberg 2010-12-01 11:54:24

嗯,我想你应该产生不同的图像,然后尝试动画这个

imgLoading.animationImages = [NSArray arrayWithObjects: 
           [UIImage imageNamed:@"Img1.png"] 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:30.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:60.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:90.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:120.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:150.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:180.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:210.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:240.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:270.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:300.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:330.0]], 
           [UIImage imageWithCGImage: 
           [self CGImageRotatedByAngle: 
           [[UIImage imageNamed:@"Img1.png"] CGImage]angle:360.0]], nil]; 

imgLoading.animationRepeatCount=0; 
imgLoading.animationDuration=.5; 
[imgLoading startAnimating]; 

在我已分别增加了图像上面的代码,但你可以在一个循环填充它们。

- (CGImageRef)CGImageRotatedByAngle:(CGImageRef)imgRef angle:(CGFloat)angle 

{

CGFloat angleInRadians = angle * (M_PI/180); 
CGFloat width = CGImageGetWidth(imgRef); 
CGFloat height = CGImageGetHeight(imgRef); 

CGRect imgRect = CGRectMake(0, 0, width, height); 
CGAffineTransform transform = CGAffineTransformMakeRotation(angleInRadians); 
CGRect rotatedRect = CGRectApplyAffineTransform(imgRect, transform); 

CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB(); 

CGContextRef bmContext = CGBitmapContextCreate(NULL, 
               rotatedRect.size.width, 
               rotatedRect.size.height, 
               8, 
               0, 
               colorSpace, 
               kCGImageAlphaPremultipliedFirst); 
CGContextSetAllowsAntialiasing(bmContext, YES); 
CGContextSetShouldAntialias(bmContext, YES); 
CGContextSetInterpolationQuality(bmContext, kCGInterpolationHigh); 
CGColorSpaceRelease(colorSpace); 
CGContextTranslateCTM(bmContext, 
         +(rotatedRect.size.width/2), 
         +(rotatedRect.size.height/2)); 
CGContextRotateCTM(bmContext, angleInRadians); 
CGContextTranslateCTM(bmContext, 
         -(rotatedRect.size.width/2), 
         -(rotatedRect.size.height/2)); 
CGContextDrawImage(bmContext, CGRectMake(0, 0, 
             rotatedRect.size.width, 
             rotatedRect.size.height), 
        imgRef); 



CGImageRef rotatedImage = CGBitmapContextCreateImage(bmContext); 
CFRelease(bmContext); 
[(id)rotatedImage autorelease]; 

return rotatedImage; 

}

上述功能可用于给旋转的图像..

我知道这是很老的帖子。 一个解决方案是让您的图像在黄色部分透明。你可以使用免费的工具pngweasel。使黄色部分透明 - 这将只提供太阳光线的图像。为此图像使用纯黄色背景。现在,您可以使用下面的代码轻松旋转新(太阳射线)图像

CABasicAnimation *rotate; 
rotate = [CABasicAnimation animationWithKeyPath:@"transform.rotation"]; 
rotate.fromValue = [NSNumber numberWithFloat:0]; 
rotate.toValue = [NSNumber numberWithFloat:(0.0175*180)]; //[NSNumber numberWithFloat:deg2rad(10)]; 
rotate.duration = 0.5; 
rotate.repeatCount = 1; 
[self.image.layer addAnimation:rotate forKey:@"10"]; 

斯威夫特3:

var rotationAnimation = CABasicAnimation() 
rotationAnimation = CABasicAnimation.init(keyPath: "transform.rotation.z") 
rotationAnimation.toValue = NSNumber(value: (Double.pi)) 
rotationAnimation.duration = 1.0 
rotationAnimation.isCumulative = true 
rotationAnimation.repeatCount = 100.0 
imageView.layer.add(rotationAnimation, forKey: "rotationAnimation") 


这里是UIView的一个扩展功能,处理开始&停止旋转操作:

extension UIImageView { 

    func startRotation() { 
     let rotation : CABasicAnimation = CABasicAnimation(keyPath: "transform.rotation.z") 
     rotation.fromValue = 0 
     rotation.toValue = NSNumber(value: Double.pi) 
     rotation.duration = 5.0 
     rotation.isCumulative = true 
     rotation.repeatCount = FLT_MAX 
     self.layer.add(rotation, forKey: "rotationAnimation") 
    } 

    func stopRotation() { 
     self.layer.removeAnimation(forKey: "rotationAnimation") 
    } 
} 


现在使用,UIView.animation关闭:

UIView.animate(withDuration: 0.5, animations: { 
     imageView.transform = CGAffineTransform(rotationAngle: (CGFloat(Double.pi)) 
}) { (isAnimationComplete) in 
    // Animation completed 
} 

使用延长看到的结果是:

enter image description here