Advanced SwiftUI Tab Bar with PreferenceKey & MatchedGeometryEffect
AdventureTube implements a custom tab bar replacing SwiftUI’s default TabView.
Why Custom Tab Bar?
✅ Full design control – Custom styling, shadows, animations
✅ Dynamic visibility – Show/hide programmatically
✅ Smooth animations – matchedGeometryEffect for selection
✅ Type-safe – Enum-based tab items
Tab Items
| Tab | Icon | Title | Purpose |
|---|---|---|---|
.storymap |
map |
Story Map | View stories on map |
.mystory |
list.and.film |
My Stories | Manage user’s stories |
.savedstory |
square.and.arrow.down |
Saved Story | View saved stories |
.setting |
gear |
Setting | App settings |
Advanced SwiftUI Patterns
1. PreferenceKey (Bottom-Up Data Flow)
Child views send tab information UP to parent container
2. ViewModifier (Tab Behavior)
Controls visibility based on selection (opacity 1.0 or 0.0)
3. MatchedGeometryEffect (Smooth Animations)
Selection indicator smoothly animates between tabs
4. Generic Container with ViewBuilder
Generic <Content: View> for any content type
Component Structure
AdventureTubeTabBarView
└─ CustomTabBarContainerView
├─ Content (All Views)
└─ CustomTabBarView (Bottom Overlay) Visibility Control
CustomTabBarViewVM.shared.isTabBarViewShow = false // Hide
CustomTabBarViewVM.shared.isTabBarViewShow = true // Show
