Zur Nutzungsanleitung springen
Animation Patternsvon rshankras

Animation Patterns Skill.

Wählen und prüfen Sie SwiftUI-Animations-APIs für native Oberflächen.

  • SwiftUI
  • Apple-Plattformen
Quellenprüfung · animation-patternsSKILL.md
Aufgabe Wählen und prüfen Sie SwiftUI-Animations-APIs für native Oberflächen. Ergebnis Ein SwiftUI-Animationsmuster passend zur tatsächlichen Zustandsänderung. Bevor Sie beginnen Er bietet keinen Workflow für CSS, Browser oder Video-Rendering.
Redaktionelle Zusammenfassung · Quelle geprüft 2026-11-02 · kein generiertes Beispiel

01 Funktionen

SwiftUI-Animations-APIs für native Oberflächen auswählen und prüfen

Prüfen Sie SwiftUI-Federanimationen, Phasen- und Keyframe-Animatoren, Navigationsübergänge und das Verhalten bei reduzierter Bewegung anhand des SDK Ihres Projekts.

Quellenbasierter WorkflowKein Ausführungs-Benchmark

Die Arbeitsweise

animation-patterns ist eine SwiftUI-Referenz zur Auswahl und Prüfung von Animations-APIs. Sie ordnet Zustandsänderungen, aufeinanderfolgende Phasen, Eigenschafts-Keyframes, das Einfügen von Views und Navigationsübergänge unterschiedlichen Umsetzungsmustern zu. Außerdem behandelt sie SF Symbol-Effekte und geometriegesteuerte visuelle Darstellungen.

Die Quelle konzentriert sich auf Fehler bei der API-Verwendung, die eine Umsetzung scheitern lassen können: das Mischen von Federparametern verschiedener API-Generationen, den falschen Geltungsbereich eines Übergangs oder die Verwechslung gemeinsam genutzter Geometrie mit einem Navigationszoom. Die Plattformverfügbarkeit und die Mindestversion des Projekts bleiben Teil der Entscheidung – ebenso wie das Verhalten bei reduzierter Bewegung und möglichst geringer Rechenaufwand pro Frame.

Erwartete Ergebnisse

  • Ein SwiftUI-Animationsmuster passend zur tatsächlichen Zustandsänderung.
  • Eine gezielte Prüfung der korrekten API-Verwendung mit Hinweisen zur Korrektur.
  • Prüfungen für Barrierefreiheit, Mindestversion und Leistung pro Frame.
Beispiel-Briefing ansehen

Vom Briefing zur Prüfung

  1. 01
    Die Animation einordnen

    Unterscheiden Sie vor der API-Auswahl zwischen einer Zustandsinterpolation, einer Phasenfolge, einer Zeitleiste mit mehreren Eigenschaften, dem Einfügen oder Entfernen einer View und einem Navigationsübergang.

  2. 02
    API-Generation und Geltungsbereich prüfen

    Stimmen Sie Parameternamen und Closures auf das installierte SDK und die Mindestversion ab. Prüfen Sie, ob die animierte View tatsächlich an der vorgesehenen Zustandsänderung beteiligt ist.

  3. 03
    Interaktion und Rechenaufwand prüfen

    Prüfen Sie Unterbrechungen, reduzierte Bewegung, das Verhalten beim Abschluss und aufwendige Arbeit in Closures, die pro Frame ausgeführt werden. Testen Sie die tatsächliche Oberfläche in ihrer Zielumgebung.

02 Einsatzbereiche

Wann der Skill sinnvoll ist

Er bietet keinen Workflow für CSS, Browser oder Video-Rendering.

Gut geeignet

  • SwiftUI-Animationscode schlägt fehl oder verhält sich unerwartetDie Quelle ist nach häufigen API-Fehlern und einem aufgabenbasierten Entscheidungsbaum aufgebaut.
  • Ein nativer Übergang braucht den richtigen GeltungsbereichSie unterscheidet zwischen lokaler View-Geometrie und durch Navigation ausgelösten Übergängen.

Zu prüfende Grenzen

  • Anleitung für native Apple-OberflächenEr bietet keinen Workflow für CSS, Browser oder Video-Rendering.
  • Verfügbarkeit muss bestätigt werdenDie Tabelle der Originalquelle ist eine Momentaufnahme. Für die Umsetzung sind die aktuellen SDK-Deklarationen und die Mindestversion des Projekts maßgeblich.

Diese Eingaben mitbringen

  • SwiftUI-CodeStellen Sie die betroffene View, die Zustandsvariablen und die Animationsmodifikatoren bereit.
  • PlattformvorgabenNennen Sie die Mindestversion sowie die installierte SDK- oder Xcode-Version.
  • Gewünschtes VerhaltenBeschreiben Sie den Auslöser, den Bewegungsverlauf, den Endzustand und das erwartete Verhalten bei reduzierter Bewegung.

03 Wichtige Entscheidungen

