72 lines
3 KiB
Text
72 lines
3 KiB
Text
// Copyright © SixtyFPS GmbH <info@slint.dev>
|
|
// SPDX-License-Identifier: MIT
|
|
|
|
import { StateLayerArea } from "./state_layer.slint";
|
|
import { MaterialText } from "./material_text.slint";
|
|
import { Icon } from "./icon.slint";
|
|
import { MaterialTypography } from "../styling/material_typography.slint";
|
|
import { MaterialStyleMetrics } from "../styling/material_style_metrics.slint";
|
|
import { Avatar } from "./list.slint";
|
|
|
|
export component BaseButton inherits StateLayerArea {
|
|
in property <image> icon;
|
|
in property <color> icon_color: self.color;
|
|
in property <string> text;
|
|
in property <length> button_horizontal_padding: MaterialStyleMetrics.padding_24;
|
|
in property <length> button_vertical_padding: MaterialStyleMetrics.padding_10;
|
|
in property <length> button_padding_left: self.button_horizontal_padding;
|
|
in property <length> button_padding_right: self.button_horizontal_padding;
|
|
in property <length> button_padding_top: self.button_vertical_padding;
|
|
in property <length> button_padding_bottom: self.button_vertical_padding;
|
|
in property <length> spacing: MaterialStyleMetrics.spacing_8;
|
|
in property <length> min_layout_width: MaterialStyleMetrics.size_40;
|
|
in property <length> min_layout_height: MaterialStyleMetrics.size_40;
|
|
in property <length> icon_size: MaterialStyleMetrics.icon_size_18;
|
|
in property <image> avatar_icon;
|
|
in property <length> avatar_size;
|
|
in property <color> avatar_background: #00000000;
|
|
out property <bool> has_icon: root.icon.width > 0 && root.icon.height > 0;
|
|
out property <bool> has_avatar: root.avatar_icon.width > 0 && root.avatar_icon.height > 0;
|
|
|
|
min_width: max(root.min_layout_width, layout.min_width);
|
|
min_height: max(root.min_layout_height, layout.min_height);
|
|
tooltip_offset: root.height / 2 + root.icon_size / 2 + MaterialStyleMetrics.padding_14;
|
|
|
|
layout := HorizontalLayout {
|
|
padding_left: root.button_padding_left;
|
|
padding_right: root.button_padding_right;
|
|
padding_top: root.button_padding_top;
|
|
padding_bottom: root.button_padding_bottom;
|
|
spacing: root.spacing;
|
|
alignment: center;
|
|
|
|
if root.has_icon || root.has_avatar : VerticalLayout {
|
|
alignment: center;
|
|
|
|
if root.has_avatar && root.avatar_size > 0 : Avatar {
|
|
width: root.avatar_size;
|
|
height: self.width;
|
|
image: root.avatar_icon;
|
|
background: root.avatar_background;
|
|
}
|
|
|
|
if root.has_icon : Icon {
|
|
source: root.icon;
|
|
colorize: root.icon_color;
|
|
opacity: root.enabled ? 100% : 38%;
|
|
width: root.icon_size;
|
|
}
|
|
}
|
|
|
|
if root.text != "" : MaterialText {
|
|
text: root.text;
|
|
style: MaterialTypography.label_large;
|
|
color: root.color;
|
|
opacity: root.enabled ? 100% : 38%;
|
|
overflow: clip;
|
|
vertical_alignment: center;
|
|
}
|
|
|
|
@children
|
|
}
|
|
}
|