I have this code.
UIImageView *sunrays = (UIImageView *)[self.view viewWithTag:1];
UIView *container = [[UIView alloc] initWithFrame:CGRectMake(0,0,sunrays.frame.size.width,sunrays.frame.size.height)];
[container setClipsToBounds:YES];
[container addSubview:sunrays];
[sunrays setCenter:CGPointMake(container.bounds.size.width/2, container.bounds.size.height/2)];
[self.view addSubview:container];
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:5];
CABasicAnimation *rotationAnimation;
rotationAnimation = [CABasicAnimation animationWithKeyPath:#"transform.rotation.z"];
rotationAnimation.toValue = [NSNumber numberWithFloat:M_PI * 2.0];
rotationAnimation.duration = 10;
rotationAnimation.cumulative = YES;
rotationAnimation.repeatCount = 10;
rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
[sunrays.layer addAnimation:rotationAnimation forKey:#"rotationAnimation"];
[UIView commitAnimations];
It runs correctly in an application with .xib file.
The same exactly code with storyboard doesn't run.
I insert QuartzCore.framework and CoreGraphics.framework.
Where is the problem? Any help...?
Related
I'm trying to highlight a touch event by using UIGestureRecognizer, so far I can get the CGPoint where the user touched but I don't know how to highlight that specific area since I don't know much about animation.
The code so far on viewDidLoad:
UITapGestureRecognizer *singleFingerTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(gradientTouchDown:)];
[self addGestureRecognizer:singleFingerTap];
The method that gets the position of the touch:
-(void)gradientTouchDown:(UIGestureRecognizer*)recognizer{
NSLog(#"tap detected.");
CGPoint point = [recognizer locationInView:nil];
NSLog(#"x = %f y = %f", point.x, point.y );
}
By doing some study I think I need to add the code above with a View animation, but how can I recognize the touch? the code:
[UIView animateWithDuration:0.3f
delay:0.0
options:UIViewAnimationOptionCurveEaseIn
animations:^
{
[sender setAlpha:0.3f];
}
completion:^(BOOL finished)
{
[sender setAlpha:1.0f];
}];
I really need help on this one, any question just ask, I'm always around here :)
This is how I implemented my animation in one of my projects for a button. The animation just puts a glow around the button when pressed (just like the glow you see when you press an year button on the graph view of built in stocks app)
First, add these targets to the button:
[button addTarget:self action:#selector(myButtonPressed:) forControlEvents:UIControlEventTouchDown];
[button addTarget:self action:#selector(myButtonReleased:) forControlEvents:UIControlEventTouchUpInside];
Then these methods looks like this:
- (void) myButtonPressed:(id) sender
{
UIButton *button = (UIButton *) sender;
CABasicAnimation *shadowRadius = [CABasicAnimation animationWithKeyPath:#"shadowRadius" ];
shadowRadius.delegate = self;
[shadowRadius setFromValue:[NSNumber numberWithFloat:3.0]];
[shadowRadius setToValue:[NSNumber numberWithFloat:15.0]];
[shadowRadius setDuration:0.2f];
[[button layer] addAnimation:shadowRadius forKey:#"shadowRadius"];
button.layer.shadowRadius = 15.0f;
}
- (void) myButtonReleased:(id) sender
{
UIButton *button = (UIButton *) sender;
CABasicAnimation *shadowRadius = [CABasicAnimation animationWithKeyPath:#"shadowRadius" ];
shadowRadius.delegate = self;
[shadowRadius setFromValue:[NSNumber numberWithFloat:15.0]];
[shadowRadius setToValue:[NSNumber numberWithFloat:3.0]];
[shadowRadius setDuration:0.2f];
//shadowRadius.autoreverses = YES;
[[button layer] addAnimation:shadowRadius forKey:#"shadowRadius"];
button.layer.shadowRadius = 3.0f;
button.selected = YES;
}
Hi and thanks for the help, I came out with a custom solution for a similar glow effect related to the Apple "Shows Touch on Highlight" here is the code for the glow:
-(void)gradientTouchDown:(UIGestureRecognizer*)recognizer{
NSLog(#"tap detected");
CGPoint point = [recognizer locationInView:nil];
NSLog(#"x = %f y = %f", point.x, point.y );
UIImage* image;
UIColor *color = [UIColor whiteColor];
UIGraphicsBeginImageContextWithOptions(recognizer.view.bounds.size, NO, [UIScreen mainScreen].scale); {
[recognizer.view.layer renderInContext:UIGraphicsGetCurrentContext()];
UIBezierPath* path = [UIBezierPath bezierPathWithRect:CGRectMake(0, 0, recognizer.view.bounds.size.width, recognizer.view.bounds.size.height)];
[color setFill];
[path fillWithBlendMode:kCGBlendModeSourceAtop alpha:1.0];
image = UIGraphicsGetImageFromCurrentImageContext();
} UIGraphicsEndImageContext();
UIView* glowView = [[UIImageView alloc] initWithImage:image];
glowView.center = self.center;
[self.superview insertSubview:glowView aboveSubview:self];
glowView.alpha = 0;
glowView.layer.shadowColor = color.CGColor;
glowView.layer.shadowOffset = CGSizeZero;
glowView.layer.shadowRadius = 10;
glowView.layer.shadowOpacity = 1.0;
CABasicAnimation* animation = [CABasicAnimation animationWithKeyPath:#"opacity"];
animation.fromValue = #(0.0f);
animation.toValue = #(0.6f);
//animation.repeatCount = 2 ? HUGE_VAL : 0;
animation.duration = 0.2;
animation.autoreverses = YES;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
[glowView.layer addAnimation:animation forKey:#"pulse"];
}
Any suggestion for improvement is welcome, so far it works for me :)
I try to implement the animation:
when you enter iPhone Gallery, press the image, you see full-screen image. Below you can see toolbar with trash button. When you press this button, the image is being deleted with animation.
I try to implement this, but I don't know, how to implement the transform of image, apple use.
This is the best, I could do:
[UIView transitionWithView:self.view duration:0.1 options:UIViewAnimationOptionTransitionCrossDissolve animations:^{
[self.view addSubview:scrollImageView];
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.3 delay:0 options:UIViewAnimationOptionAllowUserInteraction animations:^{
CGRect frame = scrollImageView.frame;
frame.size = CGSizeMake(frame.size.width * 0.75, frame.size.height * 0.75);
frame.origin = CGPointMake((size.width - frame.size.width) / 2, (size.height - frame.size.height) / 2);
scrollImageView.frame = frame;
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.3 delay:0 options:UIViewAnimationOptionAllowUserInteraction animations:^{
CGRect frame = scrollImageView.frame;
frame.size = CGSizeMake(frame.size.width * 0.05, frame.size.height * 0.05);
frame.origin = CGPointMake(size.width, size.height);
scrollImageView.frame = frame;
CGAffineTransform transform = scrollImageView.transform;
CGAffineTransform rotatedTransform = CGAffineTransformRotate(transform, 45 * 3.14 / 180);
scrollImageView.transform = rotatedTransform;
} completion:^(BOOL finished) {
[scrollImageView removeFromSuperview];
}];
}];
}];
Thank you in advance.
Update
As I understand, I can't do this animation with Core-Animation, but may anyone can advice me the animation the most simular to iPhone Gallery animation, but without using OpenGL?
You can use following example for this animation:
UIView *senderView = (UIView*)sender;
CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:#"transform"];
anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
anim.duration = 0.125;
anim.repeatCount = 1;
anim.autoreverses = YES;
anim.removedOnCompletion = YES;
anim.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(1.2, 1.2, 1.0)];
//[senderView.layer addAnimation:anim forKey:nil];
UIBezierPath *movePath = [UIBezierPath bezierPath];
[movePath moveToPoint:icon.center];
[movePath addQuadCurveToPoint:senderView.center
controlPoint:CGPointMake(senderView.center.x, icon.center.y)];
CAKeyframeAnimation *moveAnim = [CAKeyframeAnimation animationWithKeyPath:#"position"];
moveAnim.path = movePath.CGPath;
moveAnim.removedOnCompletion = YES;
CABasicAnimation *scaleAnim = [CABasicAnimation animationWithKeyPath:#"transform"];
scaleAnim.fromValue = [NSValue valueWithCATransform3D:CATransform3DIdentity];
scaleAnim.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(0.1, 0.1, 1.0)];
scaleAnim.removedOnCompletion = YES;
CABasicAnimation *opacityAnim = [CABasicAnimation animationWithKeyPath:#"alpha"];
opacityAnim.fromValue = [NSNumber numberWithFloat:1.0];
opacityAnim.toValue = [NSNumber numberWithFloat:0.1];
opacityAnim.removedOnCompletion = YES;
CAAnimationGroup *animGroup = [CAAnimationGroup animation];
animGroup.animations = [NSArray arrayWithObjects:moveAnim, scaleAnim, opacityAnim, nil];
animGroup.duration = 0.5;
[icon.layer addAnimation:animGroup forKey:nil];
I have modified the code, you have to perform following changes in it, set the sender view as self.view, and change the ending point of animation (which is currently senderView.center) according to your requirement
I know its a bit late. But, you should check Ciechan's solution named BCGenieEffect. Can be found here. Its pure Core Animation and very easy to understand. I think that's what you are looking for.
Good luck
At this point the exact animation you are talking about cannot be done using Core Animation or UIKit. You would need to use OpenGL and apply the image as a texture and do your animation in there.
I think you are talking about the "suck" transition animation.
It is possible to trigger it, but it is a private transition, and Apple may reject your app if you use it.
This code should do it, using a transition code of 103:
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition: transtionIndex forView:containerView cache:NO];
[containerView addSubview: newView];
[oldView removeFromSuperview];
[UIView commitAnimations];
Or search the net for a Core Image transition called "suckEffect"
i have a UIViewController which contains the 16 UIImageView now i have to annimate 4 images with Core Animation
any idea how to do this ?
i am able to animate the one only following is my code
CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:#"position"];
anim.fromValue = [NSValue valueWithCGPoint:CGPointMake(100, 100)];
anim.toValue = [NSValue valueWithCGPoint:CGPointMake(200, 200)];
anim.duration = 1.5f;
anim.repeatCount =1;
anim.removedOnCompletion = YES;
anim.autoreverses = YES;
anim.repeatCount = 10;
anim.timingFunction = [CAMediaTimingFunction
functionWithName:kCAMediaTimingFunctionEaseIn];
[imgview.layer addAnimation:anim forKey:#"position"];
Here's a theory solution in my mind, that in a loop from (1 to [yourImageArray count]) do load an imageView dynamically, load single image from yourImage array using index from that loop. Perform some animation using code on imageView.
UIImageViews are subclasses of UIView, which have the following method:
animateWithDuration:delay:options:animations:completion
You can use it in the following way:
[UIView animateWithDuration:1.5f
delay:0.0f
options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeat
animations:^{
[UIView setAnimationRepeatCount:10];
[imgview1 setCenter:CGPointMake(200,200)];
[imgview2 setCenter:CGPointMake(300,200)];
[imgview3 setCenter:CGPointMake(400,200)];
[imgview4 setCenter:CGPointMake(500,200)];
};
completion:nil];
how to animate the uilabel view in such a way that it should keep moving from right side of the screen towards left ,
i have used the folloiwing code but it didnt work
UILabel * lbl =[UILabel alloc]init];
CALayer *cloud = [CALayer layer];
cloud.contents = lbl.text;
cloud.bounds = CGRectMake(0, 40, 100, 30);
cloud.position = CGPointMake(-45 ,30);
//cloud.position = CGPointMake(self.view.bounds.size.width / 2,cloudImage.size.height / 2);
[self.view.layer addSublayer:cloud];
CGPoint startPt = CGPointMake(self.view.bounds.size.width + cloud.bounds.size.width / 2,
cloud.position.y);
CGPoint endPt = CGPointMake(cloud.bounds.size.width / -2,
cloud.position.y);
CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:#"position"];
anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
anim.fromValue = [NSValue valueWithCGPoint:startPt];
anim.toValue = [NSValue valueWithCGPoint:endPt];
anim.repeatCount = 1;
anim.duration = 5.0;
[cloud addAnimation:anim forKey:#"position"];
It's a lot easier if you can use animateWithDuration in ios4
UILabel *label = //new label
[UIView animateWithDuration:1.0 animations:^{
label.frame = //new frame
}];
You can do it like this:
UILabel *label = [[UILabel alloc] initWithFrame:theRect];
[self.view addSubview:label];
[UIView animateWithDuration:0.5
delay:0.0
options:UIViewAnimationCurveEaseIn
animations:^{label.bounds = targetRect;}
completion:^(BOOL finished) { /* completion stuff */}];
There are more animate methods that take less parameters. You find them in the UIView documentation.
I would like to present a view in the same manner as that of UIAlertView - a pop/spring. Unfortunately subclassing UIAlertView is not an option for the view I need to present. I have written some code, but I can't seem to get it as realistic as I would like. I would appreciate any suggestions for greater realism or a link if anything similar has been done (I could not find anything on Google). Thank you.
- (id)initWithFrame:(CGRect)frame {
if ((self = [super initWithFrame:frame])) {
self.backgroundColor = [UIColor whiteColor];
v = [[UIView alloc] initWithFrame:CGRectMake(140, 140, 60, 60)];
v.backgroundColor = [UIColor blueColor];
[self addSubview:v];
[self animate];
}
return self;
}
- (void)animate {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
[UIView setAnimationDuration:0.2];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(popStep1Complete)];
v.frame = CGRectMake(90, 90, 140, 140);
[UIView commitAnimations];
}
- (void)popStep1Complete {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
[UIView setAnimationDuration:0.15];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(popStep2Complete)];
v.frame = CGRectMake(110, 110, 100, 100);
[UIView commitAnimations];
}
- (void)popStep2Complete {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
[UIView setAnimationDuration:0.15];
v.frame = CGRectMake(100, 100, 120, 120);
[UIView commitAnimations];
}
- (void) attachPopUpAnimation
{
CAKeyframeAnimation *animation = [CAKeyframeAnimation
animationWithKeyPath:#"transform"];
CATransform3D scale1 = CATransform3DMakeScale(0.5, 0.5, 1);
CATransform3D scale2 = CATransform3DMakeScale(1.2, 1.2, 1);
CATransform3D scale3 = CATransform3DMakeScale(0.9, 0.9, 1);
CATransform3D scale4 = CATransform3DMakeScale(1.0, 1.0, 1);
NSArray *frameValues = [NSArray arrayWithObjects:
[NSValue valueWithCATransform3D:scale1],
[NSValue valueWithCATransform3D:scale2],
[NSValue valueWithCATransform3D:scale3],
[NSValue valueWithCATransform3D:scale4],
nil];
[animation setValues:frameValues];
NSArray *frameTimes = [NSArray arrayWithObjects:
[NSNumber numberWithFloat:0.0],
[NSNumber numberWithFloat:0.5],
[NSNumber numberWithFloat:0.9],
[NSNumber numberWithFloat:1.0],
nil];
[animation setKeyTimes:frameTimes];
animation.fillMode = kCAFillModeForwards;
animation.removedOnCompletion = NO;
animation.duration = .2;
[self.layer addAnimation:animation forKey:#"popup"];
}
the pointer to delackner's post is the best initial one i found as well. i would only offer for folks trying to really mimic UIAlertView a few things:
adding the rounded edges, border, and semi-transparent layer color
some alpha fade-in/-out, and
redoing with blocks as somewhat more succinct with latest iOS toolchain
i also found the initial 1.1 scale-out he suggests too large, 1.05 seemed more correct visually to me in most cases
Code:
self.layer.cornerRadius = 10.0;
[self.layer setMasksToBounds:YES];
self.layer.backgroundColor = [[UIColor blueColor] colorWithAlphaComponent:0.60].CGColor;
self.layer.borderColor = [UIColor whiteColor].CGColor;
self.layer.borderWidth = 1.1;
if (self.hidden == YES) { // swoop in if coming from hidden, otherwise pulse in-place
self.transform = CGAffineTransformMakeScale(0.6, 0.6);
}
self.hidden = NO;
[UIView animateWithDuration:0.2
animations:^{
self.transform = CGAffineTransformMakeScale(1.05, 1.05);
self.alpha = 0.8;
}
completion:^(BOOL finished){
[UIView animateWithDuration:1/15.0
animations:^{
self.transform = CGAffineTransformMakeScale(0.9, 0.9);
self.alpha = 0.9;
}
completion:^(BOOL finished) {
[UIView animateWithDuration:1/7.5
animations:^{
self.transform = CGAffineTransformIdentity;
self.alpha = 1.0;
}
];
}
];
}
];
One thing: multi-step animations like this are much easier if you use a CAKeyframeAnimation instead of mutiple UIView queued animations.