Slint UI base

This commit is contained in:
Candifloss 2026-01-02 11:50:07 +05:30
parent 5c9aa42c84
commit 263cbabfdf

View File

@ -1,7 +1,134 @@
export component PowerMenu inherits Window { component PowerMenuButton {
in property <int> screen-width: 1366; in property <string> option_icon: "O";
in property <int> screen-height: 768; in property <string> option_name: "Log out";
in property <int> btn_width: 120;
in property <int> btn_height: 120;
in property <int> btn_border_radius: 20;
in property <color> btn_bg_normal: #91919175;
in property <color> btn_bg_hover: #92929284;
in property <color> btn_bg_clicked: #9b9b9bab;
Rectangle {
width: btn_width *1px;
height: btn_height *1px;
border-radius: btn_border_radius *1px;
drop-shadow-color: #232323;
drop-shadow-blur: 10px;
drop-shadow-offset-x: 0;
drop-shadow-offset-y: 0;
background: touch_area.pressed ? btn_bg_clicked
: touch_area.has-hover ? btn_bg_hover
: btn_bg_normal;
callback menu_btn_callback();
VerticalLayout {
padding: 0;
spacing: 0;
Text {
text: option_icon;
font-size: 55px;
width: btn_width *1px;
height: (btn_height/100) * 75 *1px;
vertical-alignment: center;
horizontal-alignment: center;
font-family: "IosevkaTermSlab Nerd Font Mono";
color: #ffffff;
}
Text {
text: option_name;
font-size: 14px;
width: btn_width *1px;
height: (btn_height/100) * 25 *1px;
vertical-alignment: center;
horizontal-alignment: center;
font-family: "IosevkaTermSlab Nerd Font Mono";
color: #ffffff;
}
}
touch_area := TouchArea {
clicked => { menu_btn_callback(); }
}
}
}
export component PowerMenu inherits Window {
in property <int> screen_width: 1920;
in property <int> screen_height: 1080;
in property <color> screen_bg: #a3a3a320;
in property <int> btn_width: 120;
in property <int> btn_height: 120;
in property <int> btn_border_radius: 20;
in property <color> btn_bg_normal: #91919175;
in property <color> btn_bg_hover: #92929284;
in property <color> btn_bg_clicked: #9b9b9bab;
in property <int> menu_padding_x: 20;
in property <int> menu_padding_y: menu_padding_x;
in property <int> menu_spacing: menu_padding_x;
in property <int> menu_border_radius: menu_padding_x;
in property <int> menu_width: (btn_width*4 + menu_spacing*3 + menu_padding_x*2);
in property <int> menu_height: (btn_height + menu_padding_y*2);
in property <int> menu_pos_x: (screen_width - menu_width)/2;
in property <int> menu_pos_y: (screen_height - menu_height)/2;
in property <color> menu_bg: #7a7a7a28;
background: #adadad57;
no-frame: true; no-frame: true;
always-on-top: true;
background: transparent;
width: screen_width *1px;
height: screen_height *1px;
// Power menu screen
Rectangle {
width: 100%;
height: 100%;
x: 0;
y:0;
background: screen_bg;
// Menu pop-up
Rectangle {
background: menu_bg;
border-radius: menu_border_radius *1px;
width: menu_width *1px;
height: menu_height * 1px;
x: menu_pos_x *1px;
y: menu_pos_y *1px;
HorizontalLayout {
padding: menu_padding_x *1px;
spacing: menu_spacing *1px;
PowerMenuButton {
option_icon: "O";
option_name: "Lock screen";
}
PowerMenuButton {
option_icon: "O";
option_name: "Log out";
}
PowerMenuButton {
option_icon: "O";
option_name: "Reboot";
}
PowerMenuButton {
option_icon: "O";
option_name: "Power off";
}
}
}
}
} }