Анимированные подслои слоя - PullRequest
Новая
       101

Анимированные подслои слоя

1 голос
/ 03 мая 2020

У меня есть вид, что др aws 2 слоя;

  • Линия
  • Градиент

Теперь, когда я переключаю свой Путь Я хочу анимировать оба слоя одновременно. Для этого у меня сначала было 2 отдельных слоя, и я добавил анимацию к каждому из них. Это сработало, но мне не понравилось то, что я должен был написать анимацию для каждого из них.

Именно поэтому я решил создать подкласс CAShapeLayer и переместить градиент в линейный слой, чтобы с точки зрения иерархии это выглядело так:

  • Линия
    • Градиент

В коде; 

class LineLayer: CAShapeLayer {
    // Configuration
    private var configuration: ChartConfiguration!

    // Layers
    private var backgroundLayer: CAGradientLayer!

    init(configuration: ChartConfiguration) {
        super.init()
        self.configuration = configuration
        configureLayers()
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    private func configureLayers() {
        addLineLayer()
        addBackgroundLayer()
    }

    private func addLineLayer() {
        self.fillColor = UIColor.clear.cgColor
        self.strokeColor = configuration.lineColor
        self.lineWidth = configuration.lineWidth
    }

    private func addBackgroundLayer() {
        backgroundLayer = CAGradientLayer()
        backgroundLayer.anchorPoint = CGPoint(x: 0, y: 0)
        backgroundLayer.colors = [UIColor.systemGreen.withAlphaComponent(0.24).cgColor, UIColor.systemGreen.withAlphaComponent(0).cgColor]
        backgroundLayer.startPoint = CGPoint(x: 0, y: 0)
        backgroundLayer.endPoint = CGPoint(x: 0, y: 1)
        self.addSublayer(backgroundLayer)
    }

    public func updateBackgroundLayer(frame: CGRect, mask: CAShapeLayer) {
        backgroundLayer.frame = CGRect(x: 0, y: 0, width: frame.width, height: frame.height)
        backgroundLayer.mask = mask
    }
}

Затем я анимировал родителя (линию) и думал, что дети (градиент) будут двигаться дальше. К сожалению, этого не происходит. Мой код анимации выглядит следующим образом: 

    lineLayer = LineLayer(configuration: configuration)
    lineLayer.path = linePath
    self.layer.addSublayer(lineLayer)

    private func addPathAnimation() {
        let animation = CABasicAnimation(keyPath: "path")
        animation.duration = configuration.animationDuration
        animation.fromValue = layer.path != nil ? layer.path : linePath
        animation.toValue = path
        animation.timingFunction = configuration.animationCurve
        layer.add(animation, forKey: nil)
        layer.path = path
    }

Можно ли анимировать детей, только когда они анимируют родителя? Или мне просто нужно придерживаться отдельных слоев, добавленных в представление, и анимировать каждый из них?

...