ZdsButton class
An ElevatedButton with pre-applied Zds styling.
There are four variants:
- ZdsButton, which returns a filled button.
- ZdsButton.outlined, which returns a non-filled button with a border.
- ZdsButton.text, which returns the equivalent of a TextButton with Zds styling.
- ZdsButton.muted, which returns a non-filled button with a border and muted grey colors. These variants can be thought of being the primary, secondary, tertiary, and quarternary buttons respectively.
If isDangerButton is true, it will make the button red, used for destructive actions (deleting, removing, etc...). isDangerButton can only be set to true if the variant used is either ZdsButton or ZdsButton.outlined.
If onTap and onLongPress are null, the button will be disabled and change its appareance to a disabled state.
The other parameters act the same way as the ones in ElevatedButton.
Constructors
-
ZdsButton({required Widget child, Key? key, VoidCallback? onTap, bool isDangerButton = false, bool autofocus = false, Clip clipBehavior = Clip.none, FocusNode? focusNode, VoidCallback? onLongPress, ValueChanged<
bool> ? onHover, ValueChanged<bool> ? onFocusChange, EdgeInsets? textPadding, String? semanticLabel}) -
Creates a filled ZdsButton. (Primary button). Use ZdsButton.filled until old buttons are fully removed.
Currently, this acts as a backward compatible constructor for the old buttons.
const
-
ZdsButton.filled({required Widget child, Key? key, VoidCallback? onTap, bool isDangerButton = false, bool autofocus = false, Clip clipBehavior = Clip.none, FocusNode? focusNode, VoidCallback? onLongPress, ValueChanged<
bool> ? onHover, ValueChanged<bool> ? onFocusChange, EdgeInsets? textPadding, Color? customColor, String? semanticLabel}) -
Creates a filled ZdsButton. (Primary button). Will be removed when old button versions are fully removed.
Will be replaced with ZdsButton constructor.
const
-
ZdsButton.muted({required Widget child, Key? key, VoidCallback? onTap, bool autofocus = false, Clip clipBehavior = Clip.none, FocusNode? focusNode, VoidCallback? onLongPress, ValueChanged<
bool> ? onHover, ValueChanged<bool> ? onFocusChange, EdgeInsets? textPadding, Color? customColor, String? semanticLabel}) -
Constructs a muted ZdsButton. (Quaternary button)
const
-
ZdsButton.outlined({required Widget child, Key? key, VoidCallback? onTap, bool isDangerButton = false, bool autofocus = false, Clip clipBehavior = Clip.none, FocusNode? focusNode, VoidCallback? onLongPress, ValueChanged<
bool> ? onHover, ValueChanged<bool> ? onFocusChange, EdgeInsets? textPadding, Color? customColor, String? semanticLabel}) -
Creates an outlined ZdsButton. (Secondary button)
const
-
ZdsButton.text({required Widget child, Key? key, bool isOnDarkBackground = false, VoidCallback? onTap, bool autofocus = false, Clip clipBehavior = Clip.none, FocusNode? focusNode, VoidCallback? onLongPress, ValueChanged<
bool> ? onHover, ValueChanged<bool> ? onFocusChange, EdgeInsets? textPadding, Color? customColor, String? semanticLabel}) -
Creates a ZdsButton that behaves as a TextButton. (Tertiary button)
const
Properties
- autofocus → bool
-
Whether to autofocus on this button.
final
- child → Widget
-
The Widget that will go inside the button, typically a Text with style TextTheme.titleMedium.
final
- clipBehavior → Clip
-
Whether to clip the contents of this button.
final
- customColor → Color?
-
Custom color override.
final
- focusNode → FocusNode?
-
FocusNode for the button.
final
- hashCode → int
-
The hash code for this object.
no setterinherited
- isDangerButton → bool
-
Whether to use danger/red colors. If true, the variant used must be either ZdsButton or ZdsButton.outlined.
final
- isOnDarkBackground → bool
-
Whether to use white text as the button is on a dark background. Can only be used with ZdsButton.text
final
- key → Key?
-
Controls how one widget replaces another widget in the tree.
finalinherited
-
onFocusChange
→ ValueChanged<
bool> ? -
Called when the focus changes, with true if this widget's node gains focus, and false if it loses focus.
final
-
onHover
→ ValueChanged<
bool> ? -
Called whenever a pointer enters or exits the button response area, with true if a pointer has entered this
button and false if it has exited it.
final
- onLongPress → VoidCallback?
-
If this and onTap are null, the button will be disabled.
final
- onTap → VoidCallback?
-
If this and onLongPress are null, the button will be disabled.
final
- runtimeType → Type
-
A representation of the runtime type of the object.
no setterinherited
- semanticLabel → String?
-
This is for talkback text on child.
final
- textPadding → EdgeInsets?
-
padding for the text within the button
final
Methods
-
build(
BuildContext context) → Widget -
Describes the part of the user interface represented by this widget.
override
-
createElement(
) → StatelessElement -
Creates a StatelessElement to manage this widget's location in the tree.
inherited
-
debugDescribeChildren(
) → List< DiagnosticsNode> -
Returns a list of
DiagnosticsNode
objects describing this node's children.inherited -
debugFillProperties(
DiagnosticPropertiesBuilder properties) → void -
Add additional properties associated with the node.
override
-
noSuchMethod(
Invocation invocation) → dynamic -
Invoked when a nonexistent method or property is accessed.
inherited
-
toDiagnosticsNode(
{String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode -
Returns a debug representation of the object that is used by debugging
tools and by DiagnosticsNode.toStringDeep.
inherited
-
toString(
{DiagnosticLevel minLevel = DiagnosticLevel.info}) → String -
A string representation of this object.
inherited
-
toStringDeep(
{String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String -
Returns a string representation of this node and its descendants.
inherited
-
toStringShallow(
{String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String -
Returns a one-line detailed description of the object.
inherited
-
toStringShort(
) → String -
A short, textual description of this widget.
inherited
Operators
-
operator ==(
Object other) → bool -
The equality operator.
inherited
Static Methods
-
getStyle(
{required ZdsButtonVariant variant, required ZetaColors zetaColors, required TextTheme textTheme, EdgeInsetsGeometry? textPadding, bool isDangerButton = false, bool isOnDarkBackground = false, Color? customColor}) → ButtonStyle - Returns a ButtonStyle based on the provided parameters.