shader_transitions 1.0.0
shader_transitions: ^1.0.0 copied to clipboard
GPU-accelerated shader page transitions for Flutter — diamond, circle iris, and wipe with eight sweep directions, optional cover color, and a cinematic hold.
Changelog #
1.0.0 — Stable #
API freeze. No code changes vs 0.3.2 — this marks the sealed
ShaderTransition API and the eight-transition catalogue (diamond, circle,
wipe, clock, polygon, dissolve, fade, bars) as stable under semantic
versioning.
- README documents the full catalogue (features, showcase, per-type config reference).
- pana: 150/160 (50/50 static analysis, 40/40 dependencies, WASM-ready, lower-bound-constraint compatible). The remaining points are the screenshots bucket, pending recorded GIFs.
0.3.2 — Bars / venetian-blind transition (additive) #
BarsTransition—countparallel bars alongdirectionreveal in parallel for a venetian-blind effect (reuses the shareduSectorsuniform as the bar count; no uniform layout change).- Example gallery gains a Bars entry.
- Not added, by design: a content slide moves the child — that's a
transform, not an alpha mask, so it's outside this package's
ShaderMask(dstIn)core; use Flutter's built-inSlideTransition. A corner wipe is alreadyWipeTransitionwith a diagonalSweepDirection. Combination presets are already expressible by pairing any transition with aTransitionCover. - No breaking changes.
0.3.1 — Dissolve + fade transitions (additive) #
DissolveTransition— noise-grain dissolve;graincontrols how soft the speckle fades in.FadeShaderTransition— uniform shader cross-fade that composes withcoverand the lifecycle callbacks like every other transition.- Example gallery gains Dissolve and Fade entries. No breaking changes.
0.3.0 — Clock + polygon transitions (additive) #
ClockTransition— a radial sweep aroundorigin, optionally fanned intosectorsidentical wedges;invertreverses the sweep direction.PolygonTransition— a regular n-gon iris (sides≥ 3; high counts look circular);origin,feather,rotation,invertapply.- Internal shader uniform layout extended to v3 (
uSectors,uSides); the public parameter vocabulary is unchanged. - Example gallery gains Clock and Polygon entries with a sectors/sides control. No breaking changes.
0.2.0 — Widget transitions + lifecycle hooks (additive) #
ShaderTransitionSwitcher— anAnimatedSwitcheranalog that runs aShaderTransitionbetween two child widgets (not routes). Key your children to trigger swaps.onStart/onComplete/onProgresscallbacks onShaderPageRoute,ShaderTransitionBuilders.create, andShaderTransitionSwitcher. This is the sound mechanism — play your own audio inonStart; the package adds no audio dependency.- No breaking changes.
0.1.0 — API redesign (breaking) #
The single overloaded ShaderTransitionConfig is replaced by a sealed
ShaderTransition hierarchy with a clear, shared parameter vocabulary.
Breaking changes
- Removed
ShaderTransitionConfig,TransitionType. Use the sealed types:DiamondTransition,CircleTransition,WipeTransition. ShaderPageRoute(config:)→ShaderPageRoute(transition:).ShaderTransitionBuilders.create(config)now takes aShaderTransition.- The overloaded
sizeis gone: it'sDiamondTransition.cellSize,WipeTransition.softness. transitionDuration→duration. Loosecolor+coverDurationare grouped intoTransitionCover(color:, hold:)passed ascover:.
Migration
| 0.0.x | 0.1.0 |
|---|---|
ShaderTransitionConfig.diamond(size: 40, transitionDuration: d) |
DiamondTransition(cellSize: 40, duration: d) |
ShaderTransitionConfig.wipe(size: 6) |
WipeTransition(softness: 6) |
ShaderTransitionConfig.circle() |
CircleTransition() |
color: Colors.black, coverDuration: h |
cover: TransitionCover(color: Colors.black, hold: h) |
ShaderPageRoute(config: c) |
ShaderPageRoute(transition: t) |
New
CircleTransition.origin(Alignment) — iris can emanate from any point.- Shared
invertflag — e.g.CircleTransition(invert: true)is a contracting iris; flips reveal order for directional transitions. WipeTransition.rotation(radians) — tilt the wipe edge.ShaderPageTransitionsBuilder— drop intoThemeData.pageTransitionsThemefor app-wide shader transitions.- Unified shader uniform layout v2 (origin / direction / feather / cellSize
/ rotation / invert) shared by every
.frag.
0.0.3 #
- Lower the SDK floor to Dart 3.0 / Flutter 3.10 (was Dart 3.2 / Flutter 3.16). This is the lowest that supports the Dart 3 records & patterns used in
lib/plusui.FragmentProgram.fromAsset(stable since Flutter 3.7), widening compatibility for consumers. - Dartdoc: document every
SweepDirectionvalue and theSweepDirectionVectorextension; fix stalecoverHoldreferences inShaderMaskTransitiondocs (the field iscoverDuration). - README: per-transition "how it works" explanations in the showcase; updated Flutter badge and install constraint.
0.0.2 #
- Shorten pubspec
descriptionto fit within pub.dev's 60–180 character window (was 218 chars and failed the "Provide a valid pubspec.yaml" check).
0.0.1 — Initial release #
ShaderTransitions.preload()to compile all bundled fragment shaders once at app startup.ShaderPageRoute+ShaderTransitions.{diamond, circle, wipe}convenience factories forNavigator-style use.ShaderTransitionBuilders.create(config)forCustomTransitionPage(go_router) andCustomRoute(auto_route) integrations.- Three shaders: diamond grid (Manhattan-distance reveal), circle iris, linear directional wipe with feathered edge.
- Eight
SweepDirectionvalues — four axis-aligned, four diagonals; all normalized so push and pop wipes reach every corner regardless of direction. - Optional
colorcover with a configurablecoverDurationhold and a 75% clamp so the wipes always retain visible motion. - Cell-size floor of 1 px on the diamond shader (no divide-by-zero, no sub-pixel aliasing).
- Example gallery app with two-column layout at ≥ 720 px wide and page-navigation flow below.