CODEWITHSUNDEEP
flutterdartanimationflutter-animation
Myzel394
Myzel394

Reputation: 1317

How to create different in-and out-durations for `AnimatedWidget`s?

How can you create different animation durations for AnimatedWidgets? I would like to have an in-duration of 5 seconds and an out-duration of 1 second.

Example:

AnimatedContainer(
    duration: const Duration(seconds: 5), // How to create different durations?
)

Does something like this exist?

AnimatedContainer(
    inDuration: const Duration(seconds: 5),
    outDuration: const Duration(seconds: 1),
)

Upvotes: 0

Views: 28

Answers (1)

esentis
esentis

Reputation: 4666

You can try using the same condition you use to animate the AnimatedContainer, let's say it's called shouldAnimate :

duration: Duration(seconds:shouldAnimate ? 5 : 1)

Minimal example code :

  bool shouldAnimate = true;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: GestureDetector(
            onTap: () {
              setState(() {
                shouldAnimate = !shouldAnimate;
              });
            },
            child: AnimatedContainer(
              width: shouldAnimate ? 150 : 250,
              height: shouldAnimate ? 150 : 250,
              color: Colors.red,
              duration: Duration(milliseconds: shouldAnimate ? 750 : 350),
            )),
      ),
    );
  }

Upvotes: 1

Related Questions