Build a Custom Nav Bar

Learn how to build your own Navigation Bar with custom styling

Safe Area Inset and Nav Buttons

Create a Safe Area for your custom Nav Bar, Tab Bar and buttons to avoid overlapping with the content

Detect Scroll with Coordinate Space

Use GeometryReader, PreferenceKey and Coordinate Space to detect the scroll position and apply animations

Sync States with Binding

Use Binding to synchronize your states between views to animate a custom Navigation Bar

Animatable Font

Create a custom animatable modifier to smoothly animate a text size

Tab View Pagination

Create a beautiful horizontal scroll using tabViewStyle page

Parallax and Rotation 3D Effect

Use GeometryReader to detect the X position and apply a 3D perspective with parallax to your UI

Matched Geometry Effect

Create a custom transition with shared elements using Matched Geometry Effect

Transition Between Views

Apply a more complex structure with an image, a mask, a scroll view and a blur material to your matched geometry effect

Passing Namespace

Create separate components for your Matched Geometry Effect and synchronize the namespace between multiple views

Status Bar and onChange

Show and hide the status bar with transition and learn how to create preset animations

Transition and Chaining Animation

Customize the transition insertion and removal and learn to chain animations with onAppear

Matched Geometry with Data

Create a custom transition with an array of cards and apply data with unique IDs

Selected Card

Set a selectedID and placeholders for your custom transition with multiple cards

Environment Objects

Synchronize a non-persistent state across the app using environment objects and Combine

Scroll Parallax

Apply offset and effects at different speed to create a parallax effect during scroll

Drag Gesture

Use the DragGesture to apply a scale animation to your view

Edge Pan Gesture

Limit the swipe zone and add a dismiss animation with distance configurations

Lazy Grid

Apply a grid layout that spread items vertically and horizontally