Мощная анимация у вас под рукой
На самом деле я программировал десятилетиями — и могу честно сказать, что сегодня мне это нравится больше, чем когда-либо. Мне нравится программировать с помощью SwiftUI, в частности, потому что это весело — потому что вы можете прототипировать что-то всего за несколько часов, если не меньше.
Присоединяйтесь ко мне в этой статье, чтобы повеселиться со SwiftUI, создать… подходящий для этого года (Рождество 2021) эффект частиц, используя только мощный движок анимации в SwiftUI.
Я думаю, что ключевыми ингредиентами здесь являются режимы наложения цветов и анимация, и в прошлом месяце я написал статью о последнем — вы читали все о здесь.
Бриф
Короче говоря, я хочу создать взрыв, эффект частиц, но я не хочу использовать SpriteKit. Я хочу использовать SwiftUI. Цель создания этого —
Теперь, на что вы смотрите — ну, это частица, которая выглядит вот так — около 256 из них, если быть более точным, загружены друг на друга в ZStack, используя смешение цветов в экранном режиме. Цвет значка красный, но он становится белым, когда накладывается сам на себя. Различные оттенки белого смешиваются по-разному, поскольку положение, непрозрачность, масштаб и поворот изменяются в течение анимации, которая длится всего 4 секунды.
Я скачал его с noun project, отличного сайта для получения черно-белых иконок. Основной управляющий код выглядит так.
У меня есть структура, в которой я сохранил все значения для этой анимации, положение, непрозрачность, угол, масштаб и поворот. Для каждой частицы, которую я создаю, я подставляю значение для всех этих. Начальное значение и конечное значение.
Затем я запускаю второе представление, которое создает 256 частиц, а SwiftUI затем анимирует все свойства, которые я только что упомянул, всего за 4 секунды. Он оживляет их и перемещает каждую частицу по углу внутри круга, используя базовую математику с SIN и COS.
Конечным результатом взрыва, который вы видите здесь, является загрузка всего проекта по ссылке на битбакет, которую я даю здесь, и экспериментирование с ним. Вы сможете создавать всевозможные эффекты с помощью этого кода, просто изменяя различные параметры — параметры Range будут иметь наибольшее значение — например, измените AngleRange на 150, и вы получите половину взрыва. Добавьте этот код, чтобы перетасовать различные цвета на вашей частице, чтобы получить немного другой эффект. Попробуйте найти новую форму.
let colors = [Color.red, .blue, .purple, .green, .orange, .yellow, .indigo, .pink] property.color = colors.shuffled().first!
Вы должны иметь возможность создавать любые эффекты, которые вы можете получить с помощью SpriteKit, с небольшой настройкой здесь и там. Вот еще один пример:
var startPosition: CGPoint = CGPoint(x: Double.random(in: 0...UIScreen.screenWidth), y: Double.random(in: 0...UIScreen.screenHeight))
Форма позади этого выглядит так —
Все это подводит меня к концу этого короткого отрывка — получайте удовольствие, как и я.
