I have created two UIViews Programmatically and set its frame in ViewWillLayoutSubview function, Now I want to create a swapping animation so that each view swap each others position with animation on a click. For getting this animation I have to interchange its frame inside an animation but at the same time ViewWillLayoutSubview get called which sets frame to initial position.
How can I get my UIViews to be swapped with animation using ViewWillLayoutSubview?
I am not using any type of constraint or xib or storyboard. Whole screen is designed programatically.
Thanks in advance.
-(void)viewWillLayoutSubviews
{
if(Once)
{
// create 2 views here
once = NO;
}
}
put this code in button click
CGRect view2Frame = self.view2.frame;
[UIView animateWithDuration:duration delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
//code with animation
self.view2.frame = self.view1.frame;
self.view1.frame = view2Frame;
} completion:^(BOOL finished) {
//code for completion
}];
Related
I've learned that the way to animate constraints in Cocoa Touch is to just set them and then put [self.view layoutIfNeeded] in an animation block, like so:
self.someViewsHeightConstraint = 25.0;
[UIView animateWithDuration:0.5 animations:^{
[self.view layoutIfNeeded];
}];
This is working fine, for example with a simple UIView. However, it does not work with a UIPickerView. It just snaps into the new position without animating.
Any ideas why this might be the case? What ways are there to work around this?
The effect I'm going for is that the Picker View should shrink to just show the chosen item, as the user goes on to input other things. One idea I had is to make a snapshotted view and animate that instead, but I couldn't quite get that working either.
I found trying to animate the height or the placement constraint of a UIPickerView to be problematic. However, doing transforms seems to work well -- even if you have Auto Layout Constraints everywhere, including in the view to be transformed.
Here's an example of what works for me. In this case, I've placed the picker view inside a blurring effects view -- but you don't even need to put your picker view inside another view to animate it.
In the code below, when I call show, it animates up vertically. When I call the hide method, it animates downwards.
- (void)showPickerViewAnimated:(BOOL)animated;
{
__weak MyViewController *weakSelf = self;
[UIView animateWithDuration:(animated ? kPickerView_AppearanceAnimationDuration : 0.0)
delay:(animated ? kPickerView_AppearanceAnimationDelay : 0.0)
options:(UIViewAnimationOptionCurveEaseInOut)
animations:^{
weakSelf.pickerViewContainerView.transform = CGAffineTransformMakeTranslation(0,0);
}
completion:^(BOOL finished) {
[weakSelf.view layoutIfNeeded];
}];
}
- (void)hidePickerViewAnimated:(BOOL)animated;
{
__weak MyViewController *weakSelf = self;
[UIView animateWithDuration:(animated ? kPickerView_DisappearanceAnimationDuration : 0.0)
delay:(animated ? kPickerView_DisappearanceAnimationDelay : 0.0)
options:(UIViewAnimationOptionCurveEaseInOut)
animations:^{
weakSelf.pickerViewContainerView.transform = CGAffineTransformMakeTranslation(0, kPickerView_Height);
}
completion:^(BOOL finished) {
[weakSelf.view layoutIfNeeded];
}];
}
picker view, If you have added constraint To TopLayout for yPosition remove it and add constraint to bottom layout instead.
That will solve the problem. here is my code and its working:
self.timePickerHeightConstraint.constant = pickerIsClosed ? 216 :
0;
[UIView animateWithDuration:0.5 animations:^{
[self.view layoutSubviews];
} completion:^(BOOL finished){
}];
I am trying to animate uiview. That is, on button click view will appear through animation. This works properly. But when I try to remove that view through animation, animation is applied on the view and not on its sub controls. That is, view gets disappeared but all its sub controls are viewable.
So my question is how can I remove uiview along with its subcontrol using animation. My current code is:
To animate uiview code:
[UIView animateWithDuration:.5f animations:^{
CGRect theFrame = self.viewFilter.frame;
theFrame.size.height += 140.f;
self.viewFilter.frame = theFrame;
}];
To hide uiview:
[UIView animateWithDuration:.5f animations:^{
CGRect theFrame = self.viewFilter.frame;
theFrame.size.height -= 140.0f;
self.viewFilter.frame = theFrame;
}];
Thanks in advance
make 'viewFilter' super view for that all sub controllers , means add that all sub controllers to viewFilter
I'm currently creating a loading bar that I would like to pause and reverse if a specific action is taken.
I have the following code below that animates one view in another. How would I go about pausing this animation and applying another animation on the CURRENT frame at that point in time for the animated object. I would like to be able to animate this bar down to the 0 width mark at any given time within the current animation.
-(void)animateProgressBar
{
CGRect endingFrame = self.frame;
[UIView animateKeyframesWithDuration:self.time delay:0.0 options:0 animations:^{
[UIView addKeyframeWithRelativeStartTime:0.0 relativeDuration:1.0 animations:^{
self.loadingBar.frame = endingFrame;
}];
} completion:^(BOOL finished) {
NSLog(#"TADA");
}];
}
If you want to start a new animation from where this one is now, just start the new animation using the the UIViewKeyframeAnimationOptionBeginFromCurrentState option (or if just doing animateWithDuration, use UIViewAnimationOptionBeginFromCurrentState).
You can import QuartzCore framework, add
#import <QuartzCore/QuartzCore.h>
And you can remove existing animation by calling:
[self.loadingBar.layer removeAllAnimations];
After that you can start new animation.
If you want to pause it you have to get reference to the current animation:
CALayer *currentLayer = self.loadingBar.layer.presentationLayer;
And you have to save it:
self.loadingBar.layer.transform = currentLayer.transform;
You can do it in another [UIView animateWith..... method.
I created some animations in my project. Basically, I use UIView animate and CGAffineTransform, but a very strange thing happened and I have no idea. Hope someone can help me solve this problem. Thanks in advance.
This is the strange thing:
After the user clicks on a button, the button slides off screen and another two buttons slide on the screen (I just changed the center point of these buttons to achieve this animation). And, some time later, a view on the screen start shaking (I use CGAffineTransform to achieve this).
At this moment, the strange thing happens - the button that previous slid off screen show up at its original position again and the other two buttons disappear (No animation, just shows up and disappear).
The following is the related code,
1) Button slide off and slide in animation related code
- (IBAction)start:(id)sender
{
// 1. Slide in cancel and pause button
[UIView animateWithDuration:0.5f animations:^{
[startButton setCenter:CGPointMake(startButton.center.x + 300.0f, startButton.center.y)];
[cancelButton setCenter:CGPointMake(cancelButton.center.x + 300.0f, cancelButton.center.y)];
[pauseButton setCenter:CGPointMake(pauseButton.center.x + 300.0f, pauseButton.center.y)];
} completion:^(BOOL finished) {
if (finished) {
NSLog(#"Move finished");
}
}];
}
2) The view shaking animation related code
- (void)shakeView:(UIView *)viewToShake
{
CGFloat t = 2.0;
CGAffineTransform translateRight = CGAffineTransformTranslate(CGAffineTransformIdentity, t, 0.0);
CGAffineTransform translateLeft = CGAffineTransformTranslate(CGAffineTransformIdentity, -t, 0.0);
viewToShake.transform = translateLeft;
[UIView animateWithDuration:0.07 delay:0.0 options:UIViewAnimationOptionAutoreverse|UIViewAnimationOptionRepeat animations:^{
[UIView setAnimationRepeatCount:2.0];
viewToShake.transform = translateRight;
} completion:^(BOOL finished) {
if (finished) {
[UIView animateWithDuration:0.05 delay:0.0 options:UIViewAnimationOptionBeginFromCurrentState animations:^{
viewToShake.transform = CGAffineTransformIdentity;
} completion:nil];
}
}];
}
This isn't weird, it's a common problem with
auto layout. If you move UI elements by changing frames, then as soon as something else takes place that requires laying out views, the moved views will revert to the position defined by their constraints. To fix it, you either need to turn off auto layout, or do your animations by changing constraints not frames.
I have tried your code in my test project. The problem is probably because you are using Autolayout in your xib.
Please checking your xib file and uncheck the Autolayout property.
During a sliding animation(down, pause, then up back to the original position) of a subview, the device is rotated, so the superview is rotated. I want to keep the subview's width the same as the superview, so I need to resize it during its sliding animation.
Here is the sliding animation code:
[UIView animateWithDuration:0.3 animations:^{
self.frame = finalFrame;
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.3 delay:3 options:0 animations:^{
self.frame = initFrame;
} completion:^(BOOL finished) {
[self removeFromSuperview];
}];
}];
This is the method that is called when I detect rotation:
- (void)rotate:(NSNotification *)notif {
// What to do here to adjust the width but also keep the sliding animation going.
}
It seems there is no auto-resizing magic that can be used here. One must:
Record the progress of the animations.
On detection of rotations, cancel the old animations, adjust the view size, and add new animations starting from the current progress.
Here is a sample project for reference: http://d.pr/f/M4UW.
You can animate the bounds of the layer to change the width. Just make the height the same and apply an animation for the bounds.
If you want both animations to have the same duration, timing function etc. then you could add them both to an animation group and add that group to the layer you are animating.