Fähigkeiten Apple HIG: Layout and Navigation Components
📦

Apple HIG: Layout and Navigation Components

Sicher

Entwickeln Sie adaptive Apple-App-Layouts mit HIG-Navigationsmustern

Die Entwicklung von Apps für mehrere Apple-Plattformen erfordert das Verständnis komplexer Navigationsmuster und Layout-Anpassungen. Dieser Skill bietet offizielle Apple Human Interface Guidelines für Sidebars, Split Views, Tab-Leisten und mehr, um sicherzustellen, dass Ihre App die Plattformkonventionen einhält.

Unterstützt: Claude Codex Code(CC)
📊 70 Angemessen
1

Die Skill-ZIP herunterladen

2

In Claude hochladen

Gehe zu Einstellungen → Fähigkeiten → Skills → Skill hochladen

3

Einschalten und loslegen

Teste es

Verwendung von "Apple HIG: Layout and Navigation Components". Ich erstelle einen Dokumenten-Editor mit einem Inspektor-Panel. Sollte ich eine Sidebar oder ein Panel verwenden?

Erwartetes Ergebnis:

Für einen Dokumenten-Editor mit einem Inspektor verwenden Sie ein Panel (keine Sidebar) auf macOS. Sidebars sind für die primäre Navigation zwischen Bereichen gedacht, während Panels für sekundäre Steuerelemente und Eigenschaften gedacht sind, die den Hauptinhalt ergänzen. Auf iPad zeigen Sie den Inspektor als Popover oder Sheet an. Referenz: panels.md für Inspektor-Muster, sidebars.md für primäre Navigationsmuster.

Verwendung von "Apple HIG: Layout and Navigation Components". Wie gehe ich mit Tab-Leisten um, wenn ich 6 Bereiche auf oberster Ebene habe?

Erwartetes Ergebnis:

iOS-Tab-Leisten unterstützen maximal 5 sichtbare Tabs. Mit 6 Bereichen verwenden Sie einen 'Mehr'-Tab für zusätzliche Bereiche. Erwägen Sie jedoch, ob 6 Bereiche auf oberster Ebene eine Gelegenheit zur Umstrukturierung mit einer Sidebar (iPad) oder verschachtelter Navigation darstellen. Für iPadOS 18+ verwenden Sie .sidebarAdaptable, um automatisch die Sidebar auf iPad und die Tab-Leiste auf iPhone anzuzeigen. Referenz: tab-bars.md für Tab-Anzahl-Leitfaden, sidebars.md für alternative Muster.

Sicherheitsaudit

Sicher
v1 • 2/25/2026

This skill contains only documentation markdown files referencing Apple Human Interface Guidelines. All 768 static analysis findings are false positives: backtick patterns are markdown code blocks with API names, URLs link to official Apple Developer documentation, and cryptographic/C2 keywords are spurious text matches in design documentation. No executable code, network calls, or system commands present.

12
Gescannte Dateien
1,169
Analysierte Zeilen
0
befunde
1
Gesamtzahl Audits
Keine Sicherheitsprobleme gefunden
Auditiert von: claude

Qualitätsbewertung

45
Architektur
100
Wartbarkeit
87
Inhalt
32
Community
100
Sicherheit
65
Spezifikationskonformität

Was du bauen kannst

iOS-App-Navigationsdesign

Ein Entwickler, der seine erste iPad-App erstellt, muss sich zwischen Tab-Leisten und Sidebars für die Navigation entscheiden. Der Skill erklärt, wann jedes Muster verwendet werden sollte und wie NavigationSplitView sich über verschiedene Größenklassen hinweg anpasst.

Plattformübergreifende Layout-Strategie

Ein Team, das auf iPhone, iPad und Mac startet, benötigt eine einheitliche Navigationsstrategie. Der Skill bietet die Anpassungs-Checkliste und die Musterauswahl-Tabelle, um responsive Layouts zu planen.

visionOS-Raumlayout

Ein Entwickler, der seine erste visionOS-App erstellt, muss Fenster, Volumes und Ornamente verstehen. Der Skill erklärt die räumliche Positionierung und Ornament-Anbindungsmuster.

Probiere diese Prompts

