How to animate UISearchbar frame change keeping the rounded caps? - ios

I would like to animate the frame change of the UISearchbar. I would like it to expand and collapse when tapped on a search button.
Am using UIViewAnimationBlock to animate
[UIView animateWithDuration:0.5
delay:0
options:UIViewAnimationOptionLayoutSubviews
animations:^{
//Set the frame you want to the search bar
}
completion:^(BOOL finished) {
}];
I have to expand the frame from zero and collapse it back. But while animating, the search bar loses its rounded edges and becomes a rectangle. Here is a screenshot of it while still animating
Well it doesn't look good.. I want it to keep its rounded edges while expanding or collapsing. Is it possible ? If yes how ?
Any help would be much appreciated.

You can not change height of a UISearchBar try setting frames with height of 44px.
And if you want to change height then use CGAffineTransformMakeScale like..
//FOR EXPAND USE THIS:
[UIView animateWithDuration:0.5
delay:0
options:UIViewAnimationOptionLayoutSubviews
animations:^{
self.searchBar.transform = CGAffineTransformMakeScale(1.0, 1.0);
}
completion:^(BOOL finished) {
}];
and
//FOR EXPAND USE THIS:
[UIView animateWithDuration:0.5
delay:0
options:UIViewAnimationOptionLayoutSubviews
animations:^{
self.searchBar.transform = CGAffineTransformMakeScale(0.001, 0.001);
}
completion:^(BOOL finished) {
}];

Related

UiTableview cell scaling animation

Hi I am new to IOS devlopment.I need my table view cell to animate like scaling animation(i. e.whenever I scroll up, the cell size need to scale out (increase) from center position based on scrolling position and whenever I scroll down the cell size should scale in(decrease) based on scrolling position).I tried to find but I can't able to trigger out the actual solution.Can anyone help me out regarding this.Thanks for your help in advance
I tried to animate the UIImageView in UITableViewCell. This is just an idea, You can change it as per your requirement.
Write the Following code in cellForRowAtIndexPath method.
cell.animatedImageView.transform=CGAffineTransformIdentity;
[UIView animateWithDuration:1
delay:0
options:UIViewAnimationOptionBeginFromCurrentState
animations:(void (^)(void)) ^{
cell.animatedImageView.transform=CGAffineTransformMakeScale(1.5, 1.5);
}
completion:^(BOOL finished){
if (finished) {
[UIView animateWithDuration:1
delay:0
options:UIViewAnimationOptionBeginFromCurrentState
animations:(void (^)(void)) ^{
cell.animatedImageView.transform=CGAffineTransformMakeScale(1, 1);
}
completion:^(BOOL finished){
cell.animatedImageView.transform=CGAffineTransformIdentity;
}];
}
}];
Let me know if you have any query.

Bouncing animation while changing view frame

Add bouncing animation while changing UIVIew frame. I only know how to change frame but I don't know how to set bouncing effect while changing view frame. Below is my code....
[UIView animateWithDuration:0.3 delay:0.0 options:UIViewAnimationOptionBeginFromCurrentState animations:^{
CGRect frame = viewContent.frame;
frame.size.height = CGRectGetHeight(viewContentFullDetail);
viewContent.frame = frame;
} completion:^(BOOL finished) { }];
You can check animated gif image on below link. I want to add animation not same like this but near to this. Main animation are unfolding and bouncing effect.
https://drive.google.com/open?id=0B9k_Shyb5v62eFdxWXhYeXV3a0E
Please help. I don't know how to do this.
You need to try this
int duration, damping, velocity;
[UIView animateWithDuration:duration delay:0
usingSpringWithDamping:damping initialSpringVelocity:velocity
options:0 animations:^{
// your animation code here
} completion:nil];
Play with the damping and velocity values to know more about this feature in the animation code.
here is the link for a tutorial

iOS how to animate view scaling from the center of the view?

I'm using an affine transform within a repeating/reversing animation to create a "pulsing" effect. However, I noticed that the button gets shifted right when the animation begins. The anchor point for the button is at (0.5,0.5):
[UIView animateWithDuration:0.5
delay:0
options:UIViewAnimationOptionRepeat|
UIViewAnimationOptionAutoreverse|
UIViewAnimationOptionAllowUserInteraction|
UIViewAnimationCurveEaseInOut
animations:^{
self.recordButton.transform = CGAffineTransformMakeScale(1.2, 1.2);
} completion:^(BOOL finished) {
}];
It appears that when the transform is applied, the origin of the button's frame stays at the same spot.
How can I animate scale transform so the center of the button remains in the same spot once the transform is applied?
I usually play with the frame and CGRect utility functions
[UIView animateWithDuration:0.5
delay:0
options:UIViewAnimationOptionRepeat|
UIViewAnimationOptionAutoreverse|
UIViewAnimationOptionAllowUserInteraction|
UIViewAnimationCurveEaseInOut
animations:^{
self.recordButton.frame = CGRectInset(self.recordButton.frame, -1.2, -1.2);
} completion:^(BOOL finished) {
}];

