|
|
@@ -4,35 +4,36 @@ import QtQuick.Layouts 1.15
|
|
|
import QtQuick.Effects
|
|
|
|
|
|
Rectangle {
|
|
|
+ id: root
|
|
|
property alias text: buttonLabel.text
|
|
|
property string icon: ""
|
|
|
property color buttonColor: "#2196F3"
|
|
|
property bool enabled: true
|
|
|
property int fontSize: 16
|
|
|
-
|
|
|
+
|
|
|
signal clicked()
|
|
|
-
|
|
|
+
|
|
|
radius: 12
|
|
|
color: enabled ? buttonColor : "#E0E0E0"
|
|
|
opacity: enabled ? 1.0 : 0.6
|
|
|
-
|
|
|
+
|
|
|
// Gradient effect
|
|
|
gradient: Gradient {
|
|
|
- GradientStop { position: 0; color: Qt.lighter(buttonColor, 1.1) }
|
|
|
- GradientStop { position: 1; color: buttonColor }
|
|
|
+ GradientStop { position: 0; color: Qt.lighter(root.buttonColor, 1.1) }
|
|
|
+ GradientStop { position: 1; color: root.buttonColor }
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// Press animation
|
|
|
scale: mouseArea.pressed ? 0.95 : (mouseArea.containsMouse ? 1.02 : 1.0)
|
|
|
-
|
|
|
+
|
|
|
Behavior on scale {
|
|
|
NumberAnimation { duration: 150; easing.type: Easing.OutQuad }
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
Behavior on color {
|
|
|
ColorAnimation { duration: 200 }
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// Shadow effect
|
|
|
layer.enabled: true
|
|
|
layer.effect: MultiEffect {
|
|
|
@@ -41,21 +42,22 @@ Rectangle {
|
|
|
shadowBlur: 0.8
|
|
|
shadowVerticalOffset: 2
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
RowLayout {
|
|
|
anchors.centerIn: parent
|
|
|
spacing: 8
|
|
|
-
|
|
|
+
|
|
|
Text {
|
|
|
- text: parent.parent.icon
|
|
|
- font.pixelSize: parent.parent.fontSize + 2
|
|
|
- visible: parent.parent.icon !== ""
|
|
|
+ text: root.icon
|
|
|
+ font.pixelSize: root.fontSize + 2
|
|
|
+ color: "white"
|
|
|
+ visible: root.icon !== ""
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
Label {
|
|
|
id: buttonLabel
|
|
|
color: "white"
|
|
|
- font.pixelSize: parent.parent.fontSize
|
|
|
+ font.pixelSize: root.fontSize
|
|
|
font.bold: true
|
|
|
}
|
|
|
}
|