veil_ui
iOS 26-inspired glass app bar and blurred bottom overlay for Flutter. Scroll-driven shadows, dark mode aware, zero boilerplate. Published on pub.dev under mojaber.me.
veil_ui is a Flutter package I designed and published to bring iOS 26-style glassmorphism to any Flutter app. It provides a transparent GlassAppBar with smooth gradient shadows that appear on scroll, a BlurredBottomOverlay for pinned CTAs over scrollable content, and native Cupertino sheet presentation — all with zero boilerplate, full dark mode support, and RTL awareness.
Features
- GlassAppBar — transparent app bar with a smooth gradient shadow that fades content beneath it. Shadow appears on scroll, hides when at top
- BlurredBottomOverlay — gradient fade-out over scrollable content with a pinned bottom widget (e.g. sticky CTA button)
- showVeilUISheet — native Cupertino modal sheet matching the iOS 26 card-stack presentation
- iOS 26 adaptive back button — SF Symbol on iOS 26+, Material circle button below
- Full dark mode support — all gradients derived from the app's scaffold background color
- RTL-aware — uses standard Localizations, no third-party locale package required
Engineering Decisions
Every design choice was driven by production-grade standards: minimal API surface, zero external dependencies beyond cupertino_native, and a clear separation between platform detection and rendering logic.
- Scroll-driven shadow via ScrollController listener with configurable threshold
- Platform-aware back button: SF Symbol chevron on iOS 26+, Material fallback below
- IosVersionHelper singleton — cached at app startup for zero-cost platform checks at render time
- Gradient colors automatically derived from scaffold background for seamless dark/light theming
- Full parameter customization: title, titleWidget, actions, height, bottom (TabBar), systemOverlayStyle
Screenshots
GlassAppBar
Modal Sheet
BlurredBottomOverlay