CNScrollEdgeEffect class

The system scroll edge effect of iOS 26 over the Flutter content behind it: the progressive blur UIKit and SwiftUI apps get where content scrolls under the status bar, a bar or the home indicator.

The effect is drawn by iOS itself (UIScrollEdgeEffect), so it matches native apps and follows accessibility settings such as Reduce Transparency. Under the band it blurs the content and fades it toward the page's backgroundColor, as under a navigation bar with a title, and it is gone just past the band. Put it over the scrolling content, for example in a Stack; it places itself at its edge and lets touches through:

Stack(
  children: [
    CustomScrollView(controller: controller, slivers: ...),
    CNScrollEdgeEffect(edge: CNScrollEdge.top, controller: controller),
  ],
)

With a controller (or scrollMetrics), the effect shows while content is scrolled under the edge and is gone at rest, as in a native scroll view. iOS switches it on as soon as content is under the edge; it doesn't fade in with the offset. Without either, it always shows.

CNTabScaffold can put one behind its tab bar (bottomScrollEdgeEffect: true).

iOS 26 and later only. Elsewhere (earlier iOS, macOS, other platforms) it draws nothing.

Inheritance
Available extensions

Constructors

CNScrollEdgeEffect({Key? key, CNScrollEdge edge = CNScrollEdge.top, double? height, CNScrollEdgeStyle style = CNScrollEdgeStyle.soft, ScrollController? controller, ValueListenable<ScrollMetrics?>? scrollMetrics, Brightness? brightness, Color? backgroundColor})
Creates a scroll edge effect at edge.
const

Properties

backgroundColor → Color?
The background colour of the content under the edge, as a native scroll view's background colour: the effect fades the content toward it, and the CNScrollEdgeStyle.hard band is this colour. Defaults to the CupertinoTheme's scaffold background colour. A transparent colour leaves only the blur.
final
brightness → Brightness?
Whether the effect is drawn for light or dark content. Defaults to the app's brightness.
final
controller → ScrollController?
The scroll view's controller: the effect shows while its content is scrolled under the edge. Without it, the effect always shows.
final
edge → CNScrollEdge
The edge the effect covers. Defaults to CNScrollEdge.top.
final
hashCode → int
The hash code for this object.
no setterinherited
height → double?
The height of the band the effect covers, from the edge. The soft effect fades out at its end, as under a navigation bar.
final
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
scrollMetrics → ValueListenable<ScrollMetrics?>?
The scroll view's metrics, for a scroll view without a controller: update it from a NotificationListener<ScrollMetricsNotification> and NotificationListener<ScrollUpdateNotification> around the scroll view. The effect shows while its content is under the edge. Null metrics keep the effect on.
final
style → CNScrollEdgeStyle
The look of the effect. Defaults to CNScrollEdgeStyle.soft.
final

Methods

createElement() → StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() → State<CNScrollEdgeEffect>
Creates the mutable state for this widget at a given location in the tree.
override
debugDescribeChildren() → List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
liquidGlass({CNGlassEffect effect = CNGlassEffect.regular, CNGlassEffectShape shape = CNGlassEffectShape.capsule, double? cornerRadius, Color? tint, bool interactive = false}) → Widget

Available on Widget, provided by the LiquidGlassExtension extension

Applies a Liquid Glass effect to this widget.
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a one-line detailed description of the object.
inherited
toStringShort() → String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) → bool
The equality operator.
inherited

Static Properties

isSupported → bool
Whether the effect is drawn on this platform (iOS 26 and later).
no setter