AIKraft/AI/Войти
AIKraft/Skills/SwiftUI-анимация

SwiftUI-анимация

This skill provides comprehensive guidance for implementing advanced SwiftUI animations, transitions, matched geometry effects, and Metal shader integration. Use when building animations, view transitions, hero animations, or GPU-accelerated effects in SwiftUI apps for iOS and macOS.

jamesrochabrun official Дизайн

Что делает навык

Навык предоставляет экспертное руководство по реализации продвинутых анимаций, переходов, matched geometry effects и интеграции Metal-шейдеров в SwiftUI. Он помогает создавать GPU-ускоренные эффекты, hero-анимации и оптимизировать производительность анимаций для iOS и macOS.

Когда применять

  • Создание плавных переходов между экранами с использованием matchedGeometryEffect для hero-анимаций.
  • Разработка сложных многофазных анимаций с помощью PhaseAnimator и KeyframeAnimator.
  • Добавление GPU-ускоренных визуальных эффектов (искажение, размытие, инверсия цвета) через Metal-шейдеры.
  • Настройка доступных и нативных анимаций с использованием пресетов iOS 17+ (snappy, smooth, bouncy).

Как работает

  1. Определить цель анимации и выбрать подходящий тип: явные анимации (withAnimation), пресеты iOS 17+ или кастомные пружинные параметры.
  2. Реализовать переходы или эффекты: использовать .transition() для базовых эффектов, .matchedGeometryEffect() для связывания состояний между представлениями или шейдерные модификаторы (.colorEffect, .distortionEffect, .layerEffect) для GPU-эффектов.
  3. Настроить параметры производительности и доступности: убедиться, что анимации кратковременны (до 400 мс), позволяют пользователю прервать процесс и корректно обрабатывают изменения состояния.
  4. Проверить интеграцию Metal-шейдеров: убедиться, что .metal файлы добавлены в цель, сигнатуры функций соответствуют требованиям, а maxSampleOffset задан корректно.

Примеры запросов агенту

Как реализовать hero-анимацию при переходе от карточки товара к детальному просмотру с помощью matchedGeometryEffect?
Пример кода для создания пульсирующего индикатора загрузки с использованием repeatForever и easeInOut.
Как применить шейдер для инверсии цветов или волнового искажения изображения в SwiftUI на iOS 17+?

Что понадобится

  • Среда разработки SwiftUI для iOS/macOS
  • Файлы шейдеров (.metal)
  • iOS 17+ (для использования пресетов анимаций и некоторых шейдерных эффектов)

Описание составлено по SKILL.md навыка, сверено 05.10.2026.

Как подключить

1Скачать навык
# возьмите папку навыка «swiftui-animation» из репозитория: # https://github.com/jamesrochabrun/skills
2Положить папку с SKILL.md к навыкам ассистента
# положите папку навыка туда, где ассистент ищет skills: cp -r swiftui-animation/ ~/.claude/skills/swiftui-animation/

Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.