Flutter FloatingActionButton.extended()
For FloatingActionButton button, you have a child, where you generally provide icon, image or text.
But using FloatingActionButton.extended(), you can provide icon and label. The FloatingActionButton.extended() with an icon and label looks as shown below.
In this tutorial, we will learn how to use FloatingActionButton.extended() with an example application.
Example: FloatingActionButton.extened() with an icon and label
In this example, we will create a basic Flutter Application, and place a FloatingActionButton.extended() in a Scaffold as shown in the following main.dart file.
main.dart
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
home: MyApp(),
));
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: new Text("Flutter Tutorial - googleflutter.com"),
),
floatingActionButton: FloatingActionButton.extended(
onPressed: (){},
icon: Icon(Icons.refresh),
label: Text('Refresh'),
),
);
}
}
Screenshot
Summary
In this Flutter Tutorial, we learned how to use FloatingActionButton.extended() to display an icon along with a label for a Floating Action Button.