TonalIconButton

import { TonalIconButton } from "material.slint";
export component Example inherits Window {
    width: 100px;
    height: 100px;
    background: transparent;
    TonalIconButton {
        icon: @image-url("icons/music_note.svg");
        tooltip: "Music";
    }
}

slint

A TonalIconButton is a button that displays a secondary container background with an icon, used for less prominent actions than filled icon buttons.

Properties

checkable

bool default: false

Whether the button can be toggled between checked and unchecked states.

checked

bool (in-out) default: false

Whether the button is currently checked.

enabled

bool default: true

Whether the button is enabled and can be interacted with.

icon

image default: the empty image

The icon image displayed on the button.

icon_checked

image default: the empty image

The icon image displayed when the button is checked (if checkable).

string default: ""

A tooltip text that appears when hovering over the button.

Callbacks

clicked()

Invoked when the button is clicked.

TonalIconButton {
    clicked() => {
        debug("Tonal icon button clicked");
    }
}

slint