如何实现自定义Uibutton中的动画

Question

preamble (在代码之后为实际问题进行页面下页(：

我有一个自定义UIButton类，其中我用这种行为替换了普通的UIButton isHighlighted动画行为：

当用户的手指实际上在按钮上(即突出显示按钮(时，按钮周围会出现一个触及的轮廓(方形边框(。当他们不再触摸按钮时，轮廓消失了。

另外，我用以下方式替换了普通的isSelected行为(背景蓝色(：

绘制了与isHighlighted一起使用的轮廓，除了它稍厚，并且总是在isSelected = true时长，并且当isSelected = false时不存在。

这是有效的，这就是我这样做的方式：

import UIKit
class CustomButton: UIButton {
    // BUTTON TYPES:
    // Gorsh, enums sure would be swell here. :T
    // 1 : plus
    // 2 : minus
    // 3 : etc etc....
    @IBInspectable
    var thisButtonsType: Int = 1 { didSet { setNeedsDisplay() } }
    @IBInspectable
    var fillColor: UIColor = .black { didSet { setNeedsDisplay() } }
    @IBInspectable
    var strokeColor: UIColor = .black { didSet { setNeedsDisplay() } }
    override var isHighlighted: Bool {
        didSet {
            setNeedsDisplay()
        }
    }
    override func draw(_ rect: CGRect) {
        let unitOfMeasure = bounds.width / 5
        // draw outline in case we are selected / highlighted
        if (isSelected || isHighlighted) {
            let tempPath = BezierPathFactory.outline(totalWidth: bounds.width)
            if (isSelected) {tempPath.lineWidth = 4.0}
            strokeColor.setStroke()
            tempPath.stroke()
        }
        // initialize path object
        var path = UIBezierPath()
        // get the path corresponding to our button type
        switch thisButtonsType {
        case 1:
            path = BezierPathFactory.plus(gridSpacing: unitOfMeasure)
        case 2:
            path = BezierPathFactory.minus(gridSpacing: unitOfMeasure)
        default: print("hewo!")
        }
        fillColor.setFill()
        path.fill()

    }
}

再次有效，但是...

我真正想要的是，如果触摸结束后，那个标明的边界大纲将逐渐消失。

注意：如果您想知道为什么我会这样做...我计划实现许多不同的按钮类型...所有这些都带有不同的图标"打印"它们...但是我希望它们全部遵循这些基本行为。其中只有几个是被选中的"切换"按钮，因此可以使用亮点淡出。

我已经知道如何制作动画...但是这只是在尝试在这种情况下考虑如何做到这一点。

我希望我能获得UIBUTTON源代码。

有没有一种方法可以将淡出动画相对简单地添加到我的上述代码而不完全改变设计模式的情况下？我是否必须开始使用其他核心图形的其他功能？

谢谢！

Answer 1

您可以执行以下操作：

1. 创建一个UIButton的子类，该子类添加并管理CAShapeLayer类的子层以概述按钮。
2. 将轮廓绘制到形状层中。
3. 确保将图层与视图进行调整：视图的覆盖layoutSubviews，以便更新图层的框架并更新轮廓的路径。
4. 您应该观察或覆盖UIControl(UIButton的祖先(的state属性，以便注意状态更改。
5. 使用属性动画(CABasicAnimation(，以使形状层的不透明度褪色。