How to dismiss item w/ Dismissible widget by tap in AnimatedBuilder?

Question

I'n new in flutter. I have a playground app and I'm trying to dismiss the item from the list. I found this example without dismiss functionality. It works fine by swiping in a specific direction, but what I need is dismissing it by taping on a number on the card and remove swiping functionality at all. Thanks in advance.

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class ColorCards {
  int id;
  Color color;

  ColorCards({this.id, this.color});
}

class _MyHomePageState extends State<MyHomePage> {
  PageController controller;
  int currentPage = 0;
  List<ColorCards> cards = [
    ColorCards(id: 1, color: Colors.green),
    ColorCards(id: 2, color: Colors.yellow),
    ColorCards(id: 3, color: Colors.green),
    ColorCards(id: 4, color: Colors.yellow),
    ColorCards(id: 5, color: Colors.green),
  ];

  @override
  initState() {
    super.initState();
    controller = PageController(
      initialPage: currentPage,
      keepPage: false,
      viewportFraction: 0.85,
    );
  }

  @override
  dispose() {
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    //Scaffold
    return Scaffold(
      appBar: AppBar(
        title: Text('Playground App'),
        backgroundColor: Colors.grey,
      ),
      body: Center(
        child: Container(
          child: PageView.builder(
              onPageChanged: (value) {
                setState(() {
                  currentPage = value;
                });
              },
              itemCount: cards.length,
              controller: controller,
              itemBuilder: (context, index) => builder(index)),
        ),
      ),
    );
  }

  builder(int index) {
    return AnimatedBuilder(
      animation: controller,
      builder: (context, child) {
        double value = 1.0;
        if (controller.position.haveDimensions) {
          value = controller.page - index;
          value = (1 - (value.abs() * .1)).clamp(0.0, 1.0);
        }
        return Center(
          child: Dismissible(
            key: Key(cards[index].id.toString()),
            direction: DismissDirection.up,
            onDismissed: (direction) {
              cards.removeAt(index);
              setState(() {
                controller.animateToPage(index,
                    duration: Duration(milliseconds: 1), curve: Curves.bounceIn);
              });
            },
            child: SizedBox(
              height: Curves.easeOut.transform(value) * 300,
              width: Curves.easeOut.transform(value) * 350,
              child: child,
            ),
          ),
        );
      },
      child: Container(
          child: Center(
              child: GestureDetector(
            onTap: () {
              print('Dismiss this item');
            },
            child: Text(
              cards[index].id.toString(),
              style: TextStyle(
                  fontSize: 60.0, color: Colors.white, fontWeight: FontWeight.bold),
            ),
          )),
          margin: const EdgeInsets.all(8.0),
          color: cards[index].color),
    );
  }
}

Answer 1

For those who got in same situation, I've found the workaround. First, its better to use AnimatedList instead of PageView . Detailed information about AnimatedList you can find here and here . Then you have to specify Dismissible in ItemBuilder class. And that's it, hope it