UIView block animation move view left to right and back to left - ios

I wan't to animate a view that's shaped as an arrow, and I want it to animate from left to right, left to right and so on..
This code below is not working, I'm guessing I need a path, but don't know how to do that in a UIView block animation.
[UIView animateWithDuration:.5 delay:0 options:UIViewAnimationOptionRepeat animations:^{
controller.view.frame = frame1;
controller.view.frame = frame2;
} completion:^(BOOL finished) {
}];

You can use UIViewAnimationOptionAutoreverse option, try the code below:
UIView * testView = [[UIView alloc] initWithFrame:CGRectMake(20.0f, 100.0f, 300.0f, 200.0f)];
[testView setBackgroundColor:[UIColor blueColor]];
[self.view addSubview:testView];
[UIView animateWithDuration:0.3f
delay:0.0f
options:UIViewAnimationOptionRepeat | UIViewAnimationOptionAutoreverse
animations:^{
[testView setFrame:CGRectMake(0.0f, 100.0f, 300.0f, 200.0f)];
}
completion:nil];
[testView release];
It'll repeat move from right to left, left to right, ... smoothly.

Assuming that frame1 is the starting position and frame2 is the end position before repeat.
The problem is that the animation is calculated at the end of the runloop therefore the frame1 is ignored and the view is simply moved to frame2. If you move the setting of frame1 outside of the block then it should work fine. If you want the animation to play back and forward you will need to make it autoreverse with UIViewAnimationOptionAutoreverse

Related

Animated UIButton not registering press

I am trying to make a slide out notification bar for when the app receives a notification and the app is currently open and in the foreground. I got this working with a custom UIView (actually it's a UIButton) and an animation. For some reason though it won't register a press when I tap on it. It won't call the selector method. Code is below:
-(void)appOpenPush {
//get string
NSLog(#"got a push while app was open");
AppDelegate *appDelegate =(AppDelegate *)[[UIApplication sharedApplication] delegate];
NSString *pushString = appDelegate.pushString;
//play sound
AudioServicesPlaySystemSound(MessageSound);
AudioServicesPlayAlertSound(kSystemSoundID_Vibrate);
//note I am actually using a button here
UIButton *pushView =[[UIButton alloc] initWithFrame:CGRectMake(0, -75, [[UIScreen mainScreen] bounds].size.width,75)];
pushView.backgroundColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.8];
[pushView addTarget:self action:#selector(pushSlidePress) forControlEvents:UIControlEventTouchUpInside];
//set image
UIImageView *logo = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"icon120.png"]];
logo.frame=CGRectMake(5, 20, 35, 35);
logo.layer.cornerRadius=8;
logo.clipsToBounds=YES;
[pushView addSubview:logo];
UILabel *pushLabel = [[UILabel alloc] initWithFrame:CGRectMake(48, 34, 0, 0)];
pushLabel.text=pushString;
pushLabel.font=[UIFont systemFontOfSize:13];
[pushLabel sizeToFit];
pushLabel.textColor=[UIColor whiteColor];
[pushView addSubview:pushLabel];
//animate
UIWindow* currentWindow = [UIApplication sharedApplication].keyWindow;
[currentWindow addSubview:pushView];
[UIView animateWithDuration:0.4 delay:0.0 options:UIViewAnimationOptionCurveEaseIn animations:^{
pushView.frame = CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width,75);
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.4 delay:2.0 options:UIViewAnimationOptionCurveEaseIn animations:^{
pushView.frame = CGRectMake(0, -75, [[UIScreen mainScreen] bounds].size.width,75);
} completion:^(BOOL finished) {
[pushView removeFromSuperview];
}];
}];
}
Could anyone give me a pointer to why this isn't working? Is it because I am adding the UIButton to the main window? Any tips would be really helpful. thanks!
You have to add UIViewAnimationOptionAllowUserInteraction as an option to both of your animation blocks.
As per the documentation :
"Allow the user to interact with views while they are being animated."
Try this to avoid logo and pushLabel receive touches events:
logo.userInteractionEnabled = NO;
pushLabel.userInteractionEnabled = NO;
So it turns out you can't simply detect a press if the button is moving. I tested this by just adding the frame setup without it animating and it registered the press, when animation is turned on it doesn't. Seems that UIButton doesn't have tracking built in. I did come up with a quick fix. I just made a button the same size as the total animation area (i.e. the size of my slide out bar) and added that to the currentWindow on top of the animation frame. So it's just a clear invisible button on top of the animation but it's not moving itself. i.e:
UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(0, 0,[[UIScreen mainScreen]bounds].size.width , 75)];
[button addTarget:self action:#selector(pushSlidePress) forControlEvents:UIControlEventTouchUpInside];
[currentWindow addSubview:button];
[UIView animateWithDuration:0.4 delay:0.0 options:(UIViewAnimationOptionCurveEaseIn | UIViewAnimationOptionAllowUserInteraction) animations:^{
pushView.frame = CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width,75);
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.4 delay:2.0 options:(UIViewAnimationOptionCurveEaseIn | UIViewAnimationOptionAllowUserInteraction) animations:^{
pushView.frame = CGRectMake(0, -75, [[UIScreen mainScreen] bounds].size.width,75);
} completion:^(BOOL finished) {
[pushView removeFromSuperview];
[button removeFromSuperview];
}];
}];
Obviously you are covering an area of the screen that might block other things being pressed, but it depends on your setup. The animation is quick and I only have one button that the notification bar will block and it's too quick to notice. Hopefully this will be helpful to someone else trying to achieve a similar thing. Thanks for your help guys.

