IconButton¶

IconButton is a class inherited from BaseButton, compared to its ancestor, IconButton provides basic infographic support on top of a button.

Usage¶

IconButton can be created by calling Lydie.Components.Controls.IconButton:

local iconState = Fusion.Value(Icons.album)

Lydie.Components.Controls.IconButton {
    Size = UDim2.fromOffset(200, 40),
    Icon = iconState, 
Icon property accepts both a string of a state-wrapped string. The string should be either the asset URL or the ID of the image. Lydie has provided a list of icons from Lucide Icons for basic usage. Spritesheet-based icons are not supported at the moment.


    OnClickDown = function(),
        iconState:set(Icons.archive)
    end,

    OnClick = function() 
OnClick function will be invoked when InputEnded is fired and its input type matches either Enum.UserInputType.MouseButton1 or Enum.UserInputType.Touch. Due to how input events work in Roblox, input will sink no matter what. You should ensure the user is clicking the button before doing any further processing. See BaseButton.luau:69.

        iconState:set(Icons.album)
    end,
}

Properties¶

Note

While being inherited from BaseButton, TextButton does not allow using the Fusion.Children to insert children as it will be used to insert the icon instead.

Name	Description	Default
`BackgroundColor`	Background color of the button	`Scheme.GetAnimated(Scheme.Color.Text.Primary)`
`BackgroundOpacity`	Background opacity of the button	`0.85`
`ForegroundColor`	Foreground color of the button, used to color the icon	`BackgroundColor` or `Scheme.GetAnimated(Scheme.Color.Text.Primary)`
`Icon`	The asset URL/ID of the icon.	`nil`
`RoundedValue`	The radius of the 4 corners	`Constants.RoundedValues[8]`
`LayoutOrder`	The layout order of the button, used in a `UIListLayout`/`UIGridLayout`	`0`
`ZIndex`	The Z index of the button, used to show hierarchy of the button.	`NaN`
`AnchorPoint`	The location of the anchor point, defined in `Vector2`	`Vector2.new(0, 0)`
`Position`	The relative position of the button	`UDim2.fromScale(0, 0)`
`Size`	The size of the button	`UDim2.fromOffset(200, 50)`

Functions¶

Name	Description	Required
`OnClickDown: () -> ()`	A function invoked when `MouseButton1Down` is fired, where a user clicks the button and does not release
`OnClick: () -> ()`	A function invoked when `InputEnded` is fired with matching input types `Enum.UserInputType.MouseButton1` or `Enum.UserInputType.Touch`, where a user clicks the button and releases