Grundlegende Navigationsmuster-Auswahl 
Ich erstelle eine App mit 4 Hauptbereichen: Home, Suche, Bibliothek und Einstellungen. Welches Navigationsmuster sollte ich für iPhone vs. iPad verwenden?
Adaptive Layout-Anleitung 
Meine App verwendet ein dreispaltiges Layout auf iPad, aber auf iPhone funktioniert es nicht. Wie sollte ich dies mit NavigationSplitView anpassen?
Plattformspezifische Konventionen 
Was sind die Unterschiede zwischen macOS-Sidebars und iPad-Sidebars? Wann sollte ich jedes Muster verwenden?
Erweiterte Multitasking-Unterstützung 
Meine iPad-App muss Split View, Slide Over und Stage Manager unterstützen. Welche Größenklassenübergänge sollte ich testen und wie gehe ich mit ihnen um?

Bewährte Verfahren

  • Überprüfen Sie immer zuerst nach vorhandene apple-design-context.md, bevor Sie Fragen stellen - verwenden Sie bereits verfügbare Informationen
  • Passen Sie das Navigationsmuster an die Tiefe der Informationsarchitektur an: flache Strukturen verwenden Tab-Leisten, tiefe Hierarchien verwenden Sidebars
  • Testen Sie die Layout-Anpassung bei jedem Größenklassenübergang und iPad-Multitasking-Verhältnis

Vermeiden

  • Verwendung von Tab-Leisten auf iPad, wenn eine Sidebar tiefe Hierarchien besser handhaben würde
  • Erstellung von Layouts mit fester Breite, die sich nicht an kompakte vs. reguläre Größenklassen anpassen
  • Ignorieren von visionOS-Raumkonventionen bei der Entwicklung für Apple Vision Pro

Häufig gestellte Fragen

Wann sollte ich eine Sidebar vs. eine Tab-Leiste verwenden?
Verwenden Sie Tab-Leisten für 3-5 gleichrangige Bereiche auf oberster Ebene mit flacher Navigation (iPhone). Verwenden Sie Sidebars für tiefe hierarchische Navigation oder wenn Sie viele Bereiche haben (iPad, Mac). iPadOS 18+ unterstützt .sidebarAdaptable, das automatisch die Sidebar auf iPad und die Tab-Leiste auf iPhone anzeigt.
Wie mache ich mein Layout sowohl auf iPhone als auch auf iPad funktionsfähig?
Verwenden Sie adaptive Komponenten wie NavigationSplitView und SizeClass-Modifikatoren. Entwerfen Sie zuerst für kompakte Breite (iPhone), dann erweitern Sie für reguläre Breite (iPad/Mac). Testen Sie bei jedem Größenklassenübergang und verwenden Sie die Anpassungs-Checkliste im Skill.
Wie viele Tabs kann ich maximal in einer Tab-Leiste anzeigen?
iOS-Tab-Leisten zeigen maximal 5 Tabs an. Zusätzliche Elemente werden in einen 'Mehr'-Bereich verschoben. Wenn Sie mehr als 5 Bereiche auf oberster Ebene benötigen, erwägen Sie eine Umstrukturierung mit einer Sidebar oder verschachtelter Navigationshierarchie.
Wie unterstütze ich iPad-Multitasking (Split View, Slide Over)?
Testen Sie Ihre App bei jedem Split-Verhältnis von schmal bis breit. Stellen Sie sicher, dass der Inhalt angemessen umfließt und die Navigation sich anpasst. Verwenden Sie Auto-Layout und Größenklassen anstelle fester Abmessungen. Referenz: split-views.md und windows.md für Multitasking-Leitfaden.
Was sind Ornamente in visionOS?
Ornamente sind visionOS-UI-Elemente, die an Fenstern für Symbolleisten und Steuerelemente angehängt sind, ohne Inhalte zu verdecken. Sie erscheinen an den Fensterrändern (oben, unten, führend, nachfolgend). Verwenden Sie Ornamente für dauerhafte Steuerelemente, während der Hauptinhalt sichtbar bleibt. Referenz: ornaments.md.
Sollte ich SwiftUI oder UIKit für Navigationskomponenten verwenden?
SwiftUI bietet integrierte Adaptivität mit NavigationSplitView, TabView und NavigationStack, die automatisch Größenklassenänderungen handhaben. UIKit erfordert mehr manuelle Arbeit mit UISplitViewController und UINavigationController. Für neue Apps bevorzugen Sie SwiftUI, es sei denn, Sie haben spezifische UIKit-Anforderungen.

Entwicklerdetails

Autor

sickn33

Lizenz

MIT

Repository

https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/hig-components-layout

Ref

main

Dateistruktur

📁 references/

📄 boxes.md

📄 column-views.md

📄 lists-and-tables.md

📄 ornaments.md

📄 outline-views.md

📄 panels.md

📄 scroll-views.md

📄 sidebars.md

📄 split-views.md

📄 tab-bars.md

📄 tab-views.md

📄 windows.md

📄 SKILL.md