From a2ae5695112ec7d6c18ce7385d0f09e75e48af82 Mon Sep 17 00:00:00 2001 From: miruka Date: Wed, 10 Jul 2019 15:00:57 -0400 Subject: [PATCH] Split HButton into HBaseButton and HButton --- TODO.md | 1 + src/qml/Base/HBaseButton.qml | 76 ++++++++++++++++++ src/qml/Base/HButton.qml | 66 +--------------- src/qml/Base/HEntityButton.qml | 136 +++++++++++++++++++++++++++++++++ 4 files changed, 214 insertions(+), 65 deletions(-) create mode 100644 src/qml/Base/HBaseButton.qml create mode 100644 src/qml/Base/HEntityButton.qml diff --git a/TODO.md b/TODO.md index 4771fde8..504536c2 100644 --- a/TODO.md +++ b/TODO.md @@ -49,6 +49,7 @@ - Links preview - Client improvements + - More intelligent thumbnails downloading for different sizes - Filtering rooms: search more than display names? - Initial sync filter and lazy load, see weechat-matrix `_handle_login()` - See also `handle_response()`'s `keys_query` request diff --git a/src/qml/Base/HBaseButton.qml b/src/qml/Base/HBaseButton.qml new file mode 100644 index 00000000..7467a108 --- /dev/null +++ b/src/qml/Base/HBaseButton.qml @@ -0,0 +1,76 @@ +// Copyright 2019 miruka +// This file is part of harmonyqml, licensed under LGPLv3. + +import QtQuick 2.7 +import QtQuick.Controls 2.2 +import QtQuick.Layouts 1.3 + +Button { + property bool circle: false + + property color backgroundColor: theme.controls.button.background + property alias overlayOpacity: buttonBackgroundOverlay.opacity + property bool checkedLightens: false + + signal canceled + signal clicked + signal doubleClicked + signal entered + signal exited + signal pressAndHold + signal pressed + signal released + + id: button + + background: Rectangle { + id: buttonBackground + color: Qt.lighter( + backgroundColor, checked ? (checkedLightens ? 1.3 : 0.7) : 1.0 + ) + radius: circle ? height : 0 + + Behavior on color { + ColorAnimation { duration: theme.animationDuration / 2 } + } + + Rectangle { + id: buttonBackgroundOverlay + anchors.fill: parent + radius: parent.radius + color: "black" + opacity: 0 + + Behavior on opacity { + HNumberAnimation { duration: theme.animationDuration / 2 } + } + } + } + + MouseArea { + anchors.fill: parent + hoverEnabled: true + + onCanceled: button.canceled() + onClicked: button.clicked() + onDoubleClicked: button.doubleClicked() + onEntered: { + overlayOpacity = checked ? 0 : 0.15 + button.entered() + } + onExited: { + overlayOpacity = 0 + button.exited() + } + onPressAndHold: button.pressAndHold() + onPressed: { + overlayOpacity += 0.15 + button.pressed() + } + onReleased: { + if (checkable) { checked = ! checked } + overlayOpacity = checked ? 0 : 0.15 + button.released() + } + } +} diff --git a/src/qml/Base/HButton.qml b/src/qml/Base/HButton.qml index 06eb78c9..6909afc1 100644 --- a/src/qml/Base/HButton.qml +++ b/src/qml/Base/HButton.qml @@ -5,19 +5,15 @@ import QtQuick 2.7 import QtQuick.Controls 2.2 import QtQuick.Layouts 1.3 -Button { +HBaseButton { property int horizontalMargin: 0 property int verticalMargin: 0 property string iconName: "" property var iconDimension: null property var iconTransform: null - property bool circle: false property int fontSize: theme.fontSize.normal - property color backgroundColor: theme.controls.button.background - property alias overlayOpacity: buttonBackgroundOverlay.opacity - property bool checkedLightens: false property bool loading: false @@ -26,41 +22,8 @@ Button { readonly property alias visibility: button.visible onVisibilityChanged: if (! visibility) { loading = false } - signal canceled - signal clicked - signal doubleClicked - signal entered - signal exited - signal pressAndHold - signal pressed - signal released - id: button - background: Rectangle { - id: buttonBackground - color: Qt.lighter( - backgroundColor, checked ? (checkedLightens ? 1.3 : 0.7) : 1.0 - ) - radius: circle ? height : 0 - - Behavior on color { - ColorAnimation { duration: theme.animationDuration / 2 } - } - - Rectangle { - id: buttonBackgroundOverlay - anchors.fill: parent - radius: parent.radius - color: "black" - opacity: 0 - - Behavior on opacity { - HNumberAnimation { duration: theme.animationDuration / 2 } - } - } - } - Component { id: buttonContent @@ -106,31 +69,4 @@ Button { sourceComponent: loading && ! iconName ? loadingOverlay : buttonContent } - - MouseArea { - anchors.fill: parent - hoverEnabled: true - - onCanceled: button.canceled() - onClicked: button.clicked() - onDoubleClicked: button.doubleClicked() - onEntered: { - overlayOpacity = checked ? 0 : 0.15 - button.entered() - } - onExited: { - overlayOpacity = 0 - button.exited() - } - onPressAndHold: button.pressAndHold() - onPressed: { - overlayOpacity += 0.15 - button.pressed() - } - onReleased: { - if (checkable) { checked = ! checked } - overlayOpacity = checked ? 0 : 0.15 - button.released() - } - } } diff --git a/src/qml/Base/HEntityButton.qml b/src/qml/Base/HEntityButton.qml new file mode 100644 index 00000000..06eb78c9 --- /dev/null +++ b/src/qml/Base/HEntityButton.qml @@ -0,0 +1,136 @@ +// Copyright 2019 miruka +// This file is part of harmonyqml, licensed under LGPLv3. + +import QtQuick 2.7 +import QtQuick.Controls 2.2 +import QtQuick.Layouts 1.3 + +Button { + property int horizontalMargin: 0 + property int verticalMargin: 0 + + property string iconName: "" + property var iconDimension: null + property var iconTransform: null + property bool circle: false + + property int fontSize: theme.fontSize.normal + property color backgroundColor: theme.controls.button.background + property alias overlayOpacity: buttonBackgroundOverlay.opacity + property bool checkedLightens: false + + property bool loading: false + + property int contentWidth: 0 + + readonly property alias visibility: button.visible + onVisibilityChanged: if (! visibility) { loading = false } + + signal canceled + signal clicked + signal doubleClicked + signal entered + signal exited + signal pressAndHold + signal pressed + signal released + + id: button + + background: Rectangle { + id: buttonBackground + color: Qt.lighter( + backgroundColor, checked ? (checkedLightens ? 1.3 : 0.7) : 1.0 + ) + radius: circle ? height : 0 + + Behavior on color { + ColorAnimation { duration: theme.animationDuration / 2 } + } + + Rectangle { + id: buttonBackgroundOverlay + anchors.fill: parent + radius: parent.radius + color: "black" + opacity: 0 + + Behavior on opacity { + HNumberAnimation { duration: theme.animationDuration / 2 } + } + } + } + + Component { + id: buttonContent + + HRowLayout { + id: contentLayout + spacing: button.text && iconName ? 5 : 0 + Component.onCompleted: contentWidth = implicitWidth + + HIcon { + svgName: loading ? "hourglass" : iconName + dimension: iconDimension || contentLayout.height + transform: iconTransform + + Layout.topMargin: verticalMargin + Layout.bottomMargin: verticalMargin + Layout.leftMargin: horizontalMargin + Layout.rightMargin: horizontalMargin + } + + HLabel { + text: button.text + font.pixelSize: fontSize + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + + Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter + } + } + } + + Component { + id: loadingOverlay + HRowLayout { + HIcon { + svgName: "hourglass" + Layout.preferredWidth: contentWidth || -1 + Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter + } + } + } + + contentItem: Loader { + sourceComponent: + loading && ! iconName ? loadingOverlay : buttonContent + } + + MouseArea { + anchors.fill: parent + hoverEnabled: true + + onCanceled: button.canceled() + onClicked: button.clicked() + onDoubleClicked: button.doubleClicked() + onEntered: { + overlayOpacity = checked ? 0 : 0.15 + button.entered() + } + onExited: { + overlayOpacity = 0 + button.exited() + } + onPressAndHold: button.pressAndHold() + onPressed: { + overlayOpacity += 0.15 + button.pressed() + } + onReleased: { + if (checkable) { checked = ! checked } + overlayOpacity = checked ? 0 : 0.15 + button.released() + } + } +}