swiftui-toolbars

Customize SwiftUI toolbars with search, transitions, and platform-specific placements.

4|1|Updated Apr 2, 2026
One-click install
npx skills add https://github.com/AutisticAF/claude-code-apple-dev-plugin --skill swiftui-toolbars
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: swiftui-toolbars
Source: https://github.com/AutisticAF/claude-code-apple-dev-plugin/tree/main/skills/swiftui-toolbars
Command: npx skills add https://github.com/AutisticAF/claude-code-apple-dev-plugin --skill swiftui-toolbars

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides practical patterns and code examples to implement modern, customizable toolbars in SwiftUI, solving inconsistent toolbar layouts, poor search integration, and awkward transitions across iOS, iPadOS, and macOS.

Core Features & Use Cases

  • Customizable toolbars: Use .toolbar(id:) with ToolbarItem(id:) to let users add, remove, and reorder items.
  • Search integration: Pair .searchable() with .searchToolbarBehavior(.minimize) and reposition default search using DefaultToolbarItem.
  • Transitions and animations: Create matched transitions from toolbar items with .matchedTransitionSource and navigationTransition(.zoom).
  • Platform-specific placements: Use placements like .bottomBar, .largeSubtitle, and DefaultToolbarItem to adapt to iPhone, iPad, and macOS conventions.
  • Practical checks: Includes API availability guidance, anti-patterns, top mistakes, and a review checklist for robust implementations.

Quick Start

Use the swiftui-toolbars skill to add a customizable toolbar with search, matched-transition animations, and platform-aware placements to a SwiftUI view.

Frequently Asked Questions about swiftui-toolbars

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add a customizable SwiftUI toolbar that lets users reorder items?

You can create a customizable SwiftUI toolbar by using .toolbar(id:) combined with ToolbarItem(id:). This allows users to add, remove, and reorder toolbar items according to their preferences across supported Apple platforms.

What's the best way to integrate searchable fields and minimize the search bar in SwiftUI?

The best way to integrate SwiftUI search is pairing .searchable() with .searchToolbarBehavior(.minimize). You can also reposition the default search field using DefaultToolbarItem for better placement on iPhone, iPad, and macOS.

Does SwiftUI support matched zoom transitions from toolbar items to destination views?

Yes, SwiftUI supports matched zoom transitions by applying .matchedTransitionSource to toolbar items and navigationTransition(.zoom) to destinations. This creates smooth, connected animations when navigating from a toolbar element.

How do I handle platform-specific toolbar placements for iOS, iPadOS, and macOS?

Handle platform-specific SwiftUI toolbar placements by using placements like .bottomBar, .largeSubtitle, and DefaultToolbarItem. These adapt your toolbar items to match the conventions of iPhone, iPad, and macOS interfaces appropriately.

What are common mistakes when implementing SwiftUI toolbar items?

Common SwiftUI toolbar mistakes include ignoring API availability handling, misusing placements, and neglecting DefaultToolbarItem for system items. Reviewing an implementation checklist helps avoid these inconsistent layouts and poor search integration issues.

Why does my SwiftUI search field not reposition correctly across different platforms?

Your SwiftUI search field may not reposition correctly if you do not use DefaultToolbarItem to reposition the default search. Pair .searchable() with .searchToolbarBehavior(.minimize) and handle platform-specific availability.