Setting an animation for a toolbar from the beginning - ios

I have a textfield which has a UIDatePicker instead of a keyboard. I also made a toolbar not connected with the datePicker but that just appears when the textfield is tapped. The problem is the animations. The datePicker slides up nicely, but the toolbar just appears before the animation of the datePicker is done. This makes the whole thing look horrible. How would I set the animation to match the datePickers? I have no experience with animations and none of the other posts did any good for me.
EDIT
Based on Tareks answer I was able to set the animation to slide up by doing the following.
First, Setting the toolbar to bottom of screen
pickerBar = [[UIToolbar alloc] initWithFrame:CGRectMake(0, 480, 320, 44)];
Seconds, Changing the location of the toolbar in the animation
[UIView animateWithDuration:.4 animations:^(void) {
CGRect rect = CGRectMake(0, 224-46, 320, 44);
[pickerBar setFrame:rect];

you can use the inputAccessoryView for that reason.
textField.inputAccessoryView = [[UIToolbar alloc] init...

You can use code below to show your toolBar:
[UIView animateWithDuration:2.0 animations:^(void) {
toolBar.alpha = 1;
}];
EDIT:
toolBar.alpha should be 0.
For Sliding:
It is gonna something like:
[UIView animateWithDuration:2 animations:^{
int newY = yVal; // you can play with this newY.
CGRect frame = toolBar.frame;
frame.origin.y = newY;
toolBar.frame = frame;
}];

Related

Disable font animation in UIButton [duplicate]

This question already has answers here:
How to stop unwanted UIButton animation on title change?
(24 answers)
Closed 4 months ago.
I am animating a view that is sliding down. In the view there is a simple UIButton. The view and the button have fixed widths and heights (I checked with adding a color as background). Although when use:
[UIView animateWithDuration:0.3 delay:0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
//Slide Down the notification
CGRect notificationsRect = self.notificationContainerView.bounds;
notificationsRect.origin.y = 0;
notificationViewController.view.frame = notificationsRect;
} completion:^(BOOL finished) {
[notificationViewController didMoveToParentViewController:self];
self.currentNotification = notificationViewController;
}];
then the view slides down perfectly, expect for that the text in the UIButton kind of fades in. It starts really small and animates to the correct font size.
How can I disable the animation of the text in the UIButton?
Is the effect you have something similar to what is below? I tried to imitate your situation by having a view with a UIButton inside with some some text set for the title of the button. I then animated the button similarly to the way you did. As you can see there isn't really a fade happening on the text of my button inside my view that is sliding so I wonder if there is something else at play for you. I have the code I used below also to mock the situation.
- (void)viewDidLoad {
[super viewDidLoad];
self.myView = [[UIView alloc] initWithFrame:CGRectMake(200, 0, 100, 100)];
self.myView.backgroundColor = [UIColor greenColor];
UIButton *myButton= [[UIButton alloc] initWithFrame:CGRectMake(10, 0, 80, 80)];
myButton.backgroundColor = [UIColor blueColor];
[myButton setTitle:#"fun times" forState:UIControlStateNormal];
[self.myView addSubview:myButton];
[self.view addSubview:self.myView];
UIButton *resetButton = [[UIButton alloc] initWithFrame:CGRectMake(300, 300, 50, 50)];
resetButton.backgroundColor = [UIColor blackColor];
[resetButton addTarget:self action:#selector(reset) forControlEvents:UIControlEventTouchUpInside];
UIButton *goButton = [[UIButton alloc] initWithFrame:CGRectMake(300, 100, 50, 50)];
goButton.backgroundColor = [UIColor redColor];
[goButton addTarget:self action:#selector(go) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:goButton];
[self.view addSubview:resetButton];
}
- (void)reset {
[UIView animateWithDuration:0.3 delay:0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
//Slide Up the notification
CGRect notificationsRect = self.myView.bounds;
notificationsRect.origin.y = 0;
notificationsRect.origin.x = 200;
self.myView.frame = notificationsRect;
} completion:nil];
}
- (void)go {
[UIView animateWithDuration:0.3 delay:0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
//Slide Down the notification
CGRect notificationsRect = self.myView.bounds;
notificationsRect.origin.y = 200;
notificationsRect.origin.x = 200;
self.myView.frame = notificationsRect;
} completion:nil];
}
Disable animations for UIButton using setAnimationsEnabled:(BOOL)enabled
Reference:https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIView_Class/index.html#//apple_ref/occ/clm/UIView/setAnimationsEnabled:

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];

Hide and Show Other controls inside UIView, When Expand and Collapse a UIView

I am trying a Expand and Collapse UIView when user click on button, I use below code to perform this operation.
bool isShown = true;
-(IBAction)btnClick:(id)sender{
if (!isShown) {
[UIView animateWithDuration:0.25 delay:0.1f
options:UIViewAnimationOptionTransitionFlipFromTop animations:^{
myView.frame = CGRectMake(0, 275, 320, 50);
} completion:nil];
isShown = true;
} else {
[UIView animateWithDuration:0.25 delay:0.1f
options:UIViewAnimationOptionCurveEaseOut animations:^{
myView.frame = CGRectMake(0, 75, 320, 250);
} completion:nil];
isShown = false;
}
}
Problem:
When i Add Controls inside myView like UILabel and UITextView, those controls still showing when i collapse my view. I mean i don't want to show controls inside myView when i make my View Collapse and when i expand show all controls. I try to hide when i collapse but the animation doesn't look good.
And default frame size of myView is myView.frame = CGRectMake(0, 275, 320, 50);

Show banner from top of the screen

I want to create a turn-based match. When player received a notification player:receivedTurnEventForMatch:didBecomeActive:
I want to show a banner that slides from the top of the screen. "Your turn. Play" similar to the banner that Game Center shows when player is authenticated.
How can I do it? Should it be a UIViewController or UIAlert, or what?
here is a good example for notification for what you want, i hope that help you:
https://github.com/ekurutepe/MPNotificationView
or
https://github.com/edgurgel/CMNavBarNotificationView
or
https://github.com/terryworona/TWMessageBarManager
There are MANY ways to do what you mentioned. This is just one of them. Feel free to change the code around and read up on UIView animations to you can try out different things yourself.
-(void)myMethod {
// create UILabel and set its properties
UILabel *myLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 20, 320, 50)];
myLabel.backgroundColor = [UIColor grayColor];
NSString *myLabelText = #"Welcome back, Mike Lyman"; // showing you to use NSString for label text
myLabel.textAlignment = NSTextAlignmentCenter;
myLabel.text = myLabelText;
[self.view addSubview:myLabel]; // add UILabel to view
myLabel.frame = CGRectMake(0, -50, 320, 50); // set text label frame offscreen
// start the animation to slide UILabel into visible view
[UIView animateWithDuration:0.5 delay:0
options:UIViewAnimationOptionCurveLinear
animations:^ {
myLabel.frame = CGRectMake(0, 20, 320, 50);
}
completion:^(BOOL finished) {
// after 1 second delay, start sliding UILabel out of visible view
[UIView animateWithDuration:0.5 delay:1
options:UIViewAnimationOptionCurveLinear
animations:^ {
myLabel.frame = CGRectMake(0, -50, 320, 50);
}
completion:^(BOOL finished) {
NSLog(#"Done");
[self.view removeFromSuperview]; // remove UILabel from view completely
}];
}];
}

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.

Resources