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

Add tooltips to buttons and room invite button

Browse Source
This commit is contained in:
miruka 2019-08-22 09:27:26 -04:00
parent 3082c64666
commit 627a186700
10 changed files with 75 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/icons/light-thin/room-send-invite.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M9.602 3.7c-1.154 1.937-.635 5.227 1.424 9.025.93 1.712.697 3.02.338 3.815-.982 2.178-3.675 2.799-6.525 3.456-1.964.454-1.839.87-1.839 4.004h-1.995l-.005-1.241c0-2.52.199-3.975 3.178-4.663 3.365-.777 6.688-1.473 5.09-4.418-4.733-8.729-1.35-13.678 3.732-13.678 3.321 0 5.97 2.117 5.97 6.167 0 3.555-1.949 6.833-2.383 7.833h-2.115c.392-1.536 2.499-4.366 2.499-7.842 0-5.153-5.867-4.985-7.369-2.458zm13.398 15.3h-3v-3h-2v3h-3v2h3v3h2v-3h3v-2z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 540 B

15
src/qml/Base/HAvatar.qml
View File

@ -50,9 +50,7 @@ HRectangle {
fillMode: Image.PreserveAspectCrop
source: Qt.resolvedUrl(imageUrl)
HoverHandler {
id: hoverHandler
}
HoverHandler { id: hoverHandler }
HToolTip {
id: avatarToolTip
@ -65,17 +63,10 @@ HRectangle {
height: width
delay: 1000
background: HRectangle {
id: background
border.color: "black"
border.width: 2
}
HImage {
id: avatarToolTipImage
anchors.centerIn: parent
sourceSize.width: parent.width - background.border.width * 2
sourceSize.height: parent.height - background.border.width * 2
sourceSize.width: parent.width
sourceSize.height: parent.height
width: sourceSize.width
height: sourceSize.width
fillMode: Image.PreserveAspectCrop

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

@ -21,6 +21,11 @@ Button {
property bool loading: false
property bool circle: false
property HToolTip toolTip: HToolTip {
id: toolTip
visible: text && hovered
}
background: HButtonBackground {
button: button

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

@ -5,9 +5,9 @@ MenuItem {
id: menuItem
spacing: theme.spacing
leftPadding: spacing
rightPadding: spacing
rightPadding: leftPadding
topPadding: spacing / 1.75
bottomPadding: spacing / 1.75
bottomPadding: topPadding
height: visible ? implicitHeight : 0

25
src/qml/Base/HToolTip.qml
View File

@ -2,12 +2,25 @@ import QtQuick 2.12
import QtQuick.Controls 2.12
ToolTip {
// Be sure to have a width and height set, to prevent the tooltip from
// going out of the window's boundaries
id: toolTip
delay: 150
padding: 0
delay: theme.controls.toolTip.delay
padding: background.border.width
background: HRectangle {
id: background
color: theme.controls.toolTip.background
border.color: theme.controls.toolTip.border
border.width: theme.controls.toolTip.borderWidth
}
contentItem: HLabel {
color: theme.controls.toolTip.text
text: toolTip.text
leftPadding: theme.spacing / 1.5
rightPadding: leftPadding
topPadding: theme.spacing / 2
bottomPadding: topPadding
}
enter: Transition {
HNumberAnimation { property: "opacity"; from: 0.0; to: 1.0 }
@ -21,6 +34,6 @@ ToolTip {
}
HoverHandler {
onHoveredChanged: if (!hovered) { toolTip.hide() }
onHoveredChanged: if (! hovered) toolTip.hide()
}
}

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

@ -80,6 +80,10 @@ HRectangle {
height: parent.height
autoExclusive: true
checked: activeButton == modelData
enabled: modelData == "members"
toolTip.text: qsTr(
modelData.charAt(0).toUpperCase() + modelData.slice(1)
)
onClicked: activeButton =
activeButton == modelData ? null : modelData
}

18
src/qml/Chat/RoomSidePane/MembersView.qml
View File

@ -40,15 +40,29 @@ HColumnLayout {
}
}
HRowLayout {
Layout.minimumHeight: theme.baseElementsHeight
Layout.maximumHeight: Layout.minimumHeight
HTextField {
id: filterField
placeholderText: qsTr("Filter members")
backgroundColor: theme.sidePane.filterRooms.background
backgroundColor: theme.chat.roomSidePane.filterMembers.background
bordered: false
onTextChanged: filterLimiter.requestFire()
Layout.fillWidth: true
Layout.preferredHeight: theme.baseElementsHeight
Layout.fillHeight: true
}
HButton {
icon.name: "room-send-invite"
iconItem.dimension: parent.height
toolTip.text: qsTr("Invite to this room")
backgroundColor: theme.chat.roomSidePane.inviteButton.background
Layout.fillHeight: true
}
}
}

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

@ -58,6 +58,7 @@ HTileDelegate {
backgroundColor: "transparent"
padding: sidePane.currentSpacing / 1.5
rightPadding: leftPadding
toolTip.text: collapsed ? qsTr("Expand") : qsTr("Collapse")
onClicked: accountDelegate.toggleCollapse()
visible: opacity > 0

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

@ -9,14 +9,16 @@ HRowLayout {
property alias roomFilter: filterField.text
Layout.fillWidth: true
Layout.preferredHeight: theme.baseElementsHeight
Layout.minimumHeight: theme.baseElementsHeight
Layout.maximumHeight: Layout.minimumHeight
HButton {
icon.name: "add-account"
toolTip.text: qsTr("Add another account")
backgroundColor: theme.sidePane.settingsButton.background
onClicked: pageLoader.showPage("SignIn")
Layout.preferredHeight: parent.height
Layout.fillHeight: true
}
HTextField {
@ -26,7 +28,7 @@ HRowLayout {
bordered: false
Layout.fillWidth: true
Layout.preferredHeight: parent.height
Layout.fillHeight: true
onTextChanged: {
if (window.uiState.sidePaneFilter == text) return

13
src/themes/Default.qpl
View File

@ -136,6 +136,13 @@ controls:
color background: colors.inputBackground
color text: colors.text
toolTip:
int delay: 500
color background: colors.inputBackground
color text: colors.text
color border: "black"
int borderWidth: 2
avatar:
int size: baseElementsHeight
int radius: theme.radius
@ -209,6 +216,12 @@ chat:
color name: colors.text
color subtitle: colors.dimText
inviteButton:
color background: colors.inputBackground
filterMembers:
color background: colors.inputBackground
eventList:
int ownEventsOnRightUnderWidth: 768
color background: "transparent"