language-servers/slint
1
0
Fork 0
mirror of https://github.com/slint-ui/slint.git synced 2025-10-02 06:41:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

Use hover effects in the ugly style

Browse source 
Use a darker shade between the unpressed and the pressed shade when hovering
over controls that can be activated.
This commit is contained in:
Simon Hausmann 2020-11-24 22:12:17 +01:00
parent 727ab2ee9d
commit 65e09c723a
1 changed files with 6 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

11
sixtyfps_compiler/widgets/ugly/sixtyfps_widgets.60
View file

@ -14,7 +14,8 @@ global Palette := {
property<color> text_color_disabled: lightgray; property<color> text_color_disabled: lightgray;
property<color> text_color_secondary: #111; property<color> text_color_secondary: #111;
property<color> button_background: #aaa; property<color> button_background: #aaa;
property<color> button_pressed: #9c9c9c; property<color> button_hover: #8c8c8c;
property<color> button_pressed: #575757;
property<color> highlight_background: #2b60ae; property<color> highlight_background: #2b60ae;
property<color> placeholder_text: #ccc; property<color> placeholder_text: #ccc;
property<color> border_color: #d0d3cf; property<color> border_color: #d0d3cf;
@ -37,7 +38,7 @@ export Button := Rectangle {
border_width: 1px; border_width: 1px;
border_radius: 2px; border_radius: 2px;
border_color: Palette.text_color; border_color: Palette.text_color;
color: self.pressed ? Palette.button_pressed : Palette.button_background; color: self.pressed ? Palette.button_pressed : (touch_area.has_hover ? Palette.button_hover : Palette.button_background);
animate color { duration: 100ms; } animate color { duration: 100ms; }
horizontal-stretch: 0; horizontal-stretch: 0;
vertical-stretch: 0; vertical-stretch: 0;
@ -131,7 +132,7 @@ SpinBoxButton := Rectangle {
border_width: 1px; border_width: 1px;
border_radius: 2px; border_radius: 2px;
border_color: black; border_color: black;
color: touch.pressed ? Palette.button_pressed : Palette.button_background; color: touch.pressed ? Palette.button_pressed : (touch.has_hover ? Palette.button_hover : Palette.button_background);
animate color { duration: 100ms; } animate color { duration: 100ms; }
touch := TouchArea { touch := TouchArea {
width: parent.width; width: parent.width;
@ -344,7 +345,7 @@ ScrollBar := Rectangle {
height: horizontal ? parent.height : max <= 0phx ? 0phx : parent.height * (page_size / (max + page_size)); height: horizontal ? parent.height : max <= 0phx ? 0phx : parent.height * (page_size / (max + page_size));
border_radius: self.width / 2; border_radius: self.width / 2;
color: touch_area.pressed ? Palette.button_pressed : Palette.button_background; color: touch_area.pressed ? Palette.button_pressed : (touch_area.has_hover ? Palette.button_hover : Palette.button_background);
animate color { duration: 100ms; } animate color { duration: 100ms; }
x: !horizontal ? 0phx : (root.width - handle.width) * (new_value / max); x: !horizontal ? 0phx : (root.width - handle.width) * (new_value / max);
y: horizontal ? 0phx : (root.height - handle.height) * (new_value / max); y: horizontal ? 0phx : (root.height - handle.height) * (new_value / max);
@ -444,7 +445,7 @@ export ComboBox := Rectangle {
border_width: 1px; border_width: 1px;
border_radius: 2px; border_radius: 2px;
border_color: Palette.text_color; border_color: Palette.text_color;
color: touch_area.pressed ? Palette.button_pressed : Palette.button_background; color: touch_area.pressed ? Palette.button_pressed : (touch_area.has_hover ? Palette.button_hover : Palette.button_background);
animate color { duration: 100ms; } animate color { duration: 100ms; }
horizontal-stretch: 0; horizontal-stretch: 0;
vertical-stretch: 0; vertical-stretch: 0;