Zergling_man/moment
Zergling_man/moment
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Split HButton components, add HMenu/HMenuItem

Browse Source
This commit is contained in:
miruka 2019-08-21 15:45:13 -04:00
parent 6067c8ec96
commit ed96409645
13 changed files with 129 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/qml/Base/HButton.qml
View File

@ -9,65 +9,29 @@ Button {
rightPadding: spacing / 1.5
topPadding: spacing / 2
bottomPadding: spacing / 2
opacity: enabled ? 1 : theme.disabledElementsOpacity
iconItem.svgName: loading ? "hourglass" : icon.name
onVisibleChanged: if (! visible) loading = false
readonly property alias ico: ico
readonly property alias label: label
readonly property alias iconItem: contentItem.icon
readonly property alias label: contentItem.label
property string iconName: ""
property color backgroundColor: theme.controls.button.background
property bool loading: false
property bool circle: false
Behavior on opacity { HNumberAnimation {} }
background: HRectangle {
background: HButtonBackground {
button: button
buttonTheme: theme.controls.button
radius: circle ? height : 0
color: backgroundColor
HRectangle {
anchors.fill: parent
radius: parent.radius
color: button.checked ?
theme.controls.button.checkedOverlay :
button.enabled && button.pressed ?
theme.controls.button.pressedOverlay :
(button.enabled && button.hovered) || button.visualFocus ?
theme.controls.button.hoveredOverlay :
"transparent"
Behavior on color { HColorAnimation { factor: 0.5 } }
}
}
contentItem: HRowLayout {
spacing: button.spacing
HIcon {
id: ico
svgName: loading ? "hourglass" : iconName
Layout.fillHeight: true
Layout.alignment: Qt.AlignCenter
}
HLabel {
id: label
text: button.text
visible: Boolean(text)
color: theme.controls.button.text
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
Layout.fillWidth: true
Layout.fillHeight: true
}
contentItem: HButtonContent {
id: contentItem
button: button
buttonTheme: theme.controls.button
}
}

29
src/qml/Base/HButtonBackground.qml Normal file
View File

@ -0,0 +1,29 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
HRectangle {
opacity: enabled ? 1 : theme.disabledElementsOpacity
property AbstractButton button
property QtObject buttonTheme
Behavior on opacity { HNumberAnimation {} }
HRectangle {
anchors.fill: parent
radius: parent.radius
color: button.checked ? buttonTheme.checkedOverlay :
button.enabled && button.pressed ? buttonTheme.pressedOverlay :
(button.enabled && button.hovered) || button.visualFocus ?
buttonTheme.hoveredOverlay :
"transparent"
Behavior on color { HColorAnimation { factor: 0.5 } }
}
}

41
src/qml/Base/HButtonContent.qml Normal file
View File

@ -0,0 +1,41 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12
HRowLayout {
spacing: button.spacing
opacity: enabled ? 1 : theme.disabledElementsOpacity
property AbstractButton button
property QtObject buttonTheme
readonly property alias icon: icon
readonly property alias label: label
Behavior on opacity { HNumberAnimation {} }
HIcon {
id: icon
svgName: button.icon.name
colorize: button.icon.color
cache: button.icon.cache
Layout.fillHeight: true
Layout.alignment: Qt.AlignCenter
}
HLabel {
id: label
text: button.text
visible: Boolean(text)
color: buttonTheme.text
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
Layout.fillWidth: true
Layout.fillHeight: true
}
}

2
src/qml/Base/HInterfaceBox.qml
View File

@ -73,7 +73,7 @@ HRectangle {
id: button
text: modelData.text
iconName: modelData.iconName || ""
icon.name: modelData.iconName || ""
enabled: modelData.enabled
onClicked: buttonCallbacks[modelData.name](button)

22
src/qml/Base/HMenuItem.qml
View File

@ -2,4 +2,26 @@ import QtQuick 2.12
import QtQuick.Controls 2.12
MenuItem {
id: menuItem
spacing: theme.spacing
leftPadding: spacing / 1.5
rightPadding: spacing / 1.5
topPadding: spacing / 2
bottomPadding: spacing / 2
readonly property alias iconItem: contentItem.icon
readonly property alias label: contentItem.label
background: HButtonBackground {
button: menuItem
buttonTheme: theme.controls.menuItem
}
contentItem: HButtonContent {
id: contentItem
button: menuItem
buttonTheme: theme.controls.menuItem
}
}

2
src/qml/Chat/Banners/Banner.qml
View File

@ -71,7 +71,7 @@ HRectangle {
HButton {
id: button
text: modelData.text
iconName: modelData.iconName
icon.name: modelData.iconName
onClicked: buttonCallbacks[modelData.name](button)
Layout.preferredHeight: theme.baseElementsHeight

6
src/qml/Chat/RoomHeader.qml
View File

@ -75,8 +75,8 @@ HRectangle {
]
HButton {
backgroundColor: "transparent"
iconName: "room-view-" + modelData
ico.dimension: 22
icon.name: "room-view-" + modelData
iconItem.dimension: 22
height: parent.height
autoExclusive: true
checked: activeButton == modelData
@ -101,7 +101,7 @@ HRectangle {
visible: opacity > 0
backgroundColor: "transparent"
iconName: "reduced-room-buttons"
icon.name: "reduced-room-buttons"
Behavior on opacity {
HNumberAnimation { duration: buttonsAnimation.duration * 2 }

4
src/qml/Pages/EditAccount/Encryption.qml
View File

@ -33,7 +33,7 @@ HColumnLayout {
HRowLayout {
HButton {
id: exportButton
iconName: "export-keys"
icon.name: "export-keys"
text: qsTr("Export")
enabled: false
@ -43,7 +43,7 @@ HColumnLayout {
HButton {
id: importButton
iconName: "import-keys"
icon.name: "import-keys"
text: qsTr("Import")
Layout.fillWidth: true

4
src/qml/Pages/EditAccount/Profile.qml
View File

@ -178,7 +178,7 @@ HGridLayout {
property bool avatarChangeRunning: false
id: saveButton
iconName: "apply"
icon.name: "apply"
text: qsTr("Apply")
loading: nameChangeRunning || avatarChangeRunning
enabled:
@ -190,7 +190,7 @@ HGridLayout {
}
HButton {
iconName: "cancel"
icon.name: "cancel"
text: qsTr("Cancel")
enabled: saveButton.enabled && ! saveButton.loading
onClicked: cancelChanges()

4
src/qml/Pages/SignIn.qml
View File

@ -63,8 +63,8 @@ HPage {
model: ["username", "email", "phone"]
HButton {
iconName: modelData
ico.dimension: 24
icon.name: modelData
iconItem.dimension: 24
circle: true
checked: loginWith == modelData
enabled: modelData == "username"

8
src/qml/SidePane/DelegateAccount.qml
View File

@ -51,7 +51,7 @@ HTileDelegate {
HButton {
id: expand
iconName: "expand"
icon.name: "expand"
backgroundColor: "transparent"
padding: sidePane.currentSpacing / 1.5
rightPadding: leftPadding
@ -60,9 +60,9 @@ HTileDelegate {
visible: opacity > 0
opacity: accountDelegate.forceExpand ? 0 : 1
ico.transform: Rotation {
origin.x: expand.ico.dimension / 2
origin.y: expand.ico.dimension / 2
iconItem.transform: Rotation {
origin.x: expand.iconItem.dimension / 2
origin.y: expand.iconItem.dimension / 2
angle: collapsed ? 180 : 90
Behavior on angle { HNumberAnimation {} }

2
src/qml/SidePane/PaneToolBar.qml
View File

@ -12,7 +12,7 @@ HRowLayout {
Layout.preferredHeight: theme.baseElementsHeight
HButton {
iconName: "add-account"
icon.name: "add-account"
backgroundColor: theme.sidePane.settingsButton.background
onClicked: pageLoader.showPage("SignIn")

12
src/themes/Default.qpl
View File

@ -96,15 +96,23 @@ controls:
color pressedOverlay: hsluv(0, 0, 50, 0.6)
color checkedOverlay: colors.accentBackground
menuItem:
color background: controls.button.background
color text: controls.button.text
color hoveredOverlay: controls.button.hoveredOverlay
color pressedOverlay: controls.button.hoveredOverlay
color checkedOverlay: controls.button.hoveredOverlay
checkBox:
color checkIconColor: colors.strongAccentBackground
color boxBackground: colors.inputBackground
color boxBackground: controls.button.background
color boxBorder: hsluv(0, 0, 50, 0.3)
color boxHoveredBorder: colors.accentBackground
color boxPressedBorder: colors.strongAccentBackground
color text: colors.text
color text: controls.button.text
listView:
color highlight: hsluv(0, 0, 50, 0.3)