skills.rest
DFly7
DFly7COMMUNITY
Explore all skills by this author →
GitHub

swiftui-animation

Implement and review SwiftUI animations and transitions for iOS views.

Updated Mar 31, 2026
Search Tags:#accessibility#swift#ios#animation#swiftui#transitions#matchedgeometryeffect
One-click install
npx skills add https://github.com/DFly7/iOS-FastAPI-Supabase-AI --skill swiftui-animation-dfly7
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: swiftui-animation
Source: https://github.com/DFly7/iOS-FastAPI-Supabase-AI/tree/main/.agents/skills/swiftui-animation
Command: npx skills add https://github.com/DFly7/iOS-FastAPI-Supabase-AI --skill swiftui-animation-dfly7

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Helps engineers design, implement, and review SwiftUI animations and transitions so UI motion is expressive, performant, and respectful of accessibility settings across modern iOS releases.

Core Features & Use Cases

  • Explicit and implicit animations: Guidance for withAnimation, animation(:body:), and animation(:value:) to scope motion precisely.
  • Advanced choreography: Patterns for PhaseAnimator and KeyframeAnimator for sequenced and multi-track animations.
  • Shared-element and navigation: Matched geometry and navigation zoom transitions using matchedGeometryEffect and matchedTransitionSource.
  • Spring and timing control: Choosing Spring presets (.smooth, .snappy, .bouncy), UnitCurve timing, and custom curves for intent-aligned motion.
  • Symbol and content transitions: SF Symbol effects, contentTransition for in-place updates, and symbol rendering modes.
  • Accessibility and performance: Ensure animations honor accessibilityReduceMotion and avoid heavy per-frame work; fallbacks and Core Animation bridging where needed.

Quick Start

Create a SwiftUI view animation that expands a thumbnail into a detail card using matchedGeometryEffect with a snappy spring and fall back to a simple cross-fade when accessibilityReduceMotion is enabled.

Frequently Asked Questions about swiftui-animation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a shared-element hero transition in SwiftUI using matchedGeometryEffect?▼

Create a shared-element hero transition in SwiftUI by applying matchedGeometryEffect to pair views across states, triggering the animation inside withAnimation with a Spring preset like .snappy for smooth expansion.

How does SwiftUI handle accessibilityReduceMotion for custom animations?▼

SwiftUI handles accessibilityReduceMotion by reading the environment value to detect the setting, allowing you to fall back from complex transitions to simple cross-fades and ensure motion is respectful of user preferences.

What is the difference between PhaseAnimator and KeyframeAnimator in SwiftUI?▼

PhaseAnimator sequentially cycles through discrete animation phases, while KeyframeAnimator defines multi-track keyframe choreography, allowing precise parallel control over different value animators in SwiftUI.

Does this SwiftUI animation guidance apply to iOS 16 and iOS 18 projects?▼

Yes, this SwiftUI animation guidance applies to iOS 16 through 18+ projects, covering APIs from matchedGeometryEffect to newer navigation zoom transitions using matchedTransitionSource in Swift 6.3.

When should I use SwiftUI Spring presets versus UnitCurve for timing control?▼

Use SwiftUI Spring presets like .smooth, .snappy, or .bouncy for natural object motion, and use UnitCurve for specific timing curve definitions when you need exact mathematical control over the animation's pacing.

How do I animate SF Symbol effects and in-place content transitions in SwiftUI?▼

Animate SF Symbol effects and in-place content transitions in SwiftUI by applying symbol rendering modes and using contentTransition, ensuring updates respect the accessibilityReduceMotion environment value.

Related Skills

Explore More Software Engineering Skills→
yashpalsince2004yashpalsince2004

swiftui-uikit-interop

Bridge UIKit and SwiftUI components using representable wrappers and coordinators.

Community
Advanced
princegarg001princegarg001

r3f-animation

Build and control 3D animations in React Three Fiber with useFrame and useAnimations.

Community
Advanced
Roy-wonjiRoy-wonji

swiftui-animation

Implement and review SwiftUI animations with correct API selection and Reduce Motion support.

Community
Advanced
onymchatonymchat

swiftui-animation

Design, review, and implement SwiftUI animations with modern Swift 6.3 patterns.

Official
Advanced