A better way to animate resizing of UIView and subviews?

Example screen capture:
What is a better way to animate the resizing of a UIView that includes subviews?
My current method:
In the screen capture, the parent UIView (orange) has a subview UILabel (yellow + autoresizing). animateWithDuration is animating the resizing of the parent UIView's frame. The problem with this method is it does not animate the resizing of the subview. It abruptly changes, where it should scale animatedly.
Is explicitly animating the subview best, or is there a more efficient method? (e.g. CGAffineTransform?)
Sample code:
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
self.parentView = [[UIView alloc] initWithFrame:CGRectMake(10, 100, 200, 200)];
self.parentView.backgroundColor = [UIColor orangeColor];
[self.view addSubview:self.parentView];
self.childLabel = [[UILabel alloc] initWithFrame:CGRectMake(10, 10, 180, 180)];
self.childLabel.autoresizingMask = UIViewAutoresizingFlexibleWidth |
UIViewAutoresizingFlexibleHeight;
self.childLabel.backgroundColor = [UIColor yellowColor];
[self.parentView addSubview:self.childLabel];
[NSTimer scheduledTimerWithTimeInterval:2
target:self
selector:#selector(randomizeParentViewSize)
userInfo:nil
repeats:YES];
}
- (void)randomizeParentViewSize {
CGFloat width = arc4random_uniform(100) + 50;
CGFloat height = arc4random_uniform(100) + 50;
[UIView animateWithDuration:1.5f
delay:0.0f
options:0
animations:^{
self.parentView.frame = CGRectMake(10, 50 + height, width, height);
}
completion:^(BOOL finished) {
}];
}
I Guess Your Yellow SubView is UILabel ?
When UILabel change frame size in UIViewAnimation will scale Immediately
unless you use the CGAffineTransformScale
some example
when
[self.view addSubview:view_parent];
[view_parent addSubview:view_component];
if both view_parent and view_component is UIView
[UIView animateWithDuration:2.0 animations:^{
[view_parent setFrame:CGRectMake(0, 20, 160, 160)];
[view_component setFrame:CGRectMake(20, 20, 80, 80)];
}];
is work fine
but when view_parent is UIView and view_component is UILabel
you need do something like ...
[UIView animateWithDuration:2.0 animations:^{
[view_parent setFrame:CGRectMake(0, 20, 160, 160)];
view_component.transform = CGAffineTransformScale(view_component.transform, 0.5, 0.5);
[view_component setFrame:CGRectMake(20, 20, 80, 80)];
}];
Wish help ~
To animate the view and also the subview you could use this code:
[UIView animateWithDuration:0.5f animations:^{
self.testView.transform = CGAffineTransformMakeScale(0.5, 0.5);
}];
More Info
You can't use frame, bounds, or center if you are also animating things using CGAffine, So if you also need to move the view use something like this:
CGAffineTransform transform = CGAffineTransformMakeTranslation(150,400);
transform = CGAffineTransformScale(transform, 0.5, 0.5);
Use UIViewAnimationOptionLayoutSubviews:
Add proper leading, trailing, top and bottom constraints on the subview.
[UIView animateWithDuration:0.2 delay:0 options:UIViewAnimationOptionLayoutSubviews animations:^{ //resize the superview
} completion:nil];

ios Animation with [removeFromSuperview]

