swiftui-graphics

# SwiftUI Graphics > Advanced SwiftUI visuals: Metal shaders, visual effects, Liquid Glass, Canvas. > Loaded for advanced thesis (shaders, holographic, liquid-glass, distortion). > Foundation: `../swiftui-motion/SKILL.md` covers the basics. > Concise rules here. Deep-dives in `references/`. --- ## Decision Tree: Which API? | Need | API | |---|---| | Pixel-level color manipulation | `.colorEffect(ShaderLibrary....)` | | Pixel position / distortion | `.distortionEffect(ShaderLibrary....)` | | Full layer with overlay (mix shader + bg) | `.layerEffect(ShaderLibrary....)` | | View modifier with geometry context | `.visualEffect { content, geometry in }` | | Custom drawing (paths, gradients) | `Canvas { context, size in }` | | iOS 26+ glassmorphism | `.glassEffect()` / `GlassEffectContainer` | | Performance dump | `Canvas` with `.opaque(true)` then export | > **Default order of escalation:** built-in modifiers -> `.visualEffect` -> `Canvas` -> Metal shader. Reach for shaders only when the effect is per-pixel and animated. --- ## Metal Shaders Intro SwiftUI binds to Metal Shading Language (MSL) via three modifiers shipped in iOS 17: `.colorEffect`, `.distortionEffect`, `.layerEffect`. You author a `.metal` file in your app target, mark functions with the `[[ stitchable ]]` attribute, and SwiftUI auto-generates the Swift binding via `ShaderLibrary.<functionName>(...)`. One library per app target. Shaders run on the GPU at native resolution; arguments are passed as `.float`, `...