github
/
monero-gui
mirror of https://github.com/monero-project/monero-gui
1
Fork 0
Code Releases Activity

Implement tooltips in multiple pages and components

This commit is contained in:
rating89us 2021-05-19 18:36:44 +02:00 committed by rating89us
parent 937cb98256
commit 9d3864b7f0
15 changed files with 143 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
components/AdvancedOptionsItem.qml
View File

@ -22,6 +22,7 @@ RowLayout {
MoneroComponents.Label {
id: title
fontSize: 14
tooltipIconVisible: true
}
Rectangle {

5
components/CheckBox.qml
View File

@ -48,6 +48,8 @@ Item {
property int fontSize: 14
property alias fontColor: label.color
property bool iconOnTheLeft: true
property alias tooltipIconVisible: label.tooltipIconVisible
property alias tooltip: label.tooltip
signal clicked()
height: 25
@ -121,7 +123,10 @@ Item {
MouseArea {
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onEntered: !label.tooltipIconVisible && label.tooltip ? label.tooltipPopup.open() : ""
onExited: !label.tooltipIconVisible && label.tooltip ? label.tooltipPopup.close() : ""
onClicked: {
toggle()
}

9
components/IconButton.qml
View File

@ -36,19 +36,28 @@ MoneroEffects.ImageMask {
color: MoneroComponents.Style.defaultFontColor
image: ""
property alias tooltip: tooltip.text
signal clicked(var mouse)
MoneroComponents.Tooltip {
id: tooltip
anchors.fill: parent
tooltipLeft: true
}
MouseArea {
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onEntered: {
tooltip.text ? tooltip.tooltipPopup.open() : ""
button.width = button.width + 2
button.height = button.height + 2
}
onExited: {
tooltip.text ? tooltip.tooltipPopup.close() : ""
button.width = button.width - 2
button.height = button.height - 2
}

10
components/InlineButton.qml
View File

@ -46,6 +46,9 @@ Item {
property alias fontStyleName: inlineText.font.styleName
property bool isFontAwesomeIcon: fontFamily == FontAwesome.fontFamily || fontFamily == FontAwesome.fontFamilySolid
property alias buttonColor: rect.color
property alias tooltip: tooltip.text
property alias tooltipLeft: tooltip.tooltipLeft
property alias tooltipBottom: tooltip.tooltipBottom
height: isFontAwesomeIcon ? 30 : 24
width: isFontAwesomeIcon ? height : inlineText.width + 16
@ -82,6 +85,11 @@ Item {
}
}
MoneroComponents.Tooltip {
id: tooltip
anchors.fill: parent
}
MouseArea {
id: buttonArea
cursorShape: rect.enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
@ -89,10 +97,12 @@ Item {
anchors.fill: parent
onClicked: doClick()
onEntered: {
tooltip.text ? tooltip.tooltipPopup.open() : ""
rect.color = buttonColor ? buttonColor : "#707070";
rect.opacity = 0.8;
}
onExited: {
tooltip.text ? tooltip.tooltipPopup.close() : ""
rect.opacity = 1.0;
rect.color = buttonColor ? buttonColor : "#808080";
}

1
components/Label.qml
View File

@ -35,6 +35,7 @@ Item {
id: item
property alias text: label.text
property alias tooltip: label.tooltip
property alias tooltipIconVisible: label.tooltipIconVisible
property alias color: label.color
property int textFormat: Text.PlainText
property string tipText: ""

4
components/RemoteNodeList.qml
View File

@ -112,6 +112,8 @@ ColumnLayout {
fontFamily: FontAwesome.fontFamily
fontPixelSize: 18
text: FontAwesome.edit
tooltip: qsTr("Edit remote node") + translationManager.emptyString
tooltipLeft: true
onClicked: remoteNodeDialog.edit(remoteNodesModel.get(index), function (remoteNode) {
remoteNodesModel.set(index, remoteNode)
})
@ -122,6 +124,8 @@ ColumnLayout {
fontFamily: FontAwesome.fontFamily
text: FontAwesome.times
visible: remoteNodesModel.count > 1
tooltip: qsTr("Remove remote node") + translationManager.emptyString
tooltipLeft: true
onClicked: remoteNodesModel.removeSelectNextIfNeeded(index)
}
}

10
components/StandardButton.qml
View File

@ -52,6 +52,9 @@ Item {
else return 16;
}
property alias label: label
property alias tooltip: tooltip.text
property alias tooltipLeft: tooltip.tooltipLeft
property alias tooltipPopup: tooltip.tooltipPopup
signal clicked()
height: small ? 30 : 36
@ -161,11 +164,18 @@ Item {
}
}
MoneroComponents.Tooltip {
id: tooltip
anchors.fill: parent
}
MouseArea {
id: buttonArea
anchors.fill: parent
hoverEnabled: true
onClicked: doClick()
onEntered: tooltip.text ? tooltip.tooltipPopup.open() : ""
onExited: tooltip.text ? tooltip.tooltipPopup.close() : ""
cursorShape: Qt.PointingHandCursor
}

5
components/TextPlain.qml
View File

@ -13,6 +13,9 @@ Text {
property string themeTransitionBlackColor: ""
property string themeTransitionWhiteColor: ""
property alias tooltip: tooltip.text
property alias tooltipLeft: tooltip.tooltipLeft
property alias tooltipIconVisible: tooltip.tooltipIconVisible
property alias tooltipPopup: tooltip.tooltipPopup
font.family: MoneroComponents.Style.fontMedium.name
font.bold: false
font.pixelSize: 14
@ -30,6 +33,6 @@ Text {
MoneroComponents.Tooltip {
id: tooltip
anchors.top: parent.top
anchors.left: parent.right
anchors.left: tooltipIconVisible ? parent.right : parent.left
}
}

48
components/TitleBar.qml
View File

@ -110,12 +110,24 @@ Rectangle {
opacity: 0.75
}
MoneroComponents.Tooltip {
id: btnCloseWalletTooltip
anchors.fill: parent
text: qsTr("Close this wallet and return to main menu") + translationManager.emptyString
}
MouseArea {
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onEntered: parent.color = MoneroComponents.Style.titleBarButtonHoverColor
onExited: parent.color = "transparent"
onEntered: {
parent.color = MoneroComponents.Style.titleBarButtonHoverColor
btnCloseWalletTooltip.tooltipPopup.open()
}
onExited: {
parent.color = "transparent"
btnCloseWalletTooltip.tooltipPopup.close()
}
onClicked: root.closeWalletClicked(leftPanel.visible)
}
}
@ -138,12 +150,24 @@ Rectangle {
opacity: 0.75
}
MoneroComponents.Tooltip {
id: btnLanguageToggleTooltip
anchors.fill: parent
text: qsTr("Change language") + translationManager.emptyString
}
MouseArea {
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onEntered: parent.color = MoneroComponents.Style.titleBarButtonHoverColor
onExited: parent.color = "transparent"
onEntered: {
parent.color = MoneroComponents.Style.titleBarButtonHoverColor
btnLanguageToggleTooltip.tooltipPopup.open()
}
onExited: {
parent.color = "transparent"
btnLanguageToggleTooltip.tooltipPopup.close()
}
onClicked: root.languageClicked()
}
}
@ -165,12 +189,24 @@ Rectangle {
opacity: 0.75
}
MoneroComponents.Tooltip {
id: btnSwitchThemeTooltip
anchors.fill: parent
text: MoneroComponents.Style.blackTheme ? qsTr("Switch to light theme") : qsTr("Switch to dark theme") + translationManager.emptyString
}
MouseArea {
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onEntered: parent.color = MoneroComponents.Style.titleBarButtonHoverColor
onExited: parent.color = "transparent"
onEntered: {
parent.color = MoneroComponents.Style.titleBarButtonHoverColor
btnSwitchThemeTooltip.tooltipPopup.open()
}
onExited: {
parent.color = "transparent"
btnSwitchThemeTooltip.tooltipPopup.close()
}
onClicked: {
MoneroComponents.Style.blackTheme = !MoneroComponents.Style.blackTheme;
}

28
components/Tooltip.qml
View File

@ -35,14 +35,19 @@ import "." as MoneroComponents
Rectangle {
property alias text: tooltip.text
property alias tooltipPopup: popup
property bool tooltipIconVisible: false
property bool tooltipLeft: false
property bool tooltipBottom: tooltipIconVisible ? false : true
color: "transparent"
height: icon.height
width: icon.width
height: tooltipIconVisible ? icon.height : parent.height
width: tooltipIconVisible ? icon.width : parent.width
visible: text != ""
Text {
id: icon
visible: tooltipIconVisible
color: MoneroComponents.Style.orange
font.family: FontAwesome.fontFamily
font.pixelSize: 10
@ -62,8 +67,9 @@ Rectangle {
}
}
Popup {
ToolTip {
id: popup
height: tooltip.height + 20
background: Rectangle {
border.color: MoneroComponents.Style.buttonInlineBackgroundColor
@ -73,8 +79,20 @@ Rectangle {
}
closePolicy: Popup.NoAutoClose
padding: 10
x: icon.x + icon.width
y: icon.y - height
x: tooltipLeft
? (tooltipIconVisible ? icon.x - icon.width : parent.x - tooltip.width - 20 + parent.width/2)
: (tooltipIconVisible ? icon.x + icon.width : parent.x + parent.width/2)
y: tooltipBottom
? (tooltipIconVisible ? icon.y + height : parent.y + parent.height + 2)
: (tooltipIconVisible ? icon.y - height : parent.y - tooltip.height - 20)
enter: Transition {
NumberAnimation { property: "opacity"; from: 0.0; to: 1.0; duration: 150 }
}
exit: Transition {
NumberAnimation { property: "opacity"; from: 1.0; to: 0.0; duration: 150 }
}
delay: 200
RowLayout {
Text {

2
pages/Account.qml
View File

@ -304,6 +304,7 @@ Rectangle {
opacity: 0.5
Layout.preferredWidth: 23
Layout.preferredHeight: 21
tooltip: qsTr("Edit account label") + translationManager.emptyString
onClicked: pageAccount.renameSubaddressAccountLabel(index);
}
@ -317,6 +318,7 @@ Rectangle {
opacity: 0.5
Layout.preferredWidth: 16
Layout.preferredHeight: 21
tooltip: qsTr("Copy address to clipboard") + translationManager.emptyString
onClicked: {
console.log("Address copied to clipboard");

3
pages/AddressBook.qml
View File

@ -210,6 +210,7 @@ Rectangle {
opacity: 0.5
Layout.preferredWidth: 20
Layout.preferredHeight: 20
tooltip: qsTr("Send to this address") + translationManager.emptyString
onClicked: {
doSend();
}
@ -222,6 +223,7 @@ Rectangle {
opacity: 0.5
Layout.preferredWidth: 23
Layout.preferredHeight: 21
tooltip: qsTr("Edit address label") + translationManager.emptyString
onClicked: {
addressBookListView.currentIndex = index;
@ -236,6 +238,7 @@ Rectangle {
Layout.preferredHeight: 21
color: MoneroComponents.Style.defaultFontColor
opacity: 0.5
tooltip: qsTr("Copy address to clipboard") + translationManager.emptyString
onClicked: {
console.log("Address copied to clipboard");

24
pages/History.qml
View File

@ -958,6 +958,8 @@ Rectangle {
label.font.family: FontAwesome.fontFamily
fontSize: 18
width: 34
tooltip: qsTr("Transaction details") + translationManager.emptyString
tooltipLeft: true
MouseArea {
state: "details"
@ -965,8 +967,14 @@ Rectangle {
hoverEnabled: true
z: parent.z + 1
onEntered: parent.opacity = 0.8;
onExited: parent.opacity = 1.0;
onEntered: {
parent.opacity = 0.8;
parent.tooltipPopup.open()
}
onExited: {
parent.opacity = 1.0;
parent.tooltipPopup.close()
}
}
}
@ -988,6 +996,8 @@ Rectangle {
label.font.family: FontAwesome.fontFamilyBrands
fontSize: 18
width: 34
tooltip: qsTr("Generate payment proof") + translationManager.emptyString
tooltipLeft: true
MouseArea {
state: "proof"
@ -995,8 +1005,14 @@ Rectangle {
hoverEnabled: true
z: parent.z + 1
onEntered: parent.opacity = 0.8;
onExited: parent.opacity = 1.0;
onEntered: {
parent.opacity = 0.8;
parent.tooltipPopup.open()
}
onExited: {
parent.opacity = 1.0;
parent.tooltipPopup.close()
}
}
}
}

2
pages/Receive.qml
View File

@ -192,6 +192,7 @@ Rectangle {
Layout.preferredWidth: 23
Layout.preferredHeight: 21
visible: index !== 0
tooltip: qsTr("Edit address label") + translationManager.emptyString
onClicked: {
renameSubaddressLabel(index);
@ -207,6 +208,7 @@ Rectangle {
opacity: 0.5
Layout.preferredWidth: 16
Layout.preferredHeight: 21
tooltip: qsTr("Copy address to clipboard") + translationManager.emptyString
onClicked: {
console.log("Address copied to clipboard");

7
pages/Transfer.qml
View File

@ -277,6 +277,7 @@ Rectangle {
fontStyleName: "Solid"
fontPixelSize: 18
text: FontAwesome.desktop
tooltip: qsTr("Grab QR code from screen") + translationManager.emptyString
onClicked: {
clearFields();
const codes = oshelper.grabQrCodesFromScreen();
@ -295,6 +296,7 @@ Rectangle {
fontStyleName: "Solid"
text: FontAwesome.qrcode
visible: appWindow.qrScannerEnabled
tooltip: qsTr("Scan QR code") + translationManager.emptyString
onClicked: {
cameraUi.state = "Capture"
cameraUi.qrcode_decoded.connect(updateFromQrCode)
@ -304,6 +306,7 @@ Rectangle {
MoneroComponents.InlineButton {
fontFamily: FontAwesome.fontFamily
text: FontAwesome.addressBook
tooltip: qsTr("Import from address book") + translationManager.emptyString
onClicked: {
middlePanel.addressBookView.selectAndSend = true;
appWindow.showPageRequest("AddressBook");
@ -483,12 +486,16 @@ Rectangle {
horizontalAlignment: Text.AlignHCenter
opacity: mouseArea.containsMouse ? 1 : 0.85
text: recipientModel.count == 1 ? FontAwesome.infinity : FontAwesome.times
tooltip: recipientModel.count == 1 ? qsTr("Send all unlocked balance of this account") : qsTr("Remove recipient") + translationManager.emptyString
tooltipLeft: true
MouseArea {
id: mouseArea
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
hoverEnabled: true
onEntered: parent.tooltipPopup.open()
onExited: parent.tooltipPopup.close()
onClicked: {
if (recipientModel.count == 1) {
parent.parent.children[2].text = "(all)";