AIKraft/Skills/SwiftUI паттерны интерфейса

SwiftUI паттерны интерфейса

Best practices and example-driven guidance for building SwiftUI views and components, including navigation hierarchies, custom view modifiers, and responsive layouts with stacks and grids. Use when creating or refactoring SwiftUI UI, designing tab architecture with TabView, composing screens with VStack/HStack, managing @State or @Binding, building declarative iOS interfaces, or needing component-

dimillian official Дизайн

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

Набор лучших практик и руководств по созданию компонентов, иерархий навигации и адаптивных лейаутов в SwiftUI. Помогает проектировать архитектуру вкладок, управлять состоянием (@State, @Binding, @Observable) и реализовывать компонентно-ориентированный подход для iOS.

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

  • Создание новых экранов или рефакторинг существующего UI на SwiftUI.
  • Проектирование архитектуры навигации с использованием TabView, NavigationStack и Sheets.
  • Компоновка экранов с помощью VStack, HStack, стеков и сеток.
  • Управление состоянием приложения и внедрение зависимостей через @Environment или явные инициализаторы.

Как работает

  1. Определите цель (новый проект или доработка) и выберите трек: для нового проекта используйте references/app-wiring.md для настройки TabView и NavigationStack, для существующего — найдите похожий пример в репозитории.
  2. Выберите нужные обёртки состояния (State, Binding, Observable, Environment) в соответствии с моделью владения данными и минимальной версией iOS.
  3. Используйте references/components-index.md для выбора компонентов, применяя композицию и создавая маленькие, сфокусированные подпредставления.
  4. Реализуйте асинхронную загрузку через .task с явными состояниями загрузки и ошибок, следуя guidance из references/async-state.md.
  5. Добавьте #Preview для основных и вторичных состояний, проверьте отсутствие ошибок компиляции и корректность работы состояний.
  6. При возникновении ошибок или крашей превью изолируйте проблемный подпредставление, исправьте инициализацию состояния и перепроверьте сборку.

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

Создай новый экран настроек с использованием NavigationStack и локального @State, следуя паттернам из app-wiring.md.
Рефактори существующий View: разбей его на маленькие подпредставления и замени @StateObject на @Observable для iOS 17+.
Реализуй модальное окно (Sheet) с передачей выбранной модели через item, избегая параллельных машин состояний.

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

  • Репозиторий с референсами (references/*.md) и примерами кода
  • Среда разработки SwiftUI (iOS 16/17+)
  • Знание конвенций форматирования и гайдлайнов проекта

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

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

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

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