CODEWITHSUNDEEP
flutter
Nicola Valentini
Nicola Valentini

Reputation: 3

How to work with a list of floatingaction button?

I created a simple animation to see 3 different floating action buttons, they are generate by a list, now I want them to do different stuffs, but how can I choose what button have to do what?

Now I tried to get the first fab do Navigator.push to TempImg(), but instead, all the buttons go to the TempImg(), I want the first button to the that, the second to do some other stuff etc...

floatingActionButton: new Column(
  mainAxisSize: MainAxisSize.min,
  children: new List.generate(icons.length, (int index) {
    Widget child = new Container(
        height: 70.0,
        width: 56.0,
        alignment: FractionalOffset.topCenter,
        child: new ScaleTransition(
          scale: new CurvedAnimation(
            parent: _controller,
            curve: new Interval(
                0.0, 1.0 - index / icons.length / 2.0,
                curve: Curves.easeOut),
          ),
          child: new FloatingActionButton(
              child: new Icon(icons[index]),
              onPressed: () {
                Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => TempImg(),
                    ));
              }),
        ));
    return child;
  }).toList()
    ..add(
      new FloatingActionButton(
          child: new AnimatedBuilder(
            animation: _controller,
            builder: (BuildContext context, Widget child) {
              return new Transform(
                transform: new Matrix4.rotationZ(
                    _controller.value * 0.5 * math.pi),
                alignment: FractionalOffset.center,
                child: new Icon(_controller.isDismissed
                    ? Icons.add
                    : Icons.close),
              );
            },
          ),
          onPressed: () {
            if (_controller.isDismissed) {
              _controller.forward();
            } else {
              _controller.reverse();
            }
          }),
    ))

Upvotes: 0

Views: 36

Answers (1)

Dhaval Patel
Dhaval Patel

Reputation: 409

You can use item wise click on pressed event like below code:

FloatingActionButton(
  child: new Icon(icons[index]),
  onPressed: () {
    if(index == 1) {
      Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) => TempImg(),
      ));
    } else if(index == 2) {

    } else if(index == 3) {

    }
  } /* enter code here */

Upvotes: 1

Related Questions