How to create a floating button for attachments in flutter

Question

How do create a floating button and animate different options on its button press in Flutter? I am trying to make something like below:

When I try to add multiple floating buttons, I get 'argument for the name floating button action has already been specified' error

    class MyBills extends StatelessWidget {
  MyBills({Key key}) : super(key: key);

  //@override
  //MyBillsPageState createState() => MyBillsPageState();
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: ListView.builder(
        itemCount: 20,
        itemBuilder: (context, index) {
          return new Container(height: 100, child: BillItem());
        }
      ),
      floatingActionButton: new FloatingActionButton(
        child: new Icon(Icons.add),
        heroTag: 1,
        onPressed: _addAttachment
      ),
      floatingActionButton: new FloatingActionButton(
        child: new Icon(Icons.camera),
        heroTag: 2,
        onPressed: _cameraAttachment
      ),
    );
  }

or animate floating options like this

Is a fab_dialer what you're after? Here's also a version which doesn't use a package. — soupjake
– soupjake, Commented Jan 28, 2019 at 9:10

CopsOnRoad · Accepted Answer · 2019-01-28 05:04:54Z

3

Give every FloatingActionButton a unique heroTag tag, and you should be good to go.

floatingActionButton: FloatingActionButton(
  heroTag: 0, // you can use any object here
),

Your solution:

@override
Widget build(BuildContext context) {
  return new Scaffold(
    body: Stack(
      alignment: Alignment.bottomRight,
      children: <Widget>[
        ListView.builder(
          itemCount: 20,
            itemBuilder: (context, index) {
              return new Container(height: 100, child: BillItem());
            }
        ),
        Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            new FloatingActionButton(child: new Icon(Icons.add), heroTag: 1, onPressed: _addAttachment),
            new FloatingActionButton(child: new Icon(Icons.camera), heroTag: 2, onPressed: _cameraAttachment),
          ],
        ),
      ],
    ),
  );
}

edited Jan 28, 2019 at 5:04

answered Jan 28, 2019 at 4:43

CopsOnRoad

271k97 gold badges702 silver badges471 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Deepak Thakur Over a year ago

I gave different heroTag , but I still get the same error.

Deepak Thakur Over a year ago

I made an edit in my question. See where am I trying to add floating point

Deepak Thakur Over a year ago

that worked.. but how do I animate and display different options? Other floating buttons should be hidden on initial load of the view

CopsOnRoad Over a year ago

@DeepakThakur Kindly ask that as a separate question. And don't forget to upvote and accept this answer. Thank you :)

Deepak Thakur Over a year ago

But the inital part of my question was to animate and display floating buttons only

|

Collectives™ on Stack Overflow

How to create a floating button for attachments in flutter

1 Answer 1

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related