Я стремлюсь, чтобы все эти волны анимировались одинаково, из соображений производительности. Это поможет, уменьшив стоимость расчета траекторий волн и уменьшив количество отрисовок.
У меня есть сцена в настройке SpriteKit, например:
→ Здесь есть ссылка на анимационную версию здесь .
Сцена в основном состоит из 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 камней, что увеличивает стоимость исполнения. Есть ли способ сделать эту волновую анимацию дублированной под всеми этими камнями?
Возможные варианты, которые я могу придумать:
Преобразовать пути в текстуру, которая может бытьделится между несколькими камнями? Однако я думаю, что будет медленно преобразовывать текстуру дважды (для каждой волны) за кадр, а затем копировать ее поверх ...
Рендеринг полной анимации прохода волнывход и выход, а затем помещая это в цикл для каждого узла. Но как?
Какие еще решения могут быть лучше?
Я не хочу создать атлас и анимировать его. Я не могу этого сделать, потому что эти камни и волны меняются по размеру, в зависимости от размера и уровня экрана, и я хочу, чтобы они были идеальными по пикселям. Однако я не против (как уже упоминалось в пуле два) сохранять текстуры цикла анимации, а затем повторять это.