Question

我正在尝试创建一个动画，当用户按下按钮时，方形按钮变成一个圆圈。我尝试使用UIView.animateWithDuration但是如果与使用关键帧动画具有相同的效果 - ＆gt;用户点击按钮，它变成一个带边框的圆圈......没有“变形”成圆圈

let animate = UIButton()

override func viewDidLoad() {
    super.viewDidLoad()


    animate.frame = CGRectMake(0, 0, 200, 200)
    animate.layer.borderWidth = 0
    animate.layer.cornerRadius = 0
    animate.center.x = view.frame.size.width / 2.0
    animate.center.y = view.frame.size.width / 2.0
    animate.backgroundColor = UIColor(red: 59.0/255.0, green: 89.0/255.0, blue: 152.0/255.0, alpha: 1.0)

    animate.addTarget(self, action: Selector("didPushButton"), forControlEvents: UIControlEvents.TouchUpInside)

    view.addSubview(animate)

}


func didPushButton() {

    UIView.animateKeyframesWithDuration(5.0, delay: 0, options: nil, animations: {

        UIView.addKeyframeWithRelativeStartTime(0, relativeDuration: 1/5, animations: {
            self.animate.layer.cornerRadius = 20
            self.animate.layer.borderWidth = 2
        })

        UIView.addKeyframeWithRelativeStartTime(1, relativeDuration: 1/5, animations: {
            self.animate.layer.cornerRadius = 40
            self.animate.layer.borderWidth = 4
        })

        UIView.addKeyframeWithRelativeStartTime(2, relativeDuration: 1/5, animations: {
            self.animate.layer.cornerRadius = 60
            self.animate.layer.borderWidth = 6
        })

        UIView.addKeyframeWithRelativeStartTime(3, relativeDuration: 1/5, animations: {
            self.animate.layer.cornerRadius = 80
            self.animate.layer.borderWidth = 8
        })

        UIView.addKeyframeWithRelativeStartTime(4, relativeDuration: 1/5, animations: {
            self.animate.layer.cornerRadius = 100
            self.animate.layer.borderWidth = 10
        })


    }, completion: nil)

}

Answer 1

这个CABasicAnimation会变形角半径，所以把一个正方形变成一个圆圈，但它不是我见过的最好看的动画，

- (IBAction)animateShape:(UIButton *)sender {
    CGFloat width = sender.frame.size.width;
    CABasicAnimation *morph = [CABasicAnimation animationWithKeyPath:@"cornerRadius"];
    morph.fromValue = @0;
    morph.toValue = @(width/2);
    morph.duration = 0.5;
    [self.button.layer addAnimation:morph forKey:@"morph"];
    sender.layer.cornerRadius = width/2;
}

我不知道是否有办法让这更顺畅。

试图制作正方形UIButton＆＃34;变形＆＃34;使用animateKeyframesWithDuration进入一个圆圈

1 个答案: