I would like to resize UIView from right side to left (opposite).
Now I have view with rect like this: CGRectMake(100.f, 0.f, 100.f, 100.f);
[UIView animateWithDuration:0.5 animations:^{
view.frame = CGRectMake(0.f, 0.f, 200.f, 100.f);
}];
The problem is that animation is not nice. It bounces to the right (gets bigger) and than moves to location 0.0,0.0.
I would like to achieve the same effect like when resizing from left to right.
EDIT: code
- (void)resizeSearchBar:(int)type
{
//resize - bigger
if (type == 1) {
[UIView animateWithDuration:1.0 animations:^{
self.searchBar.frame = CGRectMake(0.f, 0.f, 280.f, 44.f);
}];
}
//resize - smaller
else {
[UIView animateWithDuration:1.0 animations:^{
self.searchBar.frame = CGRectMake(95.f, 0.f, 185.f, 44.f);
}];
}
}
EDIT 2
I've also tried to change View properties in IB like that:
Still no luck...
Got it to work with the hint from this answer: Can't animate the frame or bounds of a UISearchBar
The trick is to call [searchBar layoutSubviews]; in your animation block after setting the frame.
Here is what I got to work in my sample:
- (IBAction)resizeButtonTapped:(id)sender {
//resize - bigger
if (searchBar.frame.origin.x == 95) {
[UIView animateWithDuration:1.0 animations:^{
self.searchBar.frame = CGRectMake(0.f, 0.f, 280.f, 44.f);
[searchBar layoutSubviews];
}];
}
//resize - smaller
else {
[UIView animateWithDuration:1.0 animations:^{
self.searchBar.frame = CGRectMake(95.f, 0.f, 185.f, 44.f);
[searchBar layoutSubviews];
}];
}
}
I think this is useful to you just see bellow demo link...
https://github.com/ipup/PPRevealSideViewController?_tmc=UFw1P_Ai9brJd4WEpSlPbNrXBWOvsYZ6gNPi_derQik
i hope this help you..
:)
edited...
[UIView animateWithDuration:0.5
delay:4.0
options: UIViewAnimationOptionTransitionCrossDissolve
animations:nil
completion:^{
view.frame = CGRectMake(0.f, 0.f, 200.f, 100.f);}];
not sure but try this and also use different Animation like "UIViewAnimationOptionTransitionCrossDissolve",etc....
hope this help you....
It bounces because the duration is much less!!
Increase the duration ..and i think it will make it more clear how it animates
K try this
[UIView animateWithDuration:1.0
delay:0.0
options:UIViewAnimationCurveEaseInOut
animations:^ {
self.searchBar.frame = CGRectMake(0.f, 0.f, 280.f, 44.f);
}
completion:^(BOOL finished) {
}];
Chk here for Options
Related
I want to move my UIView from left to right in a repeatedly till the view not reached at the boundary of the right side. the below code running repeatedly but move only 5 points and repeat from starting point i want to repeat from last current state and the +5 to move further.
CGPoint pos = mover.center;
pos.x=25;
int count = 25;
[UIView beginAnimations:nil context:NULL];
pos.x=count;
[UIView setAnimationDuration:0];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationRepeatCount:INFINITY];
//[UIView setAnimationRepeatAutoreverses:YES];
// CGPoint pos = mover.center;
//pos.x +=5;
count = (pos.x+=5);
mover.center = pos;
i want to see object moving in +5 points interval.
and i'm new in objective c and iphone so please help me as fast as possible .
basically my task is move view on the border of the screen mean (left to right ,up to down ,right to left and down to up) means move view in in sequence and through border of the screen of simulator repeatedly.
i hope your answer helpful to me and other who is new in this technology(iPhone).
thank you very much.
To move view from one position to another i would set its frame inside animation block. Something like this would help you:
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
// `customView` is a UIView defined in .h file
customView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
customView.backgroundColor = [UIColor redColor];
[self.view addSubview:customView];
[self rotateViewInSelfBoundary];
}
-(void)rotateViewInSelfBoundary
{
CGRect screen = [[UIScreen mainScreen] bounds];
// Top Left to top right
[UIView animateWithDuration:3.0f
animations:^{
[customView setFrame:CGRectMake(screen.size.width - customView.frame.size.width, 0, 100, 100)];
}
completion:^(BOOL finished)
{
// Top right to bottom right
[UIView animateWithDuration:3.0f
animations:^{
[customView setFrame:CGRectMake(screen.size.width - customView.frame.size.width, screen.size.height - customView.frame.size.height, 100, 100)];
}
completion:^(BOOL finished)
{
// bottom right to bottom left
[UIView animateWithDuration:3.0f
animations:^{
[customView setFrame:CGRectMake(0, screen.size.height - customView.frame.size.height, 100, 100)];
}
completion:^(BOOL finished)
{
// bottom left to top left
[UIView animateWithDuration:3.0f
animations:^{
[customView setFrame:CGRectMake(0, 0, 100, 100)];
}
completion:^(BOOL finished)
{
// call the same function again.
[NSObject cancelPreviousPerformRequestsWithTarget:self selector:#selector(rotateViewInSelfBoundary) object:nil];
[self performSelector:#selector(rotateViewInSelfBoundary) withObject:nil afterDelay:0.0f];
}];
}];
}];
}];
}
Screen shots:
use UIViewAnimationOptionBeginFromCurrentState like
[UIView animateWithDuration:1.0f
delay:2.0f
options:UIViewAnimationOptionRepeat | UIViewAnimationOptionBeginFromCurrentState
animations:^{
//your animation
}
completion:nil];
If you want to move the view in a square, define the four CGPoint values it should animate between and then:
NSArray *values = #[[NSValue valueWithCGPoint:point0],
[NSValue valueWithCGPoint:point1],
[NSValue valueWithCGPoint:point2],
[NSValue valueWithCGPoint:point3],
[NSValue valueWithCGPoint:point0]];
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:#"position"];
animation.values = values;
animation.duration = 5.0;
animation.repeatCount = HUGE_VALF;
[mover.layer addAnimation:animation forKey:#"moveAroundBorder"];
This will take care of all of the moving of the view with no further intervention on your part.
If you want to use the iOS 7 block-based key-frame animation, it would be:
[UIView animateWithDuration:5.0 delay:0.0 options:UIViewAnimationOptionCurveLinear animations:^{
[UIView animateKeyframesWithDuration:5.0 delay:0.0 options:UIViewKeyframeAnimationOptionRepeat | UIViewKeyframeAnimationOptionCalculationModeLinear animations:^{
[UIView addKeyframeWithRelativeStartTime:0.00 relativeDuration:0.25 animations:^{
mover.center = point0;
}];
[UIView addKeyframeWithRelativeStartTime:0.25 relativeDuration:0.25 animations:^{
mover.center = point1;
}];
[UIView addKeyframeWithRelativeStartTime:0.50 relativeDuration:0.25 animations:^{
mover.center = point2;
}];
[UIView addKeyframeWithRelativeStartTime:0.75 relativeDuration:0.25 animations:^{
mover.center = point3;
}];
} completion:nil];
} completion:nil];
Note the curious nesting of animateKeyframesWithDuration within the animateWithDuration. That's because the UIViewKeyframeAnimationOptionCalculationModeLinear curiously does not stop the "ease in / ease out" behavior, so you have to specify UIViewAnimationOptionCurveLinear on the outer animation block.
The question explains it all actually.
I load a custom UIView on top of my current view, animated, using this code:
- (void)showView
{
self.blurView.alpha = 0.f;
[UIView animateWithDuration:2.0 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction animations:^
{
self.blurView.alpha = 1.f;
} completion:^(BOOL finished) {
[UIView animateWithDuration:2.0 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction animations:^
{
self.blurView.alpha = 0.f;
} completion:nil];
}];
}
It works, but when I perform -(void)showView again while it is still animating, the custom view doesn't get removed from the screen.
It just stays like this:
I figured out what the problem was.
blurView is a public variable and every time I did -(void)showView it used the same variable, setting the alpha to 0.f just once, thus never changing the alpha of the first show.
I declared the variable blurView in the method itself and now it works because every blurView gets it's own pointer.
-(void)someMethod
{
//Create a live blur view
FXBlurView *blurView = [[FXBlurView alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
blurView.center = CGPointMake(self.view.window.frame.size.width / 2, self.view.window.frame.size.height / 2);
blurView.layer.cornerRadius = 20.f;
[self.view.window addSubview:blurView];
[self showView:(blurView)];
}
- (void)showView:(FXBlurView *)blurView
{
//Make full transparent before showing
blurView.alpha = 0.f;
//Start animation
[FXBlurView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction animations:^
{
blurView.alpha = 1.f;
} completion:^(BOOL finished) {
if (finished)
{
//End animation
[FXBlurView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction animations:^
{
blurView.alpha = 0.f;
} completion:nil];
}
}];
}
You should add to the top of your function this line:
[self.view.layer removeAllAnimations];
It will remove all of the active animations.
It doesn't work because you have implemented a delay, use animation block with delay - it will create animation keys that could be removed with this function above.
[UIView animateWithDuration:0.3 delay:0.0
options:UIViewAnimationOptionAllowUserInteraction
animations:^
{
// ...
} completion:NULL];
I'm trying to animate an image to rotate left and right when selected, basically to let the user which the object they're touching.
I found some code for animating:
- (void)rotateImage:(UIImageView *)image duration:(NSTimeInterval)duration
curve:(int)curve degrees:(CGFloat)degrees delay:(CGFloat)delay
{
// Setup the animation
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDelay:delay];
[UIView setAnimationDuration:duration];
[UIView setAnimationCurve:curve];
[UIView setAnimationBeginsFromCurrentState:YES];
// The transform matrix
CGAffineTransform transform =
CGAffineTransformMakeRotation(DEGREES_TO_RADIANS(degrees));
image.transform = transform;
// Commit the changes
[UIView commitAnimations];
}
However, when I try to run two animations, only the last one ever works. Even with a proper delay, only the second animation will show:
[self rotateImage:self duration:.5
curve:UIViewAnimationCurveEaseIn degrees:60 delay:0];
[self rotateImage:self duration:.5
curve:UIViewAnimationCurveEaseIn degrees:-60 delay:5];
What can I do to create the animation so it rotates left, then rotates right?
[UIView animateWithDuration:0.2 animations:^{
// animation left
[UIView setAnimationDelay:10];
} completion:^(BOOL finished){
[UIView animateWithDuration:0.2 animations:^{
// animation right
} completion:^(BOOL finished){
// done
}];
}];
found it here
https://developer.apple.com/library/content/featuredarticles/Short_Practical_Guide_Blocks/
[UIView animateWithDuration:0.5f delay:0.0f options:UIViewAnimationOptionCurveEaseIn animations:^{
self.view.transform = CGAffineTransformMakeRotation(DEGREES_TO_RADIANS(60));
} completion:^(BOOL finished){
[UIView animateWithDuration:0.5f delay:5.0f options:UIViewAnimationOptionCurveEaseIn
animations:^{
self.view.transform = CGAffineTransformMakeRotation(DEGREES_TO_RADIANS(-60));
}
completion:^(BOOL finished){}];
}];
Animation blocks are definitely the way to go. This should replicate what you're trying to do, including the easing. This assumes your calling from a view controller, but if your putting this code into a UIView or UIImageView, then just replace self.view with self.
[UIView animateWithDuration:0.5f delay:0.0f options:UIViewAnimationOptionCurveEaseIn animations:^{
self.view.transform = CGAffineTransformMakeRotation(DEGREES_TO_RADIANS(60));
} completion:^(BOOL finished){}];
[UIView animateWithDuration:0.5f delay:5.0f options:UIViewAnimationOptionCurveEaseIn animations:^{
self.view.transform = CGAffineTransformMakeRotation(DEGREES_TO_RADIANS(-60));
} completion:^(BOOL finished){}];
The main UIView contains two subviews - UIView_1 and UIView_2.
In the UIView_2, there is a button to show or hide the UIView_1.
For example, when a user touches the button to show the UIView_1, then UIView_1 will slide down and UIView_2 will push downwards with transition.
I have very little knowledge in animation. Can someone show me some sample code for reference?
Should I use CGAffineTransformMakeTranslation?
Thanks.
You don't need anything so complex. Just change the view's frame size.
NSTimeInterval animationDuration = /* determine length of animation */;
CGRect newFrameSize = /* determine what the frame size should be */;
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:animationDuration];
theViewToChange.frame = newFrameSize;
[UIView commitAnimations];
Simply Hide/show with fadein/out effect
`
/To Show/
sliderView.hidden = NO;
sliderView.alpha = 0.1;
[UIView animateWithDuration:0.25 animations:^{
sliderView.alpha = 1.0f;
} completion:^(BOOL finished) {
// do some
}];
/To hide/
[UIView animateWithDuration:0.25 animations:^{
sliderView.frame = CGRectMake(130, 30, 0, 0);
[sliderView setAlpha:0.1f];
} completion:^(BOOL finished) {
sliderView.hidden = YES;
}];
`
It depends on what you want to do with UIView_2.
Place UIView_1 below UIView_2 in Interface Builder.
Size UIView_2 to take up all the space below the UINavigationBar.
Use the following code to either resize (using uiview2_resized_rect) the frame for UIView_2, or translate/move the frame for UIView_2 (using uiview2_translated_rect ):
CGRect uiview1_original_rect = UIView_1.frame;
CGRect uiview2_original_rect = UIView_2.frame;
CGRect uiview2_translated_rect = CGRectMake(uiview2_original_rect.origin.x,
uiview2_original_rect.origin.y+uiview1_original_rect.size.height,
uiview2_original_rect.size.width,
uiview2_original_rect.size.height);
CGRect uiview2_resized_rect = CGRectMake(uiview2_original_rect.origin.x,
uiview2_original_rect.origin.y+uiview1_original_rect.size.height,
uiview2_original_rect.size.width,
uiview2_original_rect.size.height-uiview1_original_rect.size.height);
[UIView animateWithDuration:0.300 delay:0.0
options:UIViewAnimationOptionCurveEaseInOut|UIViewAnimationOptionBeginFromCurrentState
animations:^{
//uncomment this and comment out the other if you want to move UIView_2 down to show UIView_1
//UIView_2.frame = uiview2_translated_rect;
UIView_2.frame = uiview2_resized_rect;
} completion:^(BOOL finished) {
}];
I have 2 layer is top and bottom on my program
how can i remove top layer with animation or bring top layer to back is it possible?
The easiest is playing with frame and alpha before removing it.
You can get some cool effects
-(void)removeWithEffect:(UIView *)myView
{
[UIView beginAnimations:#"removeWithEffect" context:nil];
[UIView setAnimationDuration:0.5f];
//Change frame parameters, you have to adjust
myView.frame = CGRectMake(0,0,320,480);
myView.alpha = 0.0f;
[UIView commitAnimations];
[myView performSelector:#selector(removeFromSuperview) withObject:nil afterDelay:0.5f];
}
iOS Update
You can now use blocks to perform your animation
[UIView animateWithDuration:0.5f
animations:^{view.alpha = 0.0;}
completion:^(BOOL finished){ [view removeFromSuperview]; }];
If you're targetting iOS 4.0 upwards you can use animation blocks:
[UIView animateWithDuration:0.2
animations:^{view.alpha = 0.0;}
completion:^(BOOL finished){ [view removeFromSuperview]; }];
(above code comes from Apple's UIView documentation)