Skip to content

Instantly share code, notes, and snippets.

@tchafack
Created November 9, 2019 13:34
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save tchafack/39a9c24ad1cd1ad376c34bc3aea2ef57 to your computer and use it in GitHub Desktop.
Save tchafack/39a9c24ad1cd1ad376c34bc3aea2ef57 to your computer and use it in GitHub Desktop.
[Flutter, Dart] Multiple FloatingActionButton
import 'package:flutter/material.dart';
class MultiFloatingButton extends StatefulWidget {
@override
_MultiFloatingButtonState createState() => _MultiFloatingButtonState();
}
class _MultiFloatingButtonState extends State<MultiFloatingButton> {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
title: Text('Float'),
centerTitle: true,
),
body: Container(
),
floatingActionButton: Stack(
children: <Widget>[
Positioned(
bottom: 80.0,
right: 10.0,
child: FloatingActionButton(
heroTag: 'save',
onPressed: () {
// What you want to do
},
child: Icon(Icons.save),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(5.0),
),
),
),
Positioned(
bottom: 10.0,
right: 10.0,
child: FloatingActionButton(
heroTag: 'close',
onPressed: () {},
child: Icon(Icons.close),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(5.0),
),
),
),
],
),
);
}
}
@uc-apa
Copy link

uc-apa commented Mar 15, 2020

Thanks. it worked for me.

@tchafack
Copy link
Author

Happy to help :)

@Don-diegue
Copy link

thank you so much

@xgqfrms
Copy link

xgqfrms commented Jun 20, 2020

awesome ✅

@RahulDole
Copy link

Thanks a ton for this!

@HyperL0gL0g
Copy link

HyperL0gL0g commented Nov 20, 2020

This worked for me .

return MaterialApp(
      home:
      Scaffold(
      backgroundColor: Colors.grey,
      appBar: AppBar(
        title: Text('$i'),
        centerTitle: true,
        backgroundColor: Colors.green,
      ),
      body:   Stack(
    children: <Widget>[
    Align(
    alignment: Alignment.bottomLeft,
    child: FloatingActionButton(
      onPressed: (){
      //todo
      },
      child: Icon(Icons.remove),  ),
    ),
    Align(
    alignment: Alignment.bottomRight,
    child: FloatingActionButton(
      child: Icon(Icons.add),
      onPressed: (){
       //todo
      },  ), ),
      Align(
        alignment: Alignment.center ,
        child: FloatingActionButton(
          child: Text('Reset'),
          onPressed: (){
        //todo
          },
        ),
      ),
    ],
    ),
      ),
    );

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment