Transparent background for children

[NaarGes]

Hi, here is my code so far:

floatingActionButton: SpeedDial(
                  openCloseDial: isDialOpen,
                  icon: FontAwesomeIcons.plus,
                  activeIcon: FontAwesomeIcons.xmark,
                  spacing: 30,
                  mini: false,
                  childPadding: const EdgeInsets.all(4.0),
                  childMargin: const EdgeInsets.all(8.0),
                  spaceBetweenChildren: 4,
                  direction: SpeedDialDirection.up,
                  renderOverlay: true,
                  overlayColor: LightPalette.overlayColor,
                  overlayOpacity: 0.9,
                  useRotationAnimation: true,
                  onOpen: () => debugPrint('OPENING DIAL'),
                  onClose: () => debugPrint('DIAL CLOSED'),
                  foregroundColor: Theme.of(context).colorScheme.background,
                  backgroundColor: Theme.of(context).colorScheme.primary,
                  elevation: 8,
                  children: [
                    SpeedDialChild(
                      label: 'Create Event',
                      child: const FaIcon(FontAwesomeIcons.solidCalendarCheck),
                      backgroundColor: Colors.transparent,
                      foregroundColor: Colors.white,
                      labelBackgroundColor: Colors.transparent,
                      labelStyle: Theme.of(context).textTheme.titleSmall?.copyWith(color: Colors.white),
                    ),
                    SpeedDialChild(
                      label: 'Create Meeting',
                      child: const FaIcon(FontAwesomeIcons.briefcase),
                      backgroundColor: Colors.transparent,
                      foregroundColor: Colors.white,
                      labelBackgroundColor: Colors.transparent,
                      labelStyle: Theme.of(context).textTheme.titleSmall?.copyWith(color: Colors.white),
                    ),
                  ],
                ),

and this is how the result I'm getting looks like:

Is there any way that I can remove the shadow from labels and icons?

[prateekmedia]

We do have labelShadow I think.

[NaarGes]

Thanks. The black shadow under icons aren't removable?

[prateekmedia]

Currently no, but you can always create a Pull request with that childShadow customizable.

[Strafe0]

Try this

SpeedDialChild(
  elevation: 0.0,
  labelWidget: Text('Create Event'),
  child: const FaIcon(FontAwesomeIcons.solidCalendarCheck),
  backgroundColor: Colors.transparent,
  foregroundColor: Colors.white,
  labelBackgroundColor: Colors.transparent,
  labelStyle: Theme.of(context).textTheme.titleSmall?.copyWith(color: Colors.white),
),