FlexibleSpaceBar class
The part of a Material Design AppBar that expands, collapses, and stretches.
Most commonly used in the SliverAppBar.flexibleSpace field, a flexible space bar expands and contracts as the app scrolls so that the AppBar reaches from the top of the app to the top of the scrolling contents of the app. When using SliverAppBar.flexibleSpace, the SliverAppBar.expandedHeight must be large enough to accommodate the SliverAppBar.flexibleSpace widget.
Furthermore is included functionality for stretch behavior. When SliverAppBar.stretch is true, and your ScrollPhysics allow for overscroll, this space will stretch with the overscroll.
The widget that sizes the AppBar must wrap it in the widget returned by FlexibleSpaceBar.createSettings, to convey sizing information down to the FlexibleSpaceBar.
fadeTitle
, blurBackground
and
zoomBackground
. The app bar also makes use of CollapseMode.parallax by
default.
To create a local project with this code sample, run:
flutter create --sample=material.FlexibleSpaceBar.1 mysample
See also:
- SliverAppBar, which implements the expanding and contracting.
- AppBar, which is used by SliverAppBar.
- material.io/design/components/app-bars-top.html#behavior
- Inheritance
-
- Object
- DiagnosticableTree
- Widget
- StatefulWidget
- FlexibleSpaceBar
Constructors
-
FlexibleSpaceBar({Key? key, Widget? title, Widget? background, bool? centerTitle, EdgeInsetsGeometry? titlePadding, CollapseMode collapseMode = CollapseMode.parallax, List<
StretchMode> stretchModes = const <StretchMode>[StretchMode.zoomBackground], double expandedTitleScale = 1.5}) -
Creates a flexible space bar.
const
Properties
- background → Widget?
-
Shown behind the title when expanded.
final
- centerTitle → bool?
-
Whether the title should be centered.
final
- collapseMode → CollapseMode
-
Collapse effect while scrolling.
final
- expandedTitleScale → double
-
Defines how much the title is scaled when the FlexibleSpaceBar is expanded
due to the user scrolling downwards. The title is scaled uniformly on the
x and y axes while maintaining its bottom-left position (bottom-center if
centerTitle is true).
final
- hashCode → int
-
The hash code for this object.
no setterinherited
- 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
-
stretchModes
→ List<
StretchMode> -
Stretch effect while over-scrolling.
final
- title → Widget?
-
The primary contents of the flexible space bar when expanded.
final
- titlePadding → EdgeInsetsGeometry?
-
Defines how far the title is inset from either the widget's
bottom-left or its center.
final
Methods
-
createElement(
) → StatefulElement -
Creates a StatefulElement to manage this widget's location in the tree.
inherited
-
createState(
) → State< FlexibleSpaceBar> -
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
-
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}) → 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