FluentUI/Gallery/res/qml/component/base/MyImgButton.qml
yxdy ff15075c79
Some checks are pending
Gallery App Build / macOS (push) Waiting to run
Gallery App Build / Windows (push) Waiting to run
Gallery App Build / Ubuntu (push) Waiting to run
修改样式
2025-03-07 16:23:09 +08:00

68 lines
2.1 KiB
QML

import QtQuick 2.15
import Qt5Compat.GraphicalEffects
Rectangle{
id: control
property var p_width: 25
property var p_height: 25
property var p_img: "nav_car.png"
property var p_checked: false
signal clickItem(var type);
onP_checkedChanged: function(nv) {
if (control.p_checked) {
control.gradient.stops[0].color = "#77ED8B"
control.gradient.stops[1].color = "#22C55E"
img_nav.visible = true
} else {
control.gradient.stops[0].color = Qt.rgba(255/255,255/255,255/255, 0.05)
control.gradient.stops[1].color = Qt.rgba(255/255,255/255,255/255, 0.05)
img_nav.visible = false
}
}
width: p_width
height: p_height
radius: 5
gradient: Gradient {
orientation: Gradient.Horizontal
GradientStop { position: 0.0; color: control.p_checked ? "#77ED8B" : Qt.rgba(255/255,255/255,255/255, 0.05) }
GradientStop { position: 1.0; color: control.p_checked ? "#22C55E" : Qt.rgba(255/255,255/255,255/255, 0.05) }
}
Image{
source: "qrc:/qt/qml/Gallery/res/image/components/map/" + p_img
anchors.centerIn: parent
ColorOverlay{
id: img_nav
anchors.fill: parent
color: "#2a2a2a"
source: parent
visible: control.p_checked
}
}
MouseArea{
anchors.fill: parent
hoverEnabled: true
onEntered: {
if (!control.p_checked) {
parent.gradient.stops[0].color = "#77ED8B"
parent.gradient.stops[1].color = "#22C55E"
img_nav.visible = true
}
}
onExited: {
if (!control.p_checked) {
parent.gradient.stops[0].color = Qt.rgba(255/255,255/255,255/255, 0.05)
parent.gradient.stops[1].color = Qt.rgba(255/255,255/255,255/255, 0.05)
img_nav.visible = false
}
}
onClicked: {
control.clickItem("")
}
}
}