mirror of
https://github.com/monero-project/monero-gui
synced 2024-11-16 14:55:33 +01:00
Implement tooltips in multiple pages and components
This commit is contained in:
parent
937cb98256
commit
9d3864b7f0
@ -22,6 +22,7 @@ RowLayout {
|
||||
MoneroComponents.Label {
|
||||
id: title
|
||||
fontSize: 14
|
||||
tooltipIconVisible: true
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
|
@ -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()
|
||||
}
|
||||
|
@ -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
|
||||
}
|
||||
|
@ -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";
|
||||
}
|
||||
|
@ -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: ""
|
||||
|
@ -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)
|
||||
}
|
||||
}
|
||||
|
@ -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
|
||||
}
|
||||
|
||||
|
@ -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
|
||||
}
|
||||
}
|
||||
|
@ -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;
|
||||
}
|
||||
|
@ -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 {
|
||||
|
@ -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");
|
||||
|
@ -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");
|
||||
|
@ -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()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -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");
|
||||
|
@ -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)";
|
||||
|
Loading…
Reference in New Issue
Block a user