CODEWITHSUNDEEP
iosuiviewanimation
Soo
Soo

Reputation: 397

animation duration on iOS

I want to make some notification boxes with animation duration. These boxes would slide down (from the top) until they cover the status bar and nav bar (0.3s), be static and visible for approximately 2.4 seconds, then slide back up off the screen (0.3s).

I roughly make them as below:

notificationLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 320, 64)];
[UIView animateWithDuration:0.3 delay:2.4 options:UIViewAnimationOptionCurveLinear animations:^{notificationLabel.frame = CGRectMake(0,-64, 320, 64);} completion:nil];

These codes have two problems. First I cannot show this notification label's position on top bar. If I make some scroll down, I should slide up to see this label. I just want to see this like navigation bar.

Second, to show and hide notification label is not exact time. How can I change my code for these problems?

Please let me know. Thanks.

Upvotes: 1

Views: 669

Answers (2)

Forrest
Forrest

Reputation: 620

What i would suggest is using keyframes. This means that you add animations in series with relative start times. a little example is below:

//Create your label above the screen outside of the field of view.
    notificationLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, -64, 320, 64)];

//Add your subview to the window here. Whether its adding it to a subview or to the main window
// ex. [self.view addSubview:notificationLabel];

[UIView animateKeyframesWithDuration:3.0f delay:0.0f options:UIViewKeyframeAnimationOptionAllowUserInteraction animations:^{
    [UIView addKeyframeWithRelativeStartTime:0.0f relativeDuration:0.3f animations:^{
        //Animate the sliding down of your notification here at 0.0 seconds and it lasts 0.3 seconds
        [notificationLabel setFrame:CGRectMake(0,0, 320, 64)];
    }];
    [UIView addKeyframeWithRelativeStartTime:0.3f relativeDuration:2.4f animations:^{
        //Animate the sliding down of your notification here at 0.3 seconds and it lasts 2.4 seconds
        //really, you'll do nothing here. so this frame is optional.
    }];
    [UIView addKeyframeWithRelativeStartTime:2.7f relativeDuration:0.3f animations:^{
        //Animate the sliding up of your notification here at 0.0 seconds and it lasts 0.3 seconds
        [notificationLabel setFrame:CGRectMake(0,-64, 320, 64)];
    }];
} completion:nil];

Upvotes: 1

Gad
Gad

Reputation: 2877

The way I display a notification on top of the navigation\status bar is by adding it to the keyWindow like so:

[[UIApplication sharedApplication].keyWindow addSubview:notificationLabel];

Then in order to animated it the way you described:

notificationLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, -64, 320, 64)];
[UIView animateWithDuration:0.3 animations:^{
    notificationLabel.frame = CGRectMake(0, 0, 320, 64);
} completion:^(BOOL finished) {
    [UIView animateWithDuration:0.3 delay:2.4 options:UIViewAnimationOptionCurveLinear animations:^{
        notificationLabel.frame = CGRectMake(0, -64, 320, 64);
    } completion:nil];
}];

This isn't very elegant but it's late and this is what I could come up with :)

Upvotes: 1

Related Questions