CODEWITHSUNDEEP
flutteranimationflutter-animation
JakesMD
JakesMD

Reputation: 2206

Flutter: AnimatedList animation curve

How can I add a curve (e.g. Curves.easeIn) to the animation of my AnimatedList?

AnimatedList(
  key: _animList,
  initialItemCount: _myList.length,
  itemBuilder: (context, index, animation) {
    return SlideTransition(
      position: animation.drive(Tween(begin: Offset(1, 0), end: Offset(0, 0))), <-- curve?
      child: Container(color: Colors.red, height: 100, width: 100)
    );
  }
)

Upvotes: 0

Views: 601

Answers (1)

Josteve Adekanbi
Josteve Adekanbi

Reputation: 12713

You should invoke chain method on the Tween. The chain method takes a CurveTween and the CurveTween takes a curve

Try this

    AnimatedList(
        key: _animList,
        initialItemCount: _myList.length,
        itemBuilder: (context, index, animation) {
          return SlideTransition(
              position: animation.drive(
                  Tween(begin: Offset(1, 0), end: Offset(0, 0))
                      .chain(CurveTween(curve: Curves.bounceIn))),
              child: Container(color: Colors.red, height: 100, width: 100));
        });

Upvotes: 3

Related Questions