rounak / TwitterBirdAnimation

Replicating Twitter's bird animation that appears when app starts up
476 stars 55 forks source link

Objective C implementation #7

Open trdavidson opened 9 years ago

trdavidson commented 9 years ago

Great blogpost! I tried translating it into objective C, but seem to run into some issues:

in AppDidLaunch UIImageView *imageView = [[UIImageView alloc] initWithFrame:[UIScreen mainScreen].bounds]; imageView.image = [UIImage imageNamed:@"Default.png"]; [self.window addSubview:imageView]; [self.window bringSubviewToFront:imageView];

self.mask = [CALayer layer];
self.mask.contents = (__bridge id)([UIImage imageNamed:@"venue_pin_newblue"].CGImage);
self.mask.bounds = CGRectMake(0, 0, 100, 100);
self.mask.anchorPoint = CGPointMake(0.5, 0.5);
self.mask.position = CGPointMake(imageView.frame.size.width/2, imageView.frame.size.height/2);
self.imageView.layer.mask = _mask;
self.imageView = imageView;

[self animateMaks];

-(void) animateMask { NSLog(@"start animation"); CAKeyframeAnimation *keyFrameAnimation = [CAKeyframeAnimation animationWithKeyPath:@"bounds"]; keyFrameAnimation.delegate = self; keyFrameAnimation.duration = 1; keyFrameAnimation.beginTime = CACurrentMediaTime() + 1; //add delay of 1 second

NSValue *initialBounds = [NSValue valueWithCGRect:_mask.bounds];
NSValue *secondBounds = [NSValue valueWithCGRect:CGRectMake(0, 0, 90, 90)];
NSValue *finalBounds = [NSValue valueWithCGRect:CGRectMake(0, 0, 1500, 1500)];
NSArray *valuesArray = @[initialBounds, secondBounds, finalBounds];
keyFrameAnimation.values = valuesArray;

CAMediaTimingFunction *t1 = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
CAMediaTimingFunction *t2 = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
NSArray *timingFunctions = @[t1, t2];
keyFrameAnimation.timingFunctions = timingFunctions;

NSArray *keyTimes = @[@0, @0.3, @1];
keyFrameAnimation.keyTimes = keyTimes;

[self.mask addAnimation:keyFrameAnimation forKey:@"bounds"];

}

any suggestions of what might be causing the problem? Thanks!

andr3a88 commented 9 years ago

This works for me.

StartAnimation called on viewDidLoad

- (void)startAnimation
{
    self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
    self.window.hidden = NO;

    self.imageView = [[UIImageView alloc] initWithFrame:[UIScreen mainScreen].bounds];
    self.imageView.contentMode = UIViewContentModeScaleAspectFill;
    self.imageView.image = [self captureView:self.view]; //Or your image
    self.imageView.backgroundColor = [UIColor clearColor];
    [self.window addSubview:self.imageView];
    [self.window bringSubviewToFront:self.imageView];
    self.mask = [CALayer layer];
    self.mask.contents = CFBridgingRelease(([UIImage imageNamed:@"logo_twiiter_literal"].CGImage));
    self.mask.bounds = CGRectMake(0, 0, 250, 100);
    self.mask.anchorPoint = CGPointMake(0.5, 0.5);
    self.mask.position = CGPointMake(self.imageView.frame.size.width/2, self.imageView.frame.size.height/2);
    self.imageView.layer.mask = self.mask;

    [self animateMask];

    self.window.backgroundColor = [UIColor blueColor];
    [self.window makeKeyAndVisible];
    [[UIApplication sharedApplication] setStatusBarHidden:YES];
}

Animation Mask

- (void)animateMask
{
    NSLog(@"start animation");
    CAKeyframeAnimation *keyFrameAnimation = [CAKeyframeAnimation animationWithKeyPath:@"bounds"];
    keyFrameAnimation.delegate = self;
    keyFrameAnimation.duration = 1;
    keyFrameAnimation.beginTime = CACurrentMediaTime() + 0.5; //add delay of 1 second

    NSValue *initialBounds = [NSValue valueWithCGRect:self.imageView.layer.mask.bounds];
    NSValue *secondBounds = [NSValue valueWithCGRect:CGRectMake(0, 0, 230, 80)];
    NSValue *finalBounds = [NSValue valueWithCGRect:CGRectMake(0, 0, 1500, 1500)];
    NSArray *valuesArray = @[initialBounds, secondBounds, finalBounds];
    keyFrameAnimation.values = valuesArray;

    CAMediaTimingFunction *t1 = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    CAMediaTimingFunction *t2 = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    NSArray *timingFunctions = @[t1, t2];
    keyFrameAnimation.timingFunctions = timingFunctions;

    NSArray *keyTimes = @[@0, @0.3, @1];
    keyFrameAnimation.keyTimes = keyTimes;

    [self.imageView.layer.mask addAnimation:keyFrameAnimation forKey:@"bounds"];
}

AnimationDidStop

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{
    if(flag)
    {
        self.imageView.layer.mask = nil;
        self.window.hidden = YES;
        [[UIApplication sharedApplication] setStatusBarHidden:NO];
    }
}