Create Floating Action Button Using Flutter Android

Posted By Bajarangi soft , Posted On 10-10-2020

Floating action button is a circular rounded button over application activity screen at bottom right side. There is always a Icon present inside the Floating action button which represents a certain task. To add the icon we would use flutter’s Material style Icon library which has thousands of free icons inside it. There is no need to set alignment of Floating action button over the screen it is automatically aligned for all Views.

Create Floating Action Button Using Flutter Android

Floating Action Button
Complete Code For Floating Action Button In Flutter
main.dart

import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  void calling() {
    print('Floating Action Button Clicked');
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
        home: Scaffold(
          appBar: AppBar(
            backgroundColor: Colors.red,
              title: Text('Floating Action Button')
          ),
          body: Center(
              child: Text('Floating Action Button', style: TextStyle(fontSize: 22),)
          ),
          floatingActionButton: FloatingActionButton(
            child: Icon(Icons.add),
            onPressed: () => calling(),
            backgroundColor: Colors.red,
          ),
        )
    );
  }
}