Это восьмая Лекция курса Stanford CS193p, весна 2021 года. Лекция 8 полностью посвящена демонстрации различных возможностей анимации в SwiftUI:

• matchedGeometryEffect, который действует при сдаче карт
• переворот карты, который осуществляется нашим специальным Animatable модификатором Cardify
•  анимация нашей геометрической фигуры Shape в виде “пирога” Pie
• неявная анимация, которая крутит эмодзи при совпадении карт
• перетасовка карт и выбор карты представляют явную анимацию
• запуск анимации при появлении (.onAppear) некоторых вещей
• как задерживать анимацию карт при их сдаче
• как диагностировать проблемы, когда у нас не происходит анимация, которую мы ожидаем при появлении на экране и уходе с экрана View, которое является частью условного предложения if-else

На прошлой Лекции 7 были продемонстрированы только неявные анимации.  

Но гораздо чаще для создания анимаций используется явная анимация. И чтобы показать это, профессор добавляет в игру Memorize возможность тасовки (Shuffle) карт.

Мы видим, что неявная анимация (вращение эмодзи) и  явная анимация (тасовка карт) действуют независимо друг от друга.

Еще одним примером использования явной анимации является выбор карты.

Также как и тасовка карт, выбор карты является «Намерением» пользователя, которое реализуется Intent функциями, а вызовы Intent функций из-за реактивной природы нашего UI практически всегда  “оборачиваются” withAnimation и превращаются в явную анимацию.

Однако реализовать нужный нам физический переворот карты в 3D пространстве при её выборе не удается организовать обычным модификатором rotation3DEffect и стандартными переходами .transition. Нам пришлось изобретать свою собственную анимацию для нашего модификатора Cardify, заставив его реализовать протокол Animatable. 

Надо отметить, что по ходу изучения анимации мы узнали о множестве геометрических эффектов GeometryEffect, таких как .rotationEffect, .scaleEffect, .rotation3DEffect. Мы узнали, что некоторые GeometryEffects происходят “за кулисами”, как в случае с “сеткой” LazyVGrid, которая, очевидно, позиционирует карты, и поэтому, когда мы перемешиваем карты (Shuffle), мы получаем очень красивую анимацию.

Ещё один геометрический эффект — matchedGeometryEffect — и возможность задержки анимаций позволили обеспечить вполне реальную картину сдачу карт. Этот же геометрический эффект matchedGeometryEffect используется для перезапуска игры Memorize,  когда карты с игрового поля «летят» обратно в колоду карт, но уже без задержки :

С помощью анимации такой геометрической фигуры Shape,  как “пирога” Pie, расположенного на карте позади эмодзи,  организуется  обратный отсчет времени нахождения карты в положении “лицом” вверх, что стимулирует игра к быстрому поиску совпадающих карт.

Но это не обычная анимация изменений, которые уже произошли, а в некотором роде анимация в будущее. Нам потребовалось хитроумное использование .onAppear для запуска этой анимацию при появлении на экране  “пирога” Pie. По сути, это ручная реализация появившегося в iOS 15 TimelineView.

Код демонстрационного примера для Лекции 8 находится на Github для iOS 14 в папке Memorize L8.

Русскоязычный неавторизованный конспект Лекции 8, иллюстрированный, хронометрированный и представленный в виде PDF-файла, который можно скачать и использовать offline, а также в формате Google Doc доступны на платной основе.