SwiftUI Skill
Gives Claude structured SwiftUI development expertise.
by AgentVoltv1.0.0Published 1y ago1 install
Free to sign up · every skill included with AgentVolt Pro
Before & after
Same prompt, same agent — the only difference is the skill.
Prompt“Build a tab navigation screen with a home feed and settings tab”
Beforegeneric AI agent
SwiftUI provides several ways to handle navigation and tab organization. You can use TabView for tab-based navigation, which allows users to switch between different views easily. You'll want to create separate views for each tab and manage state appropriately throughout the app. Navigation in SwiftUI follows a declarative pattern, so think about how your views relate to each other. I could help you structure a basic TabView setup if you'd like. State management is important too - you might need @State or @StateObject depending on your needs and data flow. Would you like me to outline a basic structure for your home and settings tabs?
Afterwith SwiftUI Skill
import SwiftUI
struct MainTabView: View {
@State private var selectedTab: Int = 0
var body: some View {
TabView(selection: $selectedTab) {
FeedView()
.tabItem {
Label("Home", systemImage: "house.fill")
}
.tag(0)
SettingsView()
.tabItem {
Label("Settings", systemImage: "gear")
}
.tag(1)
}
}
}
struct FeedView: View {
@StateObject private var viewModel = FeedViewModel()
var body: some View {
NavigationStack {
List(viewModel.items) { item in
NavigationLink(destination: ItemDetail(item: item)) {
FeedItemRow(item: item)
}
}
.navigationTitle("Home")
}
}
}
struct SettingsView: View {
@AppStorage("isDarkMode") var isDarkMode = false
var body: some View {
NavigationStack {
List {
Toggle("Dark Mode", isOn: $isDarkMode)
}
.navigationTitle("Settings")
}
}
}
KEY PATTERNS: Use @State for local tab selection. Separate views prevent re-renders. AppStorage connects settings to system persistence. NavigationStack replaces deprecated NavigationView - required for iOS 16+.About this skill
name: swiftui-skill description: Use when Gives Claude structured SwiftUI development expertise.
SwiftUI Skill
Equips Claude with SwiftUI specific patterns and conventions for building native iOS interfaces correctly.
What you get
- SKILL.md with SwiftUI component and layout guidance.
Customize your output
- Covers common SwiftUI view patterns and state management.
Example output
Idiomatic SwiftUI view code for iOS apps.
Best for
iOS developers building with Claude Code.
SKILL.md preview
SKILL.md
---
name: swiftui-skill
description: Use this skill when building native iOS interfaces in SwiftUI and correct, idiomatic view composition and state-management patterns are needed.
version: 1.0.0
category: Design / Design and Frontend
author: AgentVolt
license: proprietary
tags:
- design
- design-and-frontend
- standard
---
# SwiftUI Skill
Equips Claude with SwiftUI-specific structural patterns so generated views compose correctly and use the right state-management primitive for the situation.
## When to use
… (sign up to view the full skill)Sign up to view, copy, and install the full skill
More design skills
View all Design skills →Frontend UI UX Skill (oh-my-opencode)
A frontend UI and UX focused skill from the oh-my-opencode toolkit.
Design
Mobile App UI Design Skill
Guides Claude in designing native feeling mobile app interfaces.
Design
Premium Frontend UI Skill
Pushes generated frontend UI toward a premium, polished visual style.
Design
Material 3 Skill
Teaches Claude Google Material 3 design system conventions.
Design