128 lines
3.7 KiB
QML
128 lines
3.7 KiB
QML
|
import QtQuick 2.13
|
||
|
import QtGraphicalEffects 1.12
|
||
|
import "../../imports"
|
||
|
import ".."
|
||
|
|
||
|
Rectangle {
|
||
|
property string text
|
||
|
property bool isSwitch: false
|
||
|
property bool switchChecked: false
|
||
|
property string currentValue
|
||
|
property bool isBadge: false
|
||
|
property string badgeText: "1"
|
||
|
property int badgeRadius: 9
|
||
|
property bool isEnabled: true
|
||
|
signal clicked(bool checked)
|
||
|
property bool isHovered: false
|
||
|
property int badgeSize: 18
|
||
|
property url iconSource
|
||
|
|
||
|
id: root
|
||
|
implicitHeight: 52
|
||
|
color: isHovered ? Style.current.backgroundHover : Style.current.transparent
|
||
|
radius: Style.current.radius
|
||
|
border.width: 0
|
||
|
anchors.left: parent.left
|
||
|
anchors.leftMargin: -Style.current.padding
|
||
|
anchors.right: parent.right
|
||
|
anchors.rightMargin: -Style.current.padding
|
||
|
|
||
|
RoundedIcon {
|
||
|
id: pinImage
|
||
|
visible: !!root.iconSource.toString()
|
||
|
source: root.iconSource
|
||
|
iconColor: Style.current.primary
|
||
|
color: Style.current.secondaryBackground
|
||
|
width: 40
|
||
|
height: 40
|
||
|
iconWidth: 24
|
||
|
iconHeight: 24
|
||
|
anchors.left: parent.left
|
||
|
anchors.leftMargin: Style.current.padding
|
||
|
anchors.verticalCenter: parent.verticalCenter
|
||
|
}
|
||
|
|
||
|
StyledText {
|
||
|
id: textItem
|
||
|
anchors.left: pinImage.visible ? pinImage.right : parent.left
|
||
|
anchors.leftMargin: Style.current.padding
|
||
|
anchors.verticalCenter: parent.verticalCenter
|
||
|
text: root.text
|
||
|
font.pixelSize: 15
|
||
|
color: !root.isEnabled ? Style.current.secondaryText : Style.current.textColor
|
||
|
}
|
||
|
|
||
|
StyledText {
|
||
|
id: valueText
|
||
|
visible: !!root.currentValue
|
||
|
text: root.currentValue
|
||
|
elide: Text.ElideRight
|
||
|
font.pixelSize: 15
|
||
|
horizontalAlignment: Text.AlignRight
|
||
|
color: Style.current.secondaryText
|
||
|
anchors.left: textItem.right
|
||
|
anchors.leftMargin: Style.current.padding
|
||
|
anchors.right: root.isSwitch ? switchItem.left : caret.left
|
||
|
anchors.rightMargin: Style.current.padding
|
||
|
anchors.verticalCenter: textItem.verticalCenter
|
||
|
|
||
|
}
|
||
|
|
||
|
StatusSwitch {
|
||
|
id: switchItem
|
||
|
enabled: root.isEnabled
|
||
|
visible: root.isSwitch
|
||
|
checked: root.switchChecked
|
||
|
anchors.right: parent.right
|
||
|
anchors.rightMargin: Style.current.padding
|
||
|
anchors.verticalCenter: textItem.verticalCenter
|
||
|
}
|
||
|
|
||
|
Rectangle {
|
||
|
id: badge
|
||
|
visible: root.isBadge & !root.isSwitch
|
||
|
anchors.right: root.isSwitch ? switchItem.left : caret.left
|
||
|
anchors.rightMargin: Style.current.padding
|
||
|
anchors.verticalCenter: textItem.verticalCenter
|
||
|
radius: root.badgeRadius
|
||
|
color: Style.current.blue
|
||
|
width: root.badgeSize
|
||
|
height: root.badgeSize
|
||
|
Text {
|
||
|
font.pixelSize: 12
|
||
|
color: Style.current.white
|
||
|
anchors.centerIn: parent
|
||
|
text: root.badgeText
|
||
|
}
|
||
|
}
|
||
|
|
||
|
SVGImage {
|
||
|
id: caret
|
||
|
visible: !root.isSwitch
|
||
|
anchors.right: parent.right
|
||
|
anchors.rightMargin: Style.current.padding
|
||
|
anchors.verticalCenter: textItem.verticalCenter
|
||
|
source: "../../app/img/caret.svg"
|
||
|
width: 13
|
||
|
height: 7
|
||
|
rotation: -90
|
||
|
ColorOverlay {
|
||
|
anchors.fill: caret
|
||
|
source: caret
|
||
|
color: Style.current.secondaryText
|
||
|
}
|
||
|
}
|
||
|
|
||
|
MouseArea {
|
||
|
anchors.fill: parent
|
||
|
enabled: root.isEnabled
|
||
|
hoverEnabled: true
|
||
|
onEntered: root.isHovered = true
|
||
|
onExited: root.isHovered = false
|
||
|
onClicked: {
|
||
|
root.clicked(!root.switchChecked)
|
||
|
}
|
||
|
cursorShape: isEnabled ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||
|
}
|
||
|
}
|