Wichtige Entscheidungen

  1. Die richtige API auswählen

    Der Entscheidungsbaum trennt Animationsaufgaben, die auf den ersten Blick ähnlich wirken.

  2. Weniger Fehler bei Signaturen

    Federkonfigurationen verschiedener API-Familien und die Signaturen von Animator-Closures werden ausdrücklich behandelt.

  3. Geringer Aufwand pro Frame

    Die Prüfung weist auf Arbeit hin, die nicht wiederholt in Rendering-Closures ausgeführt werden sollte.

04 Beispielbriefing

Mit einem gezielten Briefing beginnen

Das folgende Beispiel-Briefing wurde nicht getestet. Prüfen Sie die Einrichtung des Skills, bevor Sie es verwenden.

Quelle und Einrichtung prüfen

Stellen Sie die betroffene View, die Zustandsvariablen und die Animationsmodifikatoren bereit.

Upstream-Quelldatei
https://github.com/rshankras/claude-code-apple-skills/blob/9ffb83138209057875698dd11c1720c657c47a92/skills/design/animation-patterns/SKILL.md

Der folgende Verweis öffnet die Originalanleitung. Prüfen Sie vor der Verwendung die Einrichtungshinweise im Repository; der Verweis ist kein Installationsbefehl.

Mit einem Ergebnis beginnen

Passen Sie Umfang, Quellmaterial und Rahmenbedingungen in diesem Briefing an, bevor Sie den Skill ausführen.

Beispiel-Briefing
Nutze animation-patterns, um den SwiftUI-Code meiner ausklappbaren Übersichtskarte und ihrer Navigation zu einer Detailansicht zu prüfen. Prüfe die Mindestversion des Projekts, bevor du APIs auswählst. Trenne das lokale Ausklappen der Karte vom Navigationsübergang und bestätige, dass die Federparameter zu einer einzigen unterstützten API-Generation gehören. Behalte das bestehende Zustandsmodell bei. Ergänze eine Alternative für reduzierte Bewegung, bei der das Ergebnis verständlich bleibt, und identifiziere Formatierungs- oder Speicherallokationsarbeit in Closures, die pro Frame ausgeführt werden. Liefere gezielte Korrekturen und erkläre, wie sich wiederholtes Auslösen, der Abschluss und die Rückkehr von der Detailansicht zur Liste testen lassen.

Das Ergebnis prüfen

Prüfen Sie die tatsächliche Ausgabe anhand dieser beobachtbaren Kriterien.

  • Prüfen Sie API-Signaturen anhand des SDK und der Mindestversion des Projekts.
  • Testen Sie das zustandsabhängige Einfügen von Views, den Geltungsbereich der Navigation und wiederholtes Auslösen.
  • Prüfen Sie reduzierte Bewegung und vermeiden Sie aufwendige Arbeit in Closures, die pro Frame ausgeführt werden.

OpenDesign bietet einen lokalen Design-Arbeitsbereich für Coding-Agenten. Dieser Eintrag bedeutet nicht, dass der Skill mitgeliefert wird oder dass seine externen Tools, Zugangsdaten und Software-Abhängigkeiten enthalten sind.

05 Quelle und Lizenz

Quelle und Lizenz

Diese Seite beschreibt die unten verlinkte, festgelegte Quellrevision. Verhalten und Anforderungen im Upstream können sich ändern.

Quellinhaber
rshankras
Skill-Datei
SKILL.md
Lizenz
MIT
Geprüfter Stand
2026-11-02 · 9ffb83138209
Redaktionelle Quellenzusammenfassung
Wählen und prüfen Sie SwiftUI-Animations-APIs für native Oberflächen.

Originalzusammenfassung von OpenDesign auf Grundlage der verlinkten Quelle. Repository-Sterne sind ein datiertes Popularitätssignal, keine Skill-Nutzung und keine Qualitätsbewertung.

06 Fragen vor dem Start

Fragen vor dem Start

Ist ein lokaler Geometrieübergang dasselbe wie ein Navigationszoom?

Die Quelle behandelt sie als getrennte Aufgaben mit unterschiedlichen APIs und Geltungsbereichen. Wählen Sie danach, ob der Übergang innerhalb einer View oder im Rahmen der Navigation stattfindet.

Können Federparameternamen gemischt werden?

Die Quelle hebt hervor, dass ältere und neuere Familien von Federkonfigurationen unterschiedliche Parameterkombinationen verwenden. Verwenden Sie durchgehend eine unterstützte Signatur.

Setzt der Skill Webanimationen um?

Nein. Sein Umfang beschränkt sich auf SwiftUI und verwandte native Apple-Animationsmuster, einschließlich Versions- und Barrierefreiheitsprüfungen für diese Umgebung.

OpenDesign

Briefing und Designarbeit an einem Ort.

Halten Sie Briefing, Quellmaterial und Designarbeit in einem lokalen Arbeitsbereich zusammen. Prüfen Sie die Einrichtung des Skills, bevor Sie ihn in Ihren Workflow aufnehmen.

Upstream-Quelldatei
https://github.com/rshankras/claude-code-apple-skills/blob/9ffb83138209057875698dd11c1720c657c47a92/skills/design/animation-patterns/SKILL.md