How to make UIView move by click?

I'm not sure whether I can describe it properly. It's a kind of UIView, and we see only it's part (with arrow,maybe. on the bottom of screen,maybe). User can click on it, and this view appears fullscreen(usually developer leaves there some additional information). How can I make it?
Try this:
-(void)show
{
[viewObj setFrame:CGRectMake(viewObj.frame.origin.x,viewObj.frame.origin.y,viewObj.frame.size.width, viewObj.frame.size.height)];//Here "viewObj.frame.origin.y" means 568
[UIView animateWithDuration:0.5 animations:^
{
[viewObj setFrame:CGRectMake(viewObj.frame.origin.x,0,viewObj.frame.size.width, viewObj.frame.size.height)];
}
completion:^(BOOL finished)
{
}];
}
-(void)hide
{
[viewObj setFrame:CGRectMake(viewObj.frame.origin.x,viewObj.frame.origin.y,viewObj.frame.size.width, viewObj.frame.size.height)];//Here "viewObj.frame.origin.y" means 0
[UIView animateWithDuration:0.5 animations:^
{
[viewObj setFrame:CGRectMake(viewObj.frame.origin.x,568,viewObj.frame.size.width, viewObj.frame.size.height)];
}
completion:^(BOOL finished)
{
}];
}
i just put the logic that just setting of view Y coordinate of That View and when user click on Button. that et animation and at the re setting the view frame with Y coordinate setting like:
yourview.frame = CGRectMake(0,280,320,568);
[UIView animateWithDuration:2
delay:0.1
options: UIViewAnimationOptionTransitionFlipFromBottom
animations:^{
yourview.frame = CGRectMake(0, 0, 320, 568);
}
completion:^(BOOL finished){
}];
Also see this example:
https://github.com/crocodella/PullableView
Here above github demo this same that you are looking for its output like:
Look at UIView reference:
https://developer.apple.com/library/ios/documentation/uikit/reference/uiview_class/uiview/uiview.html
Specifically:
#property(nonatomic) CGPoint center
And
+ (void)animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations
Example:
[UIView animateWithDuration:2.0 animations:^{
myView.center = CGPointMake(self.view.center.x, self.view.center.y + myOffset);
}];
Duration is in seconds. In this case, 2 seconds.
If you're using AutoLayout, you probably want to change the layout constant, rather then center property.
About Layout Constrains:
https://developer.apple.com/library/ios/documentation/AppKit/Reference/NSLayoutConstraint_Class/NSLayoutConstraint/NSLayoutConstraint.html
Look at constant property. You can also drag a constrain outlet from Interface Builder and access its constant. It's really simple once you get to know it a bit.

Label animation moving text - iOS

I'm using this block to animate a pulse on my text and when I do, the text moves to the right some and jerks back. Seems like it is due to some padding or something being added by interface builder.
[UIView animateWithDuration:0.5 animations:^{
// grow the label up to 130%, using a animation of 1/2s
myLabel.transform = CGAffineTransformMakeScale(1.3,1.3);
} completion:^(BOOL finished) {
// When the "grow" animation is completed, go back to size 100% using another animation of 1/2s
[UIView animateWithDuration:0.5 animations:^{
myLabel.transform = CGAffineTransformIdentity;
}];
}];
Reduce the anchorPoint by a factor of 1.3 on the way back. Change your code to this -
CGPoint anchorPoint = myLabel.layer.anchorPoint;
[UIView animateWithDuration:0.5 animations:^{
// grow the label up to 130%, using a animation of 1/2s
myLabel.transform = CGAffineTransformMakeScale(1.3,1.3);
} completion:^(BOOL finished) {
// When the "grow" animation is completed, go back to size 100% using another animation of 1/2s
myLabel.layer.anchorPoint = CGPointMake(anchorPoint.x/1.3, anchorPoint.y/1.3);
[UIView animateWithDuration:0.5 animations:^{
myLabel.transform = CGAffineTransformIdentity;
}];
}];
I tried your code. It is working fine for the labels which text is fitted in the label properly or those labels have the text alignment center.
So my suggestion is if you have label having static or fixed text then give the background color to label and check for label text if it is too large then make it as such so that text fit to label properly. Then your code will work fine.
Now if you have dynamic text then try to calculate the label width dynamically as below
UIFont *font = [UIFont systemFontOfSize:9.0];
CGSize stringSize;
stringSize = [myLabel.text sizeWithFont:font constrainedToSize:CGSizeMake(1000, myLabel.frame.size.height) lineBreakMode:UILineBreakModeWordWrap];
Then assign stringSize.width as mylabel width. Means here you will change the width of label dynamically.
Then you code will work fine as you want.
You should try this code i think it will help you,first it will Zoom your image to 130 % then it will zoom out your image to the original size
[UIView animateWithDuration:0.5 animations:^{
myLabel.transform = CGAffineTransformMakeScale(1.3,1.3);
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.5 animations:^{
myLabel.transform = CGAffineTransformMakeScale(1,1);
myLabel.hidden=YES;
}];
}];

Resources