Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Floating action button with text label. Flutter

Tags:

flutter

dart

I need floating action button like this:

image.

Are there standard tools for implementation? I watched both the standard version of the button and the extended one, but did not find anything

like image 208
Maks K. Maks Avatar asked Oct 06 '18 16:10

Maks K. Maks


People also ask

How do you add text to floating action button on Flutter?

Add a Text("YourText") widget in child of FloatingActionButton. Then it will work.

How do I add text and button in Flutter?

The simplest way to create a button with icon and text in Flutter is to use the new Material button called ElevatedButton with an icon constructor. ElevatedButton. icon() gives you the ability to add the icon and label parameter to the button. The ElevatedButton was introduced with the release of Flutter v1.


2 Answers

You don't need to use an external library because it will grow the size of your bundle.

This is the code:

FloatingActionButton.extended(
    onPressed: () {
      // Add your onPressed code here!
    },
    label: Text('Approve'),
    icon: Icon(Icons.thumb_up),
    backgroundColor: Colors.pink,
) 
like image 79
AlexPad Avatar answered Oct 25 '22 00:10

AlexPad


You can use this flutter package flutter_fab Or you can refer from this article Create Animated FAB in flutter.

like image 43
yashthakkar1173 Avatar answered Oct 25 '22 01:10

yashthakkar1173