status-desktop/ui/shared/status/StatusButton.qml

147 lines
5.2 KiB
QML
Raw Normal View History

2020-08-25 09:00:03 +00:00
import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQml 2.14
import QtGraphicalEffects 1.13
2020-08-25 09:00:03 +00:00
import "../../imports"
import "../../shared"
Button {
property string type: "primary"
property string size: "large"
property string state: "default"
property color color: type === "warn" ? Style.current.danger : Style.current.buttonForegroundColor
property color bgColor: type === "warn" ? Style.current.buttonWarnBackgroundColor : Style.current.buttonBackgroundColor
property color borderColor: color
property color hoveredBorderColor: color
property bool forceBgColorOnHover: false
property int borderRadius: Style.current.radius
property color bgHoverColor: {
if (type === "warn") {
if (showBorder) {
return Style.current.buttonOutlineHoveredWarnBackgroundColor
}
return Utils.setColorAlpha(Style.current.buttonHoveredWarnBackgroundColor, 0.2)
}
return Utils.setColorAlpha(Style.current.buttonHoveredBackgroundColor, 0.2)
}
property bool disableColorOverlay: false
property bool showBorder: false
property int iconRotation: 0
2020-08-25 09:00:03 +00:00
id: control
font.pixelSize: size === "small" ? 13 : 15
font.family: Style.current.fontRegular.name
2020-08-25 09:00:03 +00:00
font.weight: Font.Medium
implicitHeight: flat ? 32 : (size === "small" ? 38 : 44)
implicitWidth: buttonLabel.implicitWidth + (flat ? 3* Style.current.halfPadding : 2 * Style.current.padding) +
(iconLoader.active ? iconLoader.width : 0)
2020-08-25 09:00:03 +00:00
enabled: state === "default"
contentItem: Item {
id: content
2020-08-25 09:00:03 +00:00
anchors.fill: parent
anchors.horizontalCenter: parent.horizontalCenter
Loader {
id: iconLoader
active: !!control.icon && !!control.icon.source.toString()
anchors.left: parent.left
anchors.leftMargin: Style.current.halfPadding
anchors.verticalCenter: parent.verticalCenter
sourceComponent: SVGImage {
id: iconImg
source: control.icon.source
height: control.icon.height
width: control.icon.width
fillMode: Image.PreserveAspectFit
rotation: control.iconRotation
ColorOverlay {
enabled: !control.disableColorOverlay
anchors.fill: iconImg
source: iconImg
color: control.disableColorOverlay ? "transparent" : buttonLabel.color
antialiasing: true
smooth: true
rotation: control.iconRotation
}
}
}
2020-08-25 09:00:03 +00:00
Text {
id: buttonLabel
text: control.text
font: control.font
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.right: iconLoader.active ? undefined : parent.right
anchors.left: iconLoader.active ? iconLoader.right : parent.left
anchors.leftMargin: iconLoader.active ? Style.current.smallPadding : 0
color: {
if (!enabled) {
return Style.current.buttonDisabledForegroundColor
} else if (type !== "warn" && (hovered || highlighted)) {
return control.color !== Style.current.buttonForegroundColor ?
control.color : Style.current.blue
}
return control.color
}
visible: !loadingIndicator.active
2020-08-25 09:00:03 +00:00
}
Component {
id: loadingComponent
LoadingImage {}
}
Loader {
2020-08-25 09:00:03 +00:00
id: loadingIndicator
active: control.state === "pending"
sourceComponent: loadingComponent
2020-08-25 09:00:03 +00:00
height: loadingIndicator.visible ?
control.size === "large" ?
23 : 17
: 0
width: loadingIndicator.height
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
}
}
background: Rectangle {
radius: borderRadius
2020-08-25 09:00:03 +00:00
anchors.fill: parent
border.width: flat || showBorder ? 1 : 0
border.color: {
if (hovered) {
return control.hoveredBorderColor !== control.borderColor ? control.hoveredBorderColor : control.borderColor
}
if (showBorder && enabled) {
return control.borderColor
}
return Style.current.transparent
}
2020-08-25 09:00:03 +00:00
color: {
if (flat) {
return hovered && forceBgColorOnHover ? control.bgHoverColor : "transparent"
}
2020-08-25 09:00:03 +00:00
if (type === "secondary") {
return hovered ? control.bgColor : "transparent"
2020-08-25 09:00:03 +00:00
}
return !enabled ? (control.bgColor === Style.current.transparent ? control.bgColor : Style.current.buttonDisabledBackgroundColor) :
(hovered ? control.bgHoverColor : control.bgColor)
2020-08-25 09:00:03 +00:00
}
}
MouseArea {
cursorShape: Qt.PointingHandCursor
anchors.fill: parent
onPressed: mouse.accepted = false
}
}