AnimatedSizeAndFade class
The AnimatedSizeAndFade
widget does a fade and size transition between a "new" widget and
an "old" widget/ previously set as a child. The "old" and the "new" children must have the
same width, but can have different heights, and you don't need to know their sizes in
advance. You can also define a duration and curve for both the fade and the size, separately.
Important: If the "new" child is the same widget type as the "old" child, but with different parameters, then AnimatedSizeAndFade will NOT do a transition between them, since as far as the framework is concerned, they are the same widget, and the existing widget can be updated with the new parameters. To force the transition to occur, set a Key (typically a ValueKey taking any widget data that would change the visual appearance of the widget) on each child widget that you wish to be considered unique.
Example:
bool toggle=true;
Widget widget1 = ...;
Widget widget2 = ...;
AnimatedSizeAndFade(
child: toggle ? widget1 : widget2
);
Show and Hide
The AnimatedSizeAndFade.showHide
constructor may be used
to show/hide a widget, by resizing it vertically while fading.
Example:
bool toggle=true;
Widget widget = ...;
AnimatedSizeAndFade.showHide(
show: toggle,
child: widget,
);
## How does AnimatedSizeAndFade compare to other similar widgets?
- With AnimatedCrossFade you must keep both the firstChild and secondChild, which is not
necessary with AnimatedSizeAndFade.
- With AnimatedSwitcher you may simply change its child, but then it only animates
the fade, not the size.
- AnimatedContainer also doesn't work unless you know the size of the children in advance.
- Inheritance
-
- Object
- DiagnosticableTree
- Widget
- StatelessWidget
- AnimatedSizeAndFade
Constructors
- AnimatedSizeAndFade({Key? key, Widget? child, Duration fadeDuration = const Duration(milliseconds: 500), Duration sizeDuration = const Duration(milliseconds: 500), Curve fadeInCurve = Curves.easeInOut, Curve fadeOutCurve = Curves.easeInOut, Curve sizeCurve = Curves.easeInOut, Alignment alignment = Alignment.center})
- AnimatedSizeAndFade.showHide({Key? key, Widget? child, required bool show, Duration fadeDuration = const Duration(milliseconds: 500), Duration sizeDuration = const Duration(milliseconds: 500), Curve fadeInCurve = Curves.easeInOut, Curve fadeOutCurve = Curves.easeInOut, Curve sizeCurve = Curves.easeInOut, Alignment alignment = Alignment.center})
- Use this constructor when you want to show/hide the child, by doing a vertical size/fade. To that end, instead of changing the child, simply change show. Note this widget will try to have its width as big as possible, so put it in a parent with limited width constraints.
Properties
- alignment → Alignment
-
final
- child → Widget?
-
final
- fadeDuration → Duration
-
final
- fadeInCurve → Curve
-
final
- fadeOutCurve → Curve
-
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
- show → bool
-
final
- sizeCurve → Curve
-
final
- sizeDuration → Duration
-
final
Methods
-
build(
BuildContext context) → Widget -
Describes the part of the user interface represented by this widget.
override
-
createElement(
) → StatelessElement -
Creates a StatelessElement to manage this widget's location in the tree.
inherited
-
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