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

​
Properties

PropertyTypeDescription
iconSizedoubleThe size of the icon inside the button.
paddingStacEdgeInsetsThe padding inside the button.
alignmentStacAlignmentHow the icon should be aligned within the button.
splashRadiusdoubleThe radius of the splash effect.
colorStacColorThe color to paint the 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.
highlightColorStacColorThe color to paint the button when it is pressed.
splashColorStacColorThe color to paint the splash effect when the button is pressed.
disabledColorStacColorThe color to paint the icon when the button is disabled.
onPressedStacActionThe callback that is called when the button is tapped.
autofocusboolWhether the button should be focused when the page is loaded. Defaults to false.
tooltipStringThe text to display when the user long-presses the button.
enableFeedbackboolWhether to provide acoustic and/or haptic feedback.
constraintsStacBoxConstraintsThe constraints for the button.
styleStacButtonStyleThe style to apply to the button.
isSelectedboolWhether the button is selected.
selectedIconStacWidgetThe icon to display when the button is selected.
iconStacWidgetThe icon to display inside the button.

​
Example

StacIconButton(
  iconSize: 24.0,
  padding: StacEdgeInsets(left: 8.0, top: 8.0, right: 8.0, bottom: 8.0),
  alignment: StacAlignment.center,
  splashRadius: 20.0,
  color: StacColors.black,
  focusColor: StacColors.amber,
  hoverColor: '#FF9800',
  highlightColor: '#FF5722',
  splashColor: '#FFEB3B',
  disabledColor: '#BDBDBD',
  onPressed: StacNoneAction(),
  autofocus: false,
  tooltip: 'Add Item',
  enableFeedback: true,
  constraints: StacBoxConstraints(minWidth: 48.0, minHeight: 48.0),
  style: StacButtonStyle(backgroundColor: StacColors.amber, foregroundColor: StacColors.black),
  isSelected: false,
  selectedIcon: StacIcon(icon: 'check'),
  icon: StacIcon(icon: 'add'),
)