Как мне повторить анимацию несколько раз одновременно с точки зрения производительности? - PullRequest
Новая
       105

Как мне повторить анимацию несколько раз одновременно с точки зрения производительности?

0 голосов
/ 06 октября 2019

Я стремлюсь, чтобы все эти волны анимировались одинаково, из соображений производительности. Это поможет, уменьшив стоимость расчета траекторий волн и уменьшив количество отрисовок.

У меня есть сцена в настройке SpriteKit, например:

Scene→ Здесь есть ссылка на анимационную версию здесь .

Сцена в основном состоит из 2 вещей:

  • Камни (светло-темно-серые шестиугольники)
  • Волны (есть 2 на камень - более светлый и темно-синий оживляющий путь)

Волны создаются так: 

// Wave outline shape node
shapeNode               = SKShapeNode(path: self.oldPath)
shapeNode.strokeColor   = wave.color
shapeNode.lineWidth     = 5
shapeNode.zPosition     = waveIndex == 0 ? Layer.farWave : Layer.nearWave
shapeNode.lineJoin      = .round
shapeNode.position      = stoneCell.node.position.offset(by: stoneCell.offsetVector)
view.scene?.addChild(shapeNode)

// Layer which creates the animation
shapeLayer = CAShapeLayer()
shapeLayer.isHidden = true
view.layer.addSublayer(shapeLayer)

animate()

Иanimate() функция: 

/// Animates the wave's path. This method calls itself forever.
private func animate() {
    let newPath = WavePath(wave: wave, direction: currentDirection).createPath()

    let anim = CABasicAnimation(keyPath: "path")
    anim.duration   = 2  // Duration of the wave movements in a direction (in or out)
    anim.fromValue  = oldPath
    anim.toValue    = newPath
    anim.timingFunction = CAMediaTimingFunction(name: .easeInEaseOut)

    shapeLayer.path = newPath
    shapeLayer.add(anim, forKey: nil)

    shapeNode.run(SKAction.customAction(withDuration: anim.duration, actionBlock: { (node, timeDuration) in
        (node as? SKShapeNode)?.path = self.shapeLayer.presentation()?.path
    }), completion: {
        self.oldPath = newPath
        self.currentDirection.toggle()
        self.animate()
    })
}

Проблемы возникают из-за того, что на сцене есть 10 камней, что увеличивает стоимость исполнения. Есть ли способ сделать эту волновую анимацию дублированной под всеми этими камнями?

Возможные варианты, которые я могу придумать:

  • Преобразовать пути в текстуру, которая может бытьделится между несколькими камнями? Однако я думаю, что будет медленно преобразовывать текстуру дважды (для каждой волны) за кадр, а затем копировать ее поверх ...

  • Рендеринг полной анимации прохода волнывход и выход, а затем помещая это в цикл для каждого узла. Но как?

Какие еще решения могут быть лучше?

Я не хочу создать атлас и анимировать его. Я не могу этого сделать, потому что эти камни и волны меняются по размеру, в зависимости от размера и уровня экрана, и я хочу, чтобы они были идеальными по пикселям. Однако я не против (как уже упоминалось в пуле два) сохранять текстуры цикла анимации, а затем повторять это.

...