flutter Remove background color from Floating Action Button

Question

I am using an image as a child of the floating action button on flutter. I don't need any background color. and also I need to make the image size bigger. how can I do this? help, please.

Answer 1

Simply do this:

FloatingActionButton(
    backgroundColor: Colors.transparent,
)

Answer 2

Colors.transparent

Will remove the color from any widget which accepts color parameter. Please use it in your FloatingActionButton like below:

           FloatingActionButton(
              elevation: 0.0,
              child: new Icon(Icons.check),
              backgroundColor: Colors.transparent,
              onPressed: (){}
            )

Answer 3

Edit: My answer is just a workaround. backgroundColor: Colors.transparent goes well.

I think for your case, you can also try workaround like this,

floatingActionButton: GestureDetector(
        onTap: () {
          // Do Something
        },
        child: Container(
          decoration: BoxDecoration(
            image: DecorationImage(
                image: NetworkImage("https://www.dartpad.dev/dart-192.png")),
            borderRadius: BorderRadius.circular(0.50),
          ),
          width: 50.0,
          height: 50.0,
        ),
      ),

Play with height and width values for desired result. You can also add boxShadow to Container to look like the actual FAB.

Refer: https://api.flutter.dev/flutter/painting/BoxDecoration-class.html
and also for including your image from asset, refer https://api.flutter.dev/flutter/painting/DecorationImage-class.html

Hope that suits your case!