liquid_glass_renderer 1.0.0-dev.1
liquid_glass_renderer: ^1.0.0-dev.1 copied to clipboard
An iOS 27-style liquid glass renderer for Flutter.
1.0.0-dev.1 #
A rendering release with no public API changes.
- Tighten the iOS 27 material fit: light/dark color transfer and the frost size response now follow the pinned captures from 63 pt controls through 150 pt material cards. Small-size transmittance/lift/chroma are pre-blended on the CPU, so the shader needs no extra uniform slot.
- Use the measured soft glint plateau (
0.6) instead of overexposing the first pixel inside the silhouette, and make the merged-shape glint match the same rim profile. - Damp refracted displacement by the blended SDF gradient length at matte bake time, removing the over-bright caustic at concave merged seams without adding a per-frame pass.
- Draw FakeGlass highlights in a separate additive pass. The glint adds light instead of replacing the translucent face and can keep extended-range headroom on EDR targets; the pass exits before contour/bevel work.
- Remove the Reduce Motion reference captures and point the harness at the motion-off set. Drop brittle tests that asserted tuned defaults, exact color constants, shader source strings, or uniform packing.
1.0.0-dev.0 #
Note: This release has breaking changes.
A rewrite of the renderer on Flutter GPU, fitted against iOS 27 Liquid Glass.
It replaces the 0.2.x API without deprecations. This is an experimental
prerelease; APIs and rendering may still change.
Breaking changes #
- Requirements. Full glass needs Impeller and Flutter GPU
(
--enable-flutter-gpu,FLTEnableFlutterGPU, orio.flutter.embedding.android.EnableFlutterGPU). Everywhere else layers renderFakeGlass. The minimum Flutter version is 3.47.0. - Settings are split.
LiquidGlassSettingskeeps the optics and lighting shared by a layer. Color and visibility move to the new per-shapeLiquidGlassAppearance, set on aLiquidGlassor as a layer'sdefaultAppearance. - Renamed and replaced settings:
glassColorbecomesLiquidGlassAppearance.tint.saturationbecomesLiquidGlassColorModel.direct(saturation: ...).visibilitymoves toLiquidGlassAppearance.visibilityand the newLiquidGlassVisibilitywidget.blurbecomesfrost, a blur sigma in logical pixels.thicknessbecomesrefractionHeight, the width of the refracting bevel.0now means flat glass instead of no glass.refractiveIndexbecomesrefractionAmount, the displacement in logical pixels at the silhouette, falling off across the bevel as a quarter circle.chromaticAberrationbecomesdispersion, and defaults to0.lightIntensitybecomeshighlight.1now matches the iOS 27 glint on an iPhone.lightAngleandambientStrengthare removed; the light direction is no longer configurable.
LiquidGlassSettings.figmais removed for now. It may come back in a later release.- Children always paint above the glass.
glassContainsChildis removed from everyLiquidGlassconstructor. Children are clipped to the shape but never blurred, tinted or refracted. - No
Opacitybetween a layer and its shapes. It only faded the children, not the glass. UseLiquidGlassVisibilityorLiquidGlassAppearance.visibility.Opacityabove a wholeLiquidGlassLayerstill works. - New defaults. Glass renders with a 20 pt bevel, 60 pt edge
displacement, 2.1 pt frost and the rest of the light iOS 27 regular glass
settings, plus the iOS 27 regular appearance for the platform brightness,
so unconfigured glass looks different from
0.2.x. These defaults may be retuned before 1.0; theios27*presets track iOS 27. Preset and default frost is raised further on the device so Impeller downsamples the blur pass, capped at the 2x value; an explicitfrostis used as given. - Dark regular glass is size-independent. The fitted
GlassColorParameters.ios27Darktransmittance no longer blends a small- and a large-side curve by the shape's short side, which the layer could only feed as the smallest shape's short side. Both curves are replaced by their equal-weight midpoint, so small shapes render slightly darker and large shapes slightly lighter. Other presets are unchanged. - A smaller, closed public API.
LiquidShapeissealed;LiquidOval,LiquidRoundedRectangleandLiquidRoundedSuperellipsearefinal: the set of shapes is closed andswitches over aLiquidShapeare exhaustive, so adding a shape later is a compile-time error rather than silently falling through. The glass ignores a shape'sside.LiquidGlassSettings,LiquidGlassAppearanceandLgrLogsarefinal.LiquidGlass.groupedandLiquidGlass.withOwnLayerno longer takeblendGroupLink, and thegrouped,blendGroupLinkandownLayerConfigfields are gone fromLiquidGlass.FakeGlassandFakeGlass.inLayerno longer takebackdropHandledByLayer.LiquidGlassBlendGroup.ofandmaybeOfand theLiquidGlassSettings.effective*getters are internal.LiquidGlassAppearancekeeps onlytint,visibilityandcolorModel. Itssaturation,transmissionGammaandvibrancyare removed and move ontoLiquidGlassColorModel.direct(saturation:, transmissionGamma:, vibrancy:); the iOS 27 models carry the whole transfer in their fitted parameters.- There is one regular glass preset, as in SwiftUI: the identical
LiquidGlassAppearance.ios27Toolbar*presets are removed, andLiquidGlassSettings.ios27Toolbar*are renamed toios27Regular,ios27RegularLightandios27RegularDark. - Experimental, and may change before 1.0: every
toJson/fromJsonandLgrLogs.
New features #
- iOS 27 presets.
ios27Regularandios27Clearon bothLiquidGlassSettingsandLiquidGlassAppearance(with light and dark variants of regular), fitted against captures of Apple's glass in light and dark. - The Liquid Glass slider.
LiquidGlassSettings.tintAmounttakes the position of the iOS 27 Settings slider, from Clear (0) to Tinted (1). It moves the iOS 27 wash and border along fitted curves, and the presets derive their blur from it throughLiquidGlassSettings.ios27RegularFrostandios27ClearFrost. - Color models.
LiquidGlassColorModel: the iOS 27 models turn one tint and its opacity into backdrop-dependent tones, with dark regular glass getting denser on larger shapes. The direct model exposessaturation,transmissionGammaandvibrancyfor manual looks. - Bevel refraction.
refractionFitsShape(defaulttrue) shrinks the lens on small shapes like iOS 27 regular glass; clear glass keeps the full lens.backdropShrinkshrinks the backdrop seen through the face and never enlarges it. The backdrop is sampled bilinearly so refracted lines don't snap to pixels. - Glint and rim lighting. A glint that recolors the glass instead of
adding white, with HDR headroom on wide-gamut surfaces; a dark border
(
contourStrength,contourDirectionality); and an inner shadow cast by the rim (bevelShadowStrength). The rim geometry is the fitted iOS 27 one and is not configurable. - Per-shape appearance in blend groups. Each shape can have its own
LiquidGlassAppearance; blended neighbors cross-fade where they meet without another backdrop capture. - Blending without bulges. Shapes in a
LiquidGlassBlendGroupkeep shared straight edges straight and round only concave joins and bridges, as in iOS 27'sGlassEffectContainer. LiquidGlassVisibilityfades glass in a subtree: refraction, lighting, blur and children fade together. Nested scopes multiply, and a layer with no visible shapes stops sampling the backdrop.LiquidGlassCapturecaptures the backdrop once, only as large as the glass inside, so glass on glass (an indicator refracting its tab bar) no longer pays a second full-screen readback.LiquidGlass.autorenders on a parent layer if there is one and creates its own otherwise.LiquidGlass.precache()loads the shaders and warms the Flutter GPU pipeline beforerunApp, so the first glass on screen renders fully.backdropKeyonLiquidGlassLayershares a backdrop capture between layers explicitly.- Per-shape
shadows, cut out behind the translucent glass, also under blended shapes. FakeGlassrework. It renders at layer level with the same foreground order as full glass and keeps frost, tint, color response, glint, border, inner shadow, visibility and exterior shadows. Only refraction is missing. The web build compiles and rendersFakeGlass.
Performance #
- Geometry mattes, coordinate mappings, image filters and static transforms are cached; geometry textures grow only when needed and are reused after one frame. Fragment work is clipped to the glass.
- Frost always uses Impeller's blur. Preset and default frost is raised per
device so Impeller downsamples the blur pass: it picks a power-of-two
downsample factor from the blur's device-space size and only downsamples
above roughly 5.8 device pixels. The raise is capped at the 2x value (2.9
logical pixels), since a full-resolution blur is cheap on 1x displays. An
explicit
frostis used as given. - Debug builds log a warning when a frame makes more than one independent
backdrop capture, and when a layer has more glass shapes than
LiquidGlassBlendGroup.maxShapesPerLayerand drops the rest. - The README documents performance best practices.
0.2.0-dev.4 #
Note: This release has breaking changes.
- BREAKING FIX: fake glass didn't render properly on skia and had bad specular highlights (#119).
0.2.0-dev.3 #
-
FIX: improve logging readability and names.
-
FIX: don't create intermediate images for geometry until it's settled.
This should decrease memory consumption somewhat, as a layer with one animating geometry would create 2 images per frame before
-
FEAT: export
debugPaintLiquidGlassGeometry(#111).
0.2.0-dev.2 #
- FIX: glass was always grouped no matter which constructor was used.
- FIX: one frame delay in geometry mattes.
- FIX: link doesn't need to notify listeners, we can mark it dirty.
0.2.0-dev.1 #
Note: This release has breaking changes.
-
FIX: adjust
LiquidGlassSettingsdefaults to match the look more closely. -
FEAT: cache geometry images as well to make sure we only run the geometry shader when absolutely necessary.
-
DOCS: mention Impeller requirement earlier in README.
-
DOCS: update README with newest changes and performance tips.
-
BREAKING REFACTOR: remove the unsupported experimental widget API.
-
BREAKING REFACTOR: renamed many constructors and default
LiquidGlassto not creating its own layer.Please read the README to understand how to use this package.
-
BREAKING REFACTOR:
LiquidGlassShapes now take a simple double as radius. -
BREAKING REFACTOR: move
blendsetting fromLiquidGlassSettingstoLiquidGlassBlendGroup. -
BREAKING FEAT: adjust fake glass light intensity.
-
BREAKING FEAT: rewrote rendering pass to use two passes.
We now cache all geometry into textures first, then render liquid glass in a second pass. This allows us to save a lot of cycles while glass shapes are static.
0.1.1-dev.26 #
Note: This release has breaking changes.
-
FIX: only run shader on bounding box pixels.
-
FIX: set alwaysNeedsCompositing correctly on
FakeGlass. -
BREAKING REFACTOR: change default blend value to 0 in
LiquidGlassSettings. -
BREAKING REFACTOR: move
fakeparameter toLiquidGlassLayerand make entire layer fall back to fake glass on Skia. -
BREAKING FEAT: visibility parameter in
LiquidGlassSettings.This can be used to scale all relevant properties of the liquid glass effect at once.
If you have made glass appear and disappear manually before, you can now simply animate the visibility between 0 and 1.
0.1.1-dev.25 #
- FEAT: add
fakeparameter toLiquidGlassto enable it to turn intoFakeGlassdynamically (#103).
0.1.1-dev.24 #
- FIX: import
@internalfrom meta again (#102). - FIX: scrolling elements work again.
- FEAT: add
FakeGlass.inLayerwhich adopts settings from the nearest ancestor layer.
0.1.1-dev.23 #
Note: This release has breaking changes.
- BREAKING FEAT: re-use generated geometry more aggressively (#98).
0.1.1-dev.22 #
Note: This release has breaking changes.
-
FIX: reduce texture samples (#94).
-
FEAT: small performance wins in shader (#91).
-
BREAKING REFACTOR: remove
restrictThickness. -
BREAKING FEAT: rewrote the rendering process to use two passes.
This significantly improves performance while glass elements are static on screen. Moving glass elements will still induce the same performance cost as before.
0.1.1-dev.20 #
- FIX:
resistanceparameter didn't actually get used.
0.1.1-dev.19 #
Note: This release has breaking changes.
- FIX: revert matrix methods to support older Flutter versions again.
- FIX:
TileMode.mirrorinFakeGlassblur. - FEAT: allow customizing
resistanceinLiquidStretch. - FEAT: expose
RawLiquidStretchfor custom pixel-based stretching. - FEAT: expose
Offset.withResistanceextension method. - BREAKING FEAT:
LiquidStretchnow bases its stretch on the child's size.
0.1.1-dev.18 #
- FIX: removed unused transform from shader (#88).
- FIX: render liquid glass correctly on all Android devices (#82 by @teociaps).
0.1.1-dev.17 #
- FEAT: tried to improve the fidelity of fake light once more.
0.1.1-dev.16 #
- FIX: import annotations from
package:metaagain.
0.1.1-dev.15 #
Note: This release has breaking changes.
- FIX: settling springs.
- FIX: optimize some painting and transformations with early return.
- FEAT: better specular on all platforms for
FakeGlass(#83). - BREAKING REFACTOR: rename
StretchGlasstoLiquidStretch.
0.1.1-dev.14 #
- FIX:
LiquidGlassLayerbreaks when no child glass widgets are found.
0.1.1-dev.13 #
- DOCS: update README and add better disclaimer (#80).
0.1.1-dev.12 #
Note: This release has breaking changes.
- FIX: regression in how
LiquidGlassapplies transform to children. - FEAT: add
GlassGlowLayerandGlassGlowwidget for glow effects. - FEAT: add
StretchGlasswidget that can stretch its child with user gestures. - FEAT: add
FakeGlasswidget that aims to matchLiquidGlassappearance while being much more performant. - BREAKING REFACTOR: remove useless
lightnessparameter from shader andLiquidGlassSettings. - BREAKING REFACTOR: change default value of
glassContainsChildto false.
0.1.1-dev.11 #
Note: This release has breaking changes.
- BREAKING FEAT: performance gains and too many changes to cover one by one (#72).
0.1.1-dev.10 #
Note: This release has breaking changes.
- REFACTOR: move shader to uniform arrays for better shape support.
- FIX: transform children of liquid glass correctly.
- FEAT: add saturation and brightness controls (#47).
- FEAT: better light dispersion.
- FEAT: support up to 64 shapes per layer.
- FEAT: specular highlights now take the background color into account (#43).
- DOCS: updated README with new parameters (#56).
- DOCS: updated example gif (#55).
- BREAKING FEAT: cheat lighting that is independent from thickness.
0.1.1-dev.9 #
- DOCS: fix errors in README (#31).
0.1.1-dev.8 #
- FIX: glass now also renders when blend is set to 0.
- FIX: sharper glass edges whithout background shining through.
- FEAT: added refractive index to settings and show values in example.
- FEAT: nicer specular highlights.
- DOCS: update README.md and add better examples (#28)
0.1.1-dev.7 #
- FIX: throw
AssertionErrorwhen used without Impeller. - DOCS: update pubspec.yaml to reflect minimum SDK and supported platforms.
0.1.1-dev.6 #
- FIX: liquid glass not repainting in route transitions (#16).
0.1.1-dev.5 #
Note: This release has breaking changes.
- FEAT: decrease precision in shader to mediump, which should increase performance.
- BREAKING FIX: shader compilation and removed unused outline strength parameter.
0.1.1-dev.4 #
- FIX: fix shader on flutter stable.
- DOCS: new shape names.
0.1.1-dev.3 #
- DOCS: new shape names.
0.1.1-dev.2 #
Note: This release has breaking changes.
- REFACTOR: cleaned up shaders.
- FIX: squircle can handle zero radius.
- FEAT: add
clipBehaviortoLiquidGlass. - FEAT: flutter-approved SDF for squircles.
- FEAT: support three shapes per layer.
- FEAT: support all shapes.
- FEAT: better chromatic abberation.
- DOCS: added pub badge to README.
- BREAKING FEAT: renamed liquid glass shapes to match their OutlinedBorder counterparts.
0.1.1-dev.1 #
- DOCS: update pubspec and readme.
0.1.1-dev.0 #
- FEAT: initial release.
0.1.0 #
- feat: initial commit 🎉
