Label animation moving text - iOS - 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;
}];
}];

Related

Can I animate the size||color of an NSAttributedString?

I have a string like "Points (67)" that is displayed on a label.
Sometimes in my app, the points total can change, via an NSNotification.
So, perhaps it will change to "Points (117)". I don't want this to happen instantly, as the user's eye is likely to miss the change. I'd like them to notice.
I would like to just animate the 67 to 117 part. Possibly the size, maybe growing by 10% as it changes, then shrinking back down 10% to original size. Or perhaps the color. Preferably size, but I'm guessing that's not possible without creating additional labels.
Is this doable?
You cant animate the Font size ,But yes u can scale the UILabel through which you can achieve your goal.
Below are two ways through which you show changes in UILabel font sizes.
UIView Animation
[UIView transitionWithView:yourlabel duration:0.5 options:UIViewAnimationOptionTransitionCrossDissolve animations:^{
yourlabel.font = [UIFont fontWithName:#"HelveticaNeue" size:14.0];
}];
Scale Animation
CABasicAnimation*scaleAnimation[CABasicAnimationanimationWithKeyPath:#"transform.scale.xy"];
scaleAnimation.fromValue = #(1);
scaleAnimation.toValue = #00.5;
scaleAnimation.duration = self.animationDuration;
[yourlabel addAnimation:self.animationGroup forKey:#"pulse"];
You can do following animation to make user to notice the change:
[label setTransform:CGAffineTransformMakeScale(1.0, 1.0)];
[UIView animateWithDuration:0.3 animations:^
{
[label setTransform:CGAffineTransformMakeScale(1.5, 1.5)];
}
completion:^(BOOL finished)
{
if(finished)
{
[UIView animateWithDuration:0.15 animations:^
{
[label setTransform:CGAffineTransformMakeScale(1.0, 1.0)];
label.text = #"Points (117)";
}];
}
}];
You can change duration and scale as per your requirement....
Hope this will help you.

Calling [table reloadData] removes table's position change from [uiview animatewithduration]

There is a button that horizontally shifts my table.
- (void)togglePreferencePageVisibility:(id)sender {
int translation = [self preferencesVisible] ? -PREFERENCE_TRANSLATION_HEIGHT : PREFERENCE_TRANSLATION_HEIGHT;
//animate tableview down
[UIView animateWithDuration:0.3
delay:0
options: UIViewAnimationCurveEaseOut
animations:^{
_table.center = CGPointMake(_table.center.x, _table.center.y+translation);
}
completion:^(BOOL finished){
}];
}
When I call [_table reloadData], the table reverts to its original position. I tried manually readjusting the table position, like so
NSLog(#"before %#", NSStringFromCGRect(_table.frame));
[_table reloadData];
_table.frame = CGRectMake(initialTablePosition.x, initialTablePosition.y+PREFERENCE_TRANSLATION_HEIGHT, _table.frame.size.width, _table.frame.size.height);
NSLog(#"after %#", NSStringFromCGRect(_table.frame));
but no luck. Also the frame's have the same y position before and after.
You need to also adjust the auto layout constraints using the NSLayoutConstraint class. You can add, remove or change the values of NSLayoutConstraints. This is a VERY common question on stack overflow right now, due to the change from iOS 7 to iOS 8.
If you do not adjust the layout constraints then the view will be repositioned back to its original location. reloadData redraws the UITableView which causes the view hierarchy to reexamine its positions e.t.c.
As an example of making a view with a width constraint narrower:
CGRect frame = myView.frame;
frame.size.width -= 100;
//Next line now needed in iOS 8
myWidthConstraint.constant -= 100;
[UIView animateWithDuration:0.5 animations:^{
[myView setFrame:frame];
}];
EDIT: moving back example:
CGRect frame = myView.frame;
frame.size.width += 100;
//Next line now needed in iOS 8
myWidthConstraint.constant += 100;
[UIView animateWithDuration:0.5 animations:^{
[myView setFrame:frame];
}];
When using auto layout, you should not set any frames. If you do, when the view needs to redraw itself, the frame will be reset to the frame defined by its constraints. You should add an IBOutlet to a constraint between your table view and the top (or bottom what ever works for your use) of its superview (I'll call it topCon in the example below).
- (void)togglePreferencePageVisibility:(id)sender {
int translation = [self preferencesVisible] ? -PREFERENCE_TRANSLATION_HEIGHT : PREFERENCE_TRANSLATION_HEIGHT;
//animate tableview down
self.topCon.constant += translation; // this might need to be "-=" depending on whether your constraint is to the top or bottom
[UIView animateWithDuration:0.3
delay:0
options: UIViewAnimationCurveEaseOut
animations:^{
[self.view layoutIfNeeded];
}
completion:^(BOOL finished){
}];
}

Correctly Using CGAffineTransformMakeScale

I have a UIButton laid out using storyboard. The button just contains an image. When the button is clicked, I want to animate the size of the button - decrease in size and then bring it back to the original size again.
I used the following code -
[UIView animateWithDuration:2.0 animations:^{
_favButton.transform = CGAffineTransformMakeScale(0.5, 0.5);
}completion:^(BOOL finished) {
[UIView animateWithDuration:2.0 animations:^{
_favButton.transform = CGAffineTransformMakeScale(1, 1);
}];
}];
This code moves my button on the screen which I do not want. I want the center of the button to be fixed and the size be animated.
I have not used any Top Constraint in the storyboard for the button. How can I rectify this behaviour?
If you have auto layout turned on, you would need to turn it off.
But it doesn't seem to your problem here as per your description.
I would do the following to re-adjust to the center as it scales:
CGPoint cP = _favButton.center;
[UIView animateWithDuration:2.0 animations:^
{
_favButton.transform = CGAffineTransformMakeScale(0.5, 0.5);
_favButton.layer.position = cp;
}
completion:^(BOOL finished)
{
[UIView animateWithDuration:2.0 animations:^
{
_favButton.transform = CGAffineTransformMakeScale(1, 1);
_favButton.layer.position = cp;
}];
}];
Hope this helps.
SWIFT 3
button.transform = CGAffineTransform(scaleX: 0.1, y: 0.1)

How to animate UISearchbar frame change keeping the rounded caps?

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) {
}];

UILabel always animates to same spot

I have a UILabel called "nameLabel" and I have it inside an animation block so that this happens:
_nameLabel.alpha = 1;
CGAffineTransform translate = CGAffineTransformMakeTranslation(50, 50);
_nameLabel.transform = translate;
I thought that animates the UILabel to the spot I specify but it just animates from the above spot to the place where I have it in the Interface Builder. Any help here?
Can you post the animation block and other associated code? I am not sure what CGAffineTransformMakeTranslation does with the label, but if you want to animate the frame location, you can use this:
CGRect frame = _nameLabel.frame;
frame.origin.y = 100; //Desired height, origin.x can be modified as well.
//You can also change the frame size here but it wont work on UILabels, you will need `CGAffineTransformScale` for that.
[UIView animateWithDuration: 1.5
delay:0.0
options:UIViewAnimationCurveEaseInOut | UIViewAnimationOptionBeginFromCurrentState
animations:^ {
[_nameLabel setFrame:frame];
}
completion:^ (BOOL finished) {
}];
Edit: The other way:
CGRect frame = _nameLabel.frame;
frame.origin.y = 100;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDuration:0.5];
[_nameLabel setFrame: newFrame];
[UIView commitAnimations];
Current state is probably the current location of the label, try that first but if nothing happens, remove UIViewAnimationOptionBeginFromCurrentState or set the frame of the label to another location before the animation, and move it to its initial (the one in the xib file) position in the animation block, its your call.
Watch out because Autolayout cause a lot of problems.
Try to deselect 'Use Autolayout'
It solves to me all the problems trying to translate objects.

Resources