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 ActionButton {
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-big-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 background-layer := Rectangle {
32 width: 100%;
33 height: 100%;
34 background: TodoPalette.accent-background;
35 border-radius: self.height / 2;
36 }
37
38 StateLayer {
39 width: 100%;
40 height: 100%;
41 border-radius: background-layer.border-radius;
42 pressed: touch-area.pressed || touch-area.enter-pressed;
43 has-focus: touch-area.has-focus;
44 has-hover: touch-area.has-hover;
45 }
46
47 content-layer := HorizontalLayout {
48 alignment: center;
49
50 icon-image := Image {
51 source: root.icon;
52 height: SizeSettings.control-icon-big-height;
53 y: (parent.height - self.height) / 2;
54 colorize: TodoPalette.accent-foreground;
55 }
56 }
57}
58