Skip to main content
The Stac Floating Action Button allows you to build a Flutter floating action button widget using JSON. To know more about the floating action button widget in Flutter, refer to the official documentation.

​
Properties

PropertyTypeDescription
onPressedStacActionThe callback that is called when the button is tapped.
textStyleStacTextStyleThe text style to apply to the button’s label.
buttonTypeStacFloatingActionButtonTypeThe type of the floating action button. Defaults to FloatingActionButtonType.small.
autofocusboolWhether the button should be focused when the page is loaded. Defaults to false.
iconStacWidgetThe icon to display inside the button.
backgroundColorStacColorThe color to paint the button.
foregroundColorStacColorThe color to paint the button’s icon.
focusColorStacColorThe color to paint the button when it has the input focus.
hoverColorStacColorThe color to paint the button when a pointer is hovering over it.
splashColorStacColorThe color to paint the splash effect when the button is pressed.
extendedTextStyleStacTextStyleThe text style to apply to the extended button’s label.
elevationdoubleThe elevation of the button.
focusElevationdoubleThe elevation of the button when it has the input focus.
hoverElevationdoubleThe elevation of the button when a pointer is hovering over it.
disabledElevationdoubleThe elevation of the button when it is disabled.
highlightElevationdoubleThe elevation of the button when it is pressed.
extendedIconLabelSpacingdoubleThe spacing between the icon and label in the extended button.
enableFeedbackboolWhether to provide acoustic and/or haptic feedback.
tooltipStringThe text to display when the user long-presses the button.
heroTagStringThe tag to use for the hero animation.
childStacWidgetThe widget to display inside the button.

​
Example

StacFloatingActionButton(
  onPressed: StacNoneAction(),
  textStyle: StacTextStyle(fontSize: 16, color: StacColors.white),
  buttonType: StacFloatingActionButtonType.small,
  autofocus: false,
  icon: StacIcon(icon: 'add'),
  backgroundColor: StacColors.amber,
  foregroundColor: StacColors.black,
  focusColor: '#FF5722',
  hoverColor: '#FF9800',
  splashColor: '#FFEB3B',
  extendedTextStyle: StacTextStyle(fontSize: 14, color: StacColors.white),
  elevation: 6.0,
  focusElevation: 8.0,
  hoverElevation: 10.0,
  disabledElevation: 2.0,
  highlightElevation: 12.0,
  extendedIconLabelSpacing: 8.0,
  enableFeedback: true,
  tooltip: 'Add Item',
  heroTag: 'fab1',
  child: StacText(data: 'Add'),
)