# Swiftui Specialist

> SwiftUI expert for complex UI implementations, custom layouts, animations, and advanced view compositions. Use when building complex UI or troubleshooting SwiftUI issues.

- Skill: `duboc/swiftui-specialist` (Agent Skill)
- Install (CLI): `npx skillmds@latest add duboc/swiftui-specialist`
- Raw SKILL.md: https://api.skillmd.com/api/skills/duboc/swiftui-specialist/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: duboc (https://skillmd.com/u/duboc)
- Updated: 2026-09-22
- Page: https://skillmd.com/skills/duboc/swiftui-specialist

---


# SwiftUI Specialist

Expert in complex SwiftUI implementations.

## Expertise Areas
- Custom layouts with Layout protocol
- Complex animations and transitions
- Custom view modifiers
- Preference keys
- Environment values
- GeometryReader usage
- NavigationStack patterns
- Accessibility implementation
- Performance optimization

## Custom Layout Example
```swift
struct FlowLayout: Layout {
    var spacing: CGFloat = 8

    func sizeThatFits(proposal: ProposedViewSize, subviews: Subviews, cache: inout ()) -> CGSize {
        let sizes = subviews.map { $0.sizeThatFits(.unspecified) }
        return layout(sizes: sizes, proposal: proposal).size
    }

    func placeSubviews(in bounds: CGRect, proposal: ProposedViewSize, subviews: Subviews, cache: inout ()) {
        let sizes = subviews.map { $0.sizeThatFits(.unspecified) }
        let offsets = layout(sizes: sizes, proposal: proposal).offsets

        for (subview, offset) in zip(subviews, offsets) {
            subview.place(at: CGPoint(x: bounds.minX + offset.x, y: bounds.minY + offset.y), proposal: .unspecified)
        }
    }

    private func layout(sizes: [CGSize], proposal: ProposedViewSize) -> (size: CGSize, offsets: [CGPoint]) {
        // Layout calculation logic
    }
}
```

## Animation Patterns
```swift
// Matched Geometry Effect
struct AnimatedTransition: View {
    @Namespace private var animation
    @State private var isExpanded = false

    var body: some View {
        if isExpanded {
            ExpandedView()
                .matchedGeometryEffect(id: "card", in: animation)
        } else {
            CompactView()
                .matchedGeometryEffect(id: "card", in: animation)
        }
    }
}

// Phase Animator (iOS 17+)
Text("Hello")
    .phaseAnimator([false, true]) { content, phase in
        content
            .scaleEffect(phase ? 1.5 : 1)
            .opacity(phase ? 1 : 0.5)
    }
```

## Preference Keys
```swift
struct SizePreferenceKey: PreferenceKey {
    static var defaultValue: CGSize = .zero

    static func reduce(value: inout CGSize, nextValue: () -> CGSize) {
        value = nextValue()
    }
}

extension View {
    func readSize(_ size: Binding<CGSize>) -> some View {
        background(
            GeometryReader { geo in
                Color.clear.preference(key: SizePreferenceKey.self, value: geo.size)
            }
        )
        .onPreferenceChange(SizePreferenceKey.self) { size.wrappedValue = $0 }
    }
}
```

## Accessibility
```swift
struct AccessibleButton: View {
    let action: () -> Void

    var body: some View {
        Button(action: action) {
            Image(systemName: "plus")
        }
        .accessibilityLabel("Add item")
        .accessibilityHint("Double tap to add a new item to your list")
        .accessibilityAddTraits(.isButton)
    }
}
```

## Focus
Provide implementation guidance for complex SwiftUI challenges with working code examples.