1// Copyright © SixtyFPS GmbH <info@slint.dev>
2// SPDX-License-Identifier: MIT
3
4import { SizeSettings, TodoPalette } from "styling.slint";
5import { FocusTouchArea } from "focus_touch_area.slint";
6import { StateLayer } from "./state_layer.slint";
7
8export component IconButton {
9 callback clicked;
10
11 in property <image> icon;
12
13 horizontal-stretch: 0;
14 vertical-stretch: 0;
15 forward-focus: touch-area;
16 width: self.height;
17 height: SizeSettings.control-height;
18
19 accessible-role: button;
20 accessible-action-default => { touch-area.clicked(); }
21
22 touch-area := FocusTouchArea {
23 width: 100%;
24 height: 100%;
25
26 clicked => {
27 root.clicked();
28 }
29 }
30
31 StateLayer {
32 width: 100%;
33 height: 100%;
34 border-radius: self.height / 2;
35 pressed: touch-area.pressed || touch-area.enter-pressed;
36 has-focus: touch-area.has-focus;
37 has-hover: touch-area.has-hover;
38 }
39
40 content-layer := HorizontalLayout {
41 alignment: center;
42
43 icon-image := Image {
44 source: root.icon;
45 height: SizeSettings.control-icon-height;
46 y: (parent.height - self.height) / 2;
47 colorize: TodoPalette.foreground;
48 }
49 }
50}
51