如何为UIButton iOS创建脉动动画?

时间:2015-04-01 07:31:26

标签: ios objective-c animation uibutton

我试图为UIButton创建一个脉动动画 到目前为止,这些是我的代码,但仍然无法完成此链接中显示的确切动画

CSS pulsating button

我的代码

 UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    button.backgroundColor = [UIColor lightGrayColor];
    [button setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
       [button addTarget:self
               action:@selector(method)
     forControlEvents:UIControlEventTouchUpInside];
    [button setTitle:@"Show View" forState:UIControlStateNormal];
    button.frame = CGRectMake(80.0, 210.0, 160.0, 160.0);
    CABasicAnimation *pulseAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
    pulseAnimation.duration = .5;
    pulseAnimation.toValue = [NSNumber numberWithFloat:1.1];
    pulseAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    pulseAnimation.autoreverses = YES;
    pulseAnimation.repeatCount = FLT_MAX;
    [button.layer addAnimation:pulseAnimation forKey:nil];
    button.layer.cornerRadius=button.frame.size.width / 2;
    ;
    button.layer.masksToBounds = YES;

    [self.view addSubview:button];

2 个答案:

答案 0 :(得分:7)

试试这个。

UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
button.frame = CGRectMake(0, 0, 100, 100);
button.center = self.view.center;
[button setTitle:@"Button" forState:UIControlStateNormal];

UIView *c = [[UIView alloc] initWithFrame:button.bounds];
c.backgroundColor = [UIColor blueColor];
c.layer.cornerRadius = 50;
[button addSubview:c];
[button sendSubviewToBack:c];

UIView *f = [[UIView alloc] initWithFrame:button.bounds];
f.backgroundColor = [[UIColor blueColor] colorWithAlphaComponent:0.3];
f.layer.cornerRadius = 50;
[button addSubview:f];
[button sendSubviewToBack:f];

CABasicAnimation *pulseAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
pulseAnimation.duration = .5;
pulseAnimation.toValue = [NSNumber numberWithFloat:1.1];
pulseAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
pulseAnimation.autoreverses = YES;
pulseAnimation.repeatCount = MAXFLOAT;
[c.layer addAnimation:pulseAnimation forKey:@"a"];
[button.titleLabel.layer addAnimation:pulseAnimation forKey:@"a"];

CABasicAnimation *fade = [CABasicAnimation animationWithKeyPath:@"opacity"];
fade.toValue = @0;
CABasicAnimation *pulse = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
pulse.toValue = @2;
CAAnimationGroup *group = [CAAnimationGroup animation];
group.animations = @[fade,pulse];
group.duration = 1.0;
group.repeatCount = MAXFLOAT;
[f.layer addAnimation:group forKey:@"g"];

[self.view addSubview:button];

答案 1 :(得分:1)

一个好的控制,可以根据要求调整。 https://github.com/zackhsuan/ZKPulseView