I use the following lines of code:
[UIView animateWithDuration:0.50
animations:^{ itemView.transform = CGAffineTransformIdentity; }
completion:^(BOOL finished) { if (finished) [itemView removeFromSuperview]; }];
The animation does nothing. If I take the removeFromSuperview out of the completion block, it doesn't work either, I guess because the view is removed before it completes. So, either way, the appearance is the same - no animation.
I'll appreciate any suggestion or workaround on this.
Are you setting the transform correctly? The below is an example of scaling a UIView to zero area and then removing it from the superview.
UIView *itemView = [[UIView alloc] initWithFrame:CGRectMake(10, 10, 200, 200)];
[itemView setBackgroundColor:[UIColor redColor]];
[self.view addSubview:itemView];
CGAffineTransform trans = CGAffineTransformScale(self.view.transform, 0, 0);
[UIView animateWithDuration:2.5 delay:0 options:0 animations:^{
itemView.transform = trans;
} completion:^(BOOL finished) {
[itemView removeFromSuperview];
}];

Shrink UIView from left to right

I have the following code to shrink a UIView from left to right and remove it from super view after the animation finished:
UIView* coverView = [[UIView alloc]initWithFrame:CGRectMake(100, 100, 300, 50)];
UIImageView* imageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:#"swipe_rl.png"]];
[imageView setContentMode:UIViewContentModeScaleToFill];
[imageView setFrame:coverView.bounds];
[coverView addSubview:imageView];
[coverView setAutoresizingMask:UIViewAutoresizingFlexibleWidth];
coverView.clipsToBounds = YES;
[self.view addSubview:coverView];
CGRect frame = coverView.frame ;
[UIView animateWithDuration:5.0 animations:^{
[coverView setFrame:CGRectMake(frame.origin.x + frame.size.width, frame.origin.y, 0, frame.size.height)];
} completion:^(BOOL finished){
[coverView removeFromSuperview];
}];
However, the left part of the picture stays and the right part of the picture disappears as you can see in the pictures. For a specific purpose, I want the left part disappears and the right part stays. How can I do it?
For those who want to know why I want this:
- Basically, I want a display-from-left-to-right animation (It means you have a picture and the left of the picture appears first and the the middle and the whole picture appears)
- I do this by adding a second view above the first picture and then shrink the second view from left to right. The first view will then be revealed from left to right.
- Look at http://i1289.photobucket.com/albums/b510/yenmach/right_to_left_zps80b9e9bb.jpg and http://i1289.photobucket.com/albums/b510/yenmach/left_to_right_zps9214dc4a.jpg
//try this.......
CGRect frame = coverView.frame ;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:5.0];
[UIView setAnimationDelay:0];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
imageView.frame = CGRectMake(frame.origin.x - 2*frame.size.width,imageView.frame.origin.y, frame.size.width, frame.size.height);
coverView.frame = CGRectMake(frame.origin.x + frame.size.width, frame.origin.y, frame.size.width, frame.size.height);
[UIView commitAnimations];
Not exactly a solution but a workaround, If you are going to be using this with a consistent background (ideally a solid colour) you could just have another view animate overtop of the image view and then remove both once the animation is done.
Try changing UIImageView contentMode property,
[imageView setContentMode: UIViewContentModeRight];
I was having same kind of requirement and this worked fine for me at that time.

Switch XIB's fading through Black?

I am attempting to switch views (XIB's) while fading through black. I have been doing this using UIView animations and I want to keep it that way. The problem is that whenever I switch views I am not fading through black, its more of a fade directly to the next XIB.
How would I properly do this?
Here is my code (self.view = view1.view in my case, but maybe I shouldn't do that):
[self.view setBackgroundColor:[UIColor colorWithRed:0 green:0 blue:0 alpha:1.0]];
[UIView animateWithDuration:0.4
animations:^{
[view1.view setAlpha:0];
}
completion:^(BOOL finished){
[self.view.superview addSubview:view2.view];
[view2.view setAlpha:0];
[view2.view setFrame:CGRectMake(0, 0, 320, 480)];
[UIView animateWithDuration:0.4
animations:^{
[view2.view setAlpha:1];
}
completion:^(BOOL finished){
[view1.view removeFromSuperview];
}];
Thanks!
I think your problem is that the background color of self.view is part of that view. When you fade the view, it fades the background too.
Instead, you should put a view that you keep on the screen all the time, that's empty and has a black background color, and is behind view1 or view2.

Resources