extendedAnimation method

Animation<double> extendedAnimation (
  1. BuildContext context
)

Returns the animation that controls the NavigationRail.extended state.

This can be used to synchronize animations in the leading or trailing widget, such as an animated menu or a FloatingActionButton animation.

This example shows how to use this animation to create a FloatingActionButton that animates itself between the normal and extended states of the NavigationRail.

An instance of ExtendableFab would be created for NavigationRail.leading.

import 'dart:ui';

@override
Widget build(BuildContext context) {
  final Animation<double> animation = NavigationRail.extendedAnimation(context);
  return AnimatedBuilder(
    animation: animation,
    builder: (BuildContext context, Widget child) {
      // The extended fab has a shorter height than the regular fab.
      return Container(
        height: 56,
        padding: EdgeInsets.symmetric(
          vertical: lerpDouble(0, 6, animation.value),
        ),
        child: animation.value == 0
          ? FloatingActionButton(
              child: Icon(Icons.add),
              onPressed: () {},
            )
          : Align(
              alignment: AlignmentDirectional.centerStart,
              widthFactor: animation.value,
              child: Padding(
                padding: const EdgeInsetsDirectional.only(start: 8),
                child: FloatingActionButton.extended(
                  icon: Icon(Icons.add),
                  label: Text('CREATE'),
                  onPressed: () {},
                ),
              ),
            ),
      );
    },
  );
}

Implementation

static Animation<double> extendedAnimation(BuildContext context) {
  return context.dependOnInheritedWidgetOfExactType<_ExtendedNavigationRailAnimation>().animation;
}