From b97bde4cc5af55deafef663c82c04c95496e33d2 Mon Sep 17 00:00:00 2001 From: Yang Wang <yang.wang@savoirfairelinux.com> Date: Fri, 7 Aug 2020 11:24:18 -0400 Subject: [PATCH] tooltip: add tool tips to qt client Change-Id: I7aeb96f4c8a09a8b8c0b8e6534079e3fa3965941 --- src/commoncomponents/HoverableButton.qml | 8 +++++++- .../HoverableButtonTextItem.qml | 6 ++++++ .../HoverableRadiusButton.qml | 9 ++++++--- src/commoncomponents/PhotoboothView.qml | 10 +++++++--- src/mainview/components/AccountComboBox.qml | 6 ++++++ .../components/CallOverlayButtonGroup.qml | 12 ++++++++++++ src/mainview/components/OutgoingCallPage.qml | 2 ++ src/settingsview/components/AvSettingPage.qml | 16 ++++++++++------ .../CurrentAccountSettingsScrollPage.qml | 15 +++++++++++++++ .../CurrentSIPAccountSettingScrollPage.qml | 3 +++ .../components/GeneralSettingsPage.qml | 19 ++++++++++++++++--- .../components/PluginSettingsPage.qml | 2 ++ .../components/SettingParaCombobox.qml | 6 ++++++ src/settingsview/components/ToggleSwitch.qml | 7 +++++++ src/wizardview/WizardView.qml | 6 ++++++ .../components/HoverableGradientButton.qml | 13 ++++++++----- .../components/WelcomePageLayout.qml | 16 ++++++++++++++++ 17 files changed, 135 insertions(+), 21 deletions(-) diff --git a/src/commoncomponents/HoverableButton.qml b/src/commoncomponents/HoverableButton.qml index 2b04f9b13..420b58154 100644 --- a/src/commoncomponents/HoverableButton.qml +++ b/src/commoncomponents/HoverableButton.qml @@ -53,10 +53,16 @@ Button { property var baseColor: null property alias color: hoverableButton.baseColor + property string toolTipText: "" + font.pointSize: fontPointSize hoverEnabled: true + ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval + ToolTip.visible: hovered && (toolTipText.length > 0) + ToolTip.text: toolTipText + background: Rectangle { id: hoverableButtonBackground @@ -90,7 +96,7 @@ Button { MouseArea { anchors.fill: parent - hoverEnabled: false + hoverEnabled: hoverableButton.hoverEnabled onPressed: { hoverableButtonBackground.color = onPressColor diff --git a/src/commoncomponents/HoverableButtonTextItem.qml b/src/commoncomponents/HoverableButtonTextItem.qml index fc1d6bb00..5ce9cebc1 100644 --- a/src/commoncomponents/HoverableButtonTextItem.qml +++ b/src/commoncomponents/HoverableButtonTextItem.qml @@ -46,11 +46,17 @@ Button { property alias radius: hoverableButtonBackground.radius property alias source: hoverableButtonImage.source + property string toolTipText: "" + font.pointSize: fontPointSize font.kerning: true hoverEnabled: true + ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval + ToolTip.visible: hovered && (toolTipText.length > 0) + ToolTip.text: toolTipText + contentItem: Text { text: hoverableButton.text font: hoverableButton.font diff --git a/src/commoncomponents/HoverableRadiusButton.qml b/src/commoncomponents/HoverableRadiusButton.qml index ef98e075c..cdea4ef13 100644 --- a/src/commoncomponents/HoverableRadiusButton.qml +++ b/src/commoncomponents/HoverableRadiusButton.qml @@ -40,7 +40,7 @@ Button { property string onExitColor: backgroundColor property alias radius: hoverableButtonBackground.radius property alias source: hoverableButtonImage.source - property bool isHovering: false + property string toolTipText: "" radius: height / 2 function enterBtn(){ btnMouseArea.entered() @@ -54,6 +54,11 @@ Button { function releaseBtn(){ btnMouseArea.released() } + + ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval + ToolTip.visible: hovered && (toolTipText.length > 0) + ToolTip.text: toolTipText + font.pointSize: fontPointSize font.kerning: true hoverEnabled: true @@ -82,11 +87,9 @@ Button { } onEntered: { hoverableButtonBackground.color = onEnterColor - isHovering = true } onExited: { hoverableButtonBackground.color = onExitColor - isHovering = false } } } diff --git a/src/commoncomponents/PhotoboothView.qml b/src/commoncomponents/PhotoboothView.qml index 3a76bc8be..7cf14ab7d 100644 --- a/src/commoncomponents/PhotoboothView.qml +++ b/src/commoncomponents/PhotoboothView.qml @@ -206,19 +206,21 @@ ColumnLayout{ font.pointSize: 10 font.kerning: true + toolTipText: qsTr("Press this button to take photo") + radius: height / 6 source: { - if(isDefaultIcon){ - return addPhotoIconUrl - } if(takePhotoState) { + toolTipText = qsTr("Press this button to finish taking photo") return cameraAltIconUrl } if(hasAvatar){ + toolTipText = qsTr("Press this button to retake photo") return refreshIconUrl } else { + toolTipText = qsTr("Press this button to take photo") return addPhotoIconUrl } } @@ -267,6 +269,8 @@ ColumnLayout{ radius: height / 6 source: "qrc:/images/icons/round-folder-24px.svg" + toolTipText: qsTr("Import avatar from image file") + onClicked: { importFromFileToAvatar_Dialog.open() } diff --git a/src/mainview/components/AccountComboBox.qml b/src/mainview/components/AccountComboBox.qml index fac5b11aa..e0529fd7c 100644 --- a/src/mainview/components/AccountComboBox.qml +++ b/src/mainview/components/AccountComboBox.qml @@ -221,6 +221,9 @@ ComboBox { width: 24 height: 24 + toolTipText: qsTr("Press to display QR code") + hoverEnabled: true + source: "qrc:/images/qrcode.png" backgroundColor: "white" onClicked: { @@ -243,6 +246,9 @@ ComboBox { source: !mainViewWindow.inSettingsView ? "qrc:/images/icons/round-settings-24px.svg" : "qrc:/images/icons/round-close-24px.svg" + toolTipText: !mainViewWindow.inSettingsView ?qsTr("Press to toggle to settings page") : qsTr("Press to toggle to call page") + hoverEnabled: true + backgroundColor: "white" onClicked: { settingBtnClicked() diff --git a/src/mainview/components/CallOverlayButtonGroup.qml b/src/mainview/components/CallOverlayButtonGroup.qml index 49511f32c..c360a7cda 100644 --- a/src/mainview/components/CallOverlayButtonGroup.qml +++ b/src/mainview/components/CallOverlayButtonGroup.qml @@ -97,6 +97,8 @@ Rectangle { checkedColor: JamiTheme.declineButtonPressedRed radius: 30 + toolTipText: !checked ? qsTr("Press to mute the call") : qsTr("Press to unmute the call") + onClicked: { CallAdapter.muteThisCallToggle() } @@ -120,6 +122,8 @@ Rectangle { color: "white" radius: 30 + toolTipText: qsTr("Press to hang up the call") + onClicked: { CallAdapter.hangUpThisCall() } @@ -145,6 +149,8 @@ Rectangle { checkedColor: JamiTheme.declineButtonPressedRed radius: 30 + toolTipText: !checked ? qsTr("Press to pause the call") : qsTr("Press to resume the call") + onClicked: { CallAdapter.videoPauseThisCallToggle() } @@ -173,6 +179,8 @@ Rectangle { source: "qrc:/images/icons/ic_group_add_white_24dp.png" radius: 30 + toolTipText: qsTr("Press to add more contact into conference call") + onClicked: { root.addToConferenceButtonClicked() } @@ -196,6 +204,8 @@ Rectangle { source: "qrc:/images/icons/ic_chat_white_24dp.png" radius: 30 + toolTipText: qsTr("Press to toggle open the chatview") + onClicked: { root.chatButtonClicked() } @@ -218,6 +228,8 @@ Rectangle { source: "qrc:/images/icons/more_vert-24px.svg" radius: 30 + toolTipText: qsTr("Press to open chat options") + onClicked: { var rectPos = mapToItem(callStackViewWindow, optionsButton.x, optionsButton.y) callViewContextMenu.activate() diff --git a/src/mainview/components/OutgoingCallPage.qml b/src/mainview/components/OutgoingCallPage.qml index 79866183a..c3a4fd51d 100644 --- a/src/mainview/components/OutgoingCallPage.qml +++ b/src/mainview/components/OutgoingCallPage.qml @@ -190,6 +190,8 @@ Rectangle { source: "qrc:/images/icons/ic_close_white_24dp.png" radius: 30 + toolTipText: qsTr("Cancel the call") + onClicked: { outgoingCallPageRect.callCancelButtonIsClicked() } diff --git a/src/settingsview/components/AvSettingPage.qml b/src/settingsview/components/AvSettingPage.qml index d6451e937..64a9f1cdc 100644 --- a/src/settingsview/components/AvSettingPage.qml +++ b/src/settingsview/components/AvSettingPage.qml @@ -281,6 +281,8 @@ Rectangle { source: "qrc:/images/icons/ic_arrow_back_24px.svg" backgroundColor: "white" onExitColor: "white" + toolTipText: qsTr("Toggle to display side panel") + hoverEnabled: true visible: mainViewWindow.sidePanelHidden @@ -381,9 +383,8 @@ Rectangle { font.kerning: true model: audioInputDeviceModel - textRole: "ID_UTF8" - + tooltipText: qsTr("Audio input device selector") onActivated: { slotAudioInputIndexChanged(index) } @@ -436,9 +437,8 @@ Rectangle { font.kerning: true model: audioOutputDeviceModel - textRole: "ID_UTF8" - + tooltipText: qsTr("Choose the audio output device") onActivated: { slotAudioOutputIndexChanged(index) } @@ -478,7 +478,7 @@ Rectangle { model: audioOutputDeviceModel textRole: "ID_UTF8" - + tooltipText: qsTr("Choose the ringtone output device") onActivated: { slotRingtoneDeviceIndexChanged(index) } @@ -580,7 +580,7 @@ Rectangle { model: videoInputDeviceModel textRole: "DeviceName_UTF8" - + tooltipText: qsTr("Video device selector") onActivated: { slotDeviceBoxCurrentIndexChanged(index) } @@ -620,6 +620,8 @@ Rectangle { model: videoFormatResolutionModel textRole: "Resolution_UTF8" + tooltipText: qsTr("Video device resolution selector") + onActivated: { slotFormatCurrentIndexChanged(index,true) } @@ -659,6 +661,8 @@ Rectangle { model: videoFormatFpsModel textRole: "FPS_ToDisplay_UTF8" + tooltipText: qsTr("Video device fps selector") + onActivated: { slotFormatCurrentIndexChanged(index,false) } diff --git a/src/settingsview/components/CurrentAccountSettingsScrollPage.qml b/src/settingsview/components/CurrentAccountSettingsScrollPage.qml index d7ba3cafd..d2847d04a 100644 --- a/src/settingsview/components/CurrentAccountSettingsScrollPage.qml +++ b/src/settingsview/components/CurrentAccountSettingsScrollPage.qml @@ -474,6 +474,8 @@ Rectangle { source: "qrc:/images/icons/ic_arrow_back_24px.svg" backgroundColor: "white" onExitColor: "white" + toolTipText: qsTr("Toggle to display side panel") + hoverEnabled: true visible: mainViewWindow.sidePanelHidden @@ -858,6 +860,8 @@ Rectangle { font.pointSize: JamiTheme.buttonFontSize font.kerning: true + toolTipText: qsTr("Register the name as typed") + radius: height / 2 } } @@ -887,6 +891,7 @@ Rectangle { text: ClientWrapper.accountAdaptor.hasPassword() ? qsTr("Change Password") : qsTr("Set Password") + toolTipText: ClientWrapper.accountAdaptor.hasPassword() ? qsTr("Change the current password") : qsTr("Currently no password, press this button to set a password") font.pointSize: JamiTheme.textFontSize font.kerning: true @@ -910,6 +915,8 @@ Rectangle { Layout.preferredHeight: JamiTheme.preferredFieldHeight Layout.maximumHeight: JamiTheme.preferredFieldHeight + toolTipText: qsTr("Press this button to export account to a .gz file") + text: qsTr("Export Account") font.pointSize: JamiTheme.textFontSize font.kerning: true @@ -940,6 +947,8 @@ Rectangle { Layout.preferredHeight: JamiTheme.preferredFieldHeight Layout.maximumHeight: JamiTheme.preferredFieldHeight + toolTipText: qsTr("Press this button to delete this account") + text: qsTr("Delete Account") font.pointSize: JamiTheme.textFontSize font.kerning: true @@ -1021,6 +1030,8 @@ Rectangle { radius: height / 2 + toolTipText: qsTr("Press to link one more device with this account") + text: qsTr("+ Link Another Device") font.pointSize: JamiTheme.textFontSize font.kerning: true @@ -1076,6 +1087,8 @@ Rectangle { radius: height / 2 + toolTipText: qsTr("press to open or hide display of banned contact") + source: bannedContactsListWidget.visible? "qrc:/images/icons/round-arrow_drop_up-24px.svg" : "qrc:/images/icons/round-arrow_drop_down-24px.svg" onClicked: { @@ -1164,6 +1177,8 @@ Rectangle { radius: height / 2 + toolTipText: qsTr("Press to display or hide advance settings") + source: { if (advanceSettingsView.visible) { return "qrc:/images/icons/round-arrow_drop_up-24px.svg" diff --git a/src/settingsview/components/CurrentSIPAccountSettingScrollPage.qml b/src/settingsview/components/CurrentSIPAccountSettingScrollPage.qml index eb5aaaba6..a4b67ec41 100644 --- a/src/settingsview/components/CurrentSIPAccountSettingScrollPage.qml +++ b/src/settingsview/components/CurrentSIPAccountSettingScrollPage.qml @@ -122,6 +122,8 @@ Rectangle { backgroundColor: "white" onExitColor: "white" + toolTipText: qsTr("Toggle to display side panel") + hoverEnabled: true visible: mainViewWindow.sidePanelHidden onClicked: { @@ -420,6 +422,7 @@ Rectangle { Layout.maximumHeight: JamiTheme.preferredFieldHeight text: qsTr("Delete Account") + toolTipText: qsTr("Delete this account") font.pointSize: JamiTheme.textFontSize font.kerning: true radius: height / 2 diff --git a/src/settingsview/components/GeneralSettingsPage.qml b/src/settingsview/components/GeneralSettingsPage.qml index 008ba6b99..412612f9e 100644 --- a/src/settingsview/components/GeneralSettingsPage.qml +++ b/src/settingsview/components/GeneralSettingsPage.qml @@ -194,7 +194,8 @@ Rectangle { source: "qrc:/images/icons/ic_arrow_back_24px.svg" backgroundColor: "white" onExitColor: "white" - + toolTipText: qsTr("Toggle to display side panel") + hoverEnabled: true visible: mainViewWindow.sidePanelHidden onClicked: { @@ -273,6 +274,8 @@ Rectangle { labelText: desktopNotificationsElidedText.elidedText fontPointSize: JamiTheme.settingsFontSize + tooltipText: qsTr("toggle enable notifications") + onSwitchToggled: { slotSetNotifications(checked) } @@ -292,6 +295,8 @@ Rectangle { labelText: keepMinimizeElidedText.elidedText fontPointSize: JamiTheme.settingsFontSize + tooltipText: qsTr("toggle keep minimized on close") + onSwitchToggled: { slotSetClosedOrMin(checked) } @@ -311,6 +316,8 @@ Rectangle { labelText: runOnStartupElidedText.elidedText fontPointSize: JamiTheme.settingsFontSize + tooltipText: qsTr("toggle run application on system startup") + onSwitchToggled: { slotSetRunOnStartUp(checked) } @@ -359,6 +366,7 @@ Rectangle { icon.height: 24 icon.width: 24 + toolTipText: qsTr("Press to choose download folder path") text: downloadPath fontPointSize: JamiTheme.buttonFontSize @@ -529,6 +537,7 @@ Rectangle { icon.height: 24 icon.width: 24 + toolTipText: qsTr("Press to choose record folder path") text: recordPath fontPointSize: JamiTheme.buttonFontSize @@ -571,6 +580,8 @@ Rectangle { labelText: autoUpdateText.elidedText fontPointSize: JamiTheme.settingsFontSize + tooltipText: qsTr("toggle automatic updates") + onSwitchToggled: { slotSetUpdateAutomatic(checked) } @@ -596,7 +607,8 @@ Rectangle { radius: height / 2 - text: qsTr("Check for updates now") + toolTipText: qsTr("Check for updates now") + text: qsTr("Updates") fontPointSize: JamiTheme.buttonFontSize onClicked: { @@ -617,7 +629,8 @@ Rectangle { radius: height / 2 - text: "Install the latest beta version" + toolTipText: qsTr("Install the latest beta version") + text: qsTr("Beta Install") fontPointSize: JamiTheme.buttonFontSize onClicked: { diff --git a/src/settingsview/components/PluginSettingsPage.qml b/src/settingsview/components/PluginSettingsPage.qml index 636b8106f..293bfc41b 100644 --- a/src/settingsview/components/PluginSettingsPage.qml +++ b/src/settingsview/components/PluginSettingsPage.qml @@ -74,6 +74,8 @@ Rectangle { backgroundColor: "white" onExitColor: "white" + toolTipText: qsTr("Toggle to display side panel") + hoverEnabled: true visible: mainViewWindow.sidePanelHidden onClicked: { diff --git a/src/settingsview/components/SettingParaCombobox.qml b/src/settingsview/components/SettingParaCombobox.qml index dc447a654..19fe92263 100644 --- a/src/settingsview/components/SettingParaCombobox.qml +++ b/src/settingsview/components/SettingParaCombobox.qml @@ -28,6 +28,12 @@ import "../../constant" ComboBox { id: control + property string tooltipText:"" + + ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval + ToolTip.visible: hovered && (tooltipText.length > 0) + ToolTip.text: tooltipText + delegate: ItemDelegate { width: control.width contentItem: Text { diff --git a/src/settingsview/components/ToggleSwitch.qml b/src/settingsview/components/ToggleSwitch.qml index 3b9d0f12d..cd4f5a449 100644 --- a/src/settingsview/components/ToggleSwitch.qml +++ b/src/settingsview/components/ToggleSwitch.qml @@ -32,6 +32,8 @@ RowLayout { property int heightOfLayout: 30 property int fontPointSize: 13 + property string tooltipText: "" + property alias toggleSwitch: switchOfLayout property alias checked: switchOfLayout.checked @@ -66,6 +68,11 @@ RowLayout { Layout.preferredHeight: heightOfSwitch Layout.maximumHeight: heightOfSwitch + hoverEnabled: true + ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval + ToolTip.visible: hovered && (tooltipText.length > 0) + ToolTip.text: tooltipText + onToggled: { switchToggled() } diff --git a/src/wizardview/WizardView.qml b/src/wizardview/WizardView.qml index 0f3c29da7..3277ec419 100644 --- a/src/wizardview/WizardView.qml +++ b/src/wizardview/WizardView.qml @@ -611,6 +611,8 @@ Window { font.pointSize: 10 font.kerning: true + toolTipText: qsTr("Previous page button") + onClicked: { // stop photobooth previewing if(controlPanelStackView.currentIndex == controlPanelStackView.createAccountPageId) { @@ -662,6 +664,8 @@ Window { font.pointSize: 10 font.kerning: true + toolTipText: qsTr("Cancel account create/link") + onClicked: { wizardViewWindow.hide() needToShowMainViewWindow(addedAccountIndex) @@ -696,6 +700,8 @@ Window { font.pointSize: 10 font.kerning: true + toolTipText: qsTr("Next page button") + onClicked: { // stop photobooth previewing if(controlPanelStackView.currentIndex == controlPanelStackView.createAccountPageId) { diff --git a/src/wizardview/components/HoverableGradientButton.qml b/src/wizardview/components/HoverableGradientButton.qml index 905bd41b6..8b1ebd260 100644 --- a/src/wizardview/components/HoverableGradientButton.qml +++ b/src/wizardview/components/HoverableGradientButton.qml @@ -50,9 +50,10 @@ Button { property string onExitColor: backgroundColor property string textColor: "white" + property string toolTipText: "" + property alias radius: hoverableButtonBackground.radius - property bool isHovering: false property bool isBeingPressed: false radius: height / 2 @@ -60,6 +61,10 @@ Button { font.kerning: true hoverEnabled: true + ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval + ToolTip.visible: hovered && (toolTipText.length > 0) + ToolTip.text: toolTipText + contentItem: Text { text: hoverableButton.text font: hoverableButton.font @@ -89,11 +94,9 @@ Button { } onEntered: { hoverableButtonBackground.color = onEnterColor - isHovering = true } onExited: { hoverableButtonBackground.color = onExitColor - isHovering = false } } } @@ -114,7 +117,7 @@ Button { if(isBeingPressed){ return startColorPressed } else { - if(isHovering){ + if(hoverableButton.hovered){ return startColorHovered } else { return startColor @@ -130,7 +133,7 @@ Button { if(isBeingPressed){ return endColorPressed } else { - if(isHovering){ + if(hoverableButton.hovered){ return endColorHovered } else { return endColor diff --git a/src/wizardview/components/WelcomePageLayout.qml b/src/wizardview/components/WelcomePageLayout.qml index 3c7190b0e..0bff7aef0 100644 --- a/src/wizardview/components/WelcomePageLayout.qml +++ b/src/wizardview/components/WelcomePageLayout.qml @@ -102,6 +102,8 @@ ColumnLayout { font.kerning: true radius: height / 2 + toolTipText: qsTr("Create new Jami account") + onClicked: { welcomePageRedirectPage(1) } @@ -125,6 +127,8 @@ ColumnLayout { backgroundColor: JamiTheme.releaseColor radius: height / 2 + toolTipText: qsTr("Import account from other device") + onClicked: { welcomePageRedirectPage(5) } @@ -148,6 +152,8 @@ ColumnLayout { backgroundColor: JamiTheme.releaseColor radius: height / 2 + toolTipText: qsTr("Import account from backup file") + onClicked: { welcomePageRedirectPage(3) } @@ -175,6 +181,12 @@ ColumnLayout { radius: height /2 } + hoverEnabled: true + + ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval + ToolTip.visible: hovered + ToolTip.text: qsTr("Show advanced options") + onClicked: { connectAccountManagerButton.visible = !connectAccountManagerButton.visible newSIPAccountButton.visible = !newSIPAccountButton.visible @@ -200,6 +212,8 @@ ColumnLayout { backgroundColor: JamiTheme.releaseColor radius: height / 2 + toolTipText: qsTr("Login to account manager") + onClicked: { welcomePageRedirectPage(6) } @@ -224,6 +238,8 @@ ColumnLayout { radius: height / 2 backgroundColor: JamiTheme.releaseColor + toolTipText: qsTr("Create new SIP account") + onClicked: { welcomePageRedirectPage(2) } -- GitLab