Как я могу использовать FloatActionButton во всем приложении

Question

У меня есть этот код и я запускаю его на одной из моих страниц, но я хочу использовать эту часть кода во всем приложении, но я не знаю как? Я не хочу использовать Scaffold, потому что когда я использую его на других страницах, это создает проблему из-за запуска 2 скаффолдов, плз, помогите мне, как я могу использовать этот код во всем моем приложении?

floatingActionButton: Container(
        height: 100.0,
        width: 100.0,
        decoration: BoxDecoration(
          borderRadius: new BorderRadius.all(Radius.circular(60.0)),
          boxShadow: <BoxShadow>[
            BoxShadow(
                color: Colors.black54,
                blurRadius: 10.0,
                offset: Offset(0.0, 0.75))
          ],
          color: Colors.white,
        ),

        child: FittedBox(
          child: FloatingActionButton(
              backgroundColor: Color(0xffffcd05),
              child: Padding(
                padding: const EdgeInsets.all(4.0),
                child: Image.asset(
                  "images/logo-express.png",
                  height: 200.0,
                  width: 300.0,
                ),
              ),
              onPressed: () {
                var Router = new MaterialPageRoute(builder: (BuildContext) {
                  return new FirstPage();
                });
                Navigator.of(context).push(Router);
              }),
        ),
//shape:
//        icon: new Icon(Icons.add,
//        color: Color(0xffd4351c),),

// shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(100.0),)),
// child: Image.asset("images/logo-express.png",height:200.0,width: 400.0,),
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      bottomNavigationBar: BottomAppBar(
//clipBehavior:Clip.antiAlias,
          color: Color(0xffd4351c),
//shape: CircularNotchedRectangle(),
          child: new Row(
            mainAxisSize: MainAxisSize.min,
//mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
//SizedBox(width: double.infinity, height: 70.0,),
              Material(
                child: SizedBox(
// width: double.infinity,
                  height: 60.0,
                ),
                color: Color(0xffd4351c),
              ),
// SizedBox(),
              FlatButton.icon(
                onPressed: () {
                  Navigator.push(context, SlideRightRoute(page: ContactUs()));
                },
                icon: Icon(
                  Icons.phone_in_talk,
                  color: Colors.white,
                ),
                label: new Text(
                  'Contact Us',
                  style: TextStyle(color: Colors.white),
                ),
                padding: EdgeInsets.fromLTRB(10.0, 0, 0, 0),
              ),

              FlatButton.icon(
                onPressed: () {
                  Navigator.push(context, SlideLeftRoute(page: AboutUs()));
                },
                icon: Icon(
                  Icons.person,
                  color: Colors.white,
                ),
                label: new Text(
                  'About US',
                  style: TextStyle(color: Colors.white),
                ),
                padding: EdgeInsets.fromLTRB(200, 0, 0.0, 0),
              ),
            ],
          )),
    );
  }
}

class SlideRightRoute extends PageRouteBuilder {
  final Widget page;

  SlideRightRoute({this.page})
      : super(
          pageBuilder: (
            BuildContext context,
            Animation<double> animation,
            Animation<double> secondaryAnimation,
          ) =>
              page,
          transitionsBuilder: (
            BuildContext context,
            Animation<double> animation,
            Animation<double> secondaryAnimation,
            Widget child,
          ) =>
              SlideTransition(
            position: Tween<Offset>(
              begin: const Offset(-1, 0),
              end: Offset.zero,
            ).animate(animation),
            child: child,
          ),
        );
}

class SlideLeftRoute extends PageRouteBuilder {
  final Widget page;

  SlideLeftRoute({this.page})
      : super(
          pageBuilder: (
            BuildContext context,
            Animation<double> animation,
            Animation<double> secondaryAnimation,
          ) =>
              page,
          transitionsBuilder: (
            BuildContext context,
            Animation<double> animation,
            Animation<double> secondaryAnimation,
            Widget child,
          ) =>
              SlideTransition(
            position: Tween<Offset>(
              begin: const Offset(1, 0),
              end: Offset.zero,
            ).animate(animation),
            child: child,
          ),
        );
}

Answer 1

Сделайте его своим виджетом, например,

my_fab.dart:

import 'package:flutter/material.dart';

class MyFloatingActionButton extends StatelessWidget {
  final VoidCallback onPressed;

  const MyFloatingActionButton({Key key, this.onPressed}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 100.0,
      width: 100.0,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(60.0),
        boxShadow: <BoxShadow>[
          BoxShadow(
            color: Colors.black54,
            blurRadius: 10.0,
            offset: Offset(0.0, 0.75),
          )
        ],
        color: Colors.white,
      ),
      child: FittedBox(
        child: FloatingActionButton(
          backgroundColor: Color(0xffffcd05),
          child: Padding(
            padding: const EdgeInsets.all(4.0),
            child: Image.asset(
              "images/logo-express.png",
              height: 200.0,
              width: 300.0,
            ),
          ),
          onPressed: onPressed,
        ),
      ),
    );
  }
}

, затем используйте его как

floatingActionButton: MyFloatingActionButton(
  onPressed: () {
    var Router = new MaterialPageRoute(builder: (BuildContext) {
      return new FirstPage();
    });
    Navigator.of(context).push(Router);
  },
),