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

Highlight account and room delegates

Browse Source
This commit is contained in:
miruka 2019-07-12 17:06:37 -04:00
parent 4b45c119ff
commit cb0d7e8a77
11 changed files with 151 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
TODO.md
View File

@ -1,3 +1,11 @@
- Qt 5.12
- New input handlers
- ECMAScript 7
- .mjs modules
- inset properties
- `ToolTip.hide()`/`show()`
- horizontal & vertical padding props
- Refactoring
- Don't bake in size properties for components

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

@ -6,7 +6,7 @@ import QtQuick.Controls 2.0
import "../Base"
import "../utils.js" as Utils
Rectangle {
HRectangle {
property string name: ""
property var imageUrl: null
property var toolTipImageUrl: imageUrl

26
src/qml/Base/HHighlightRectangle.qml Normal file
View File

@ -0,0 +1,26 @@
// Copyright 2019 miruka
// This file is part of harmonyqml, licensed under LGPLv3.
import QtQuick 2.12
HRectangle {
property bool checkable: false // TODO
property bool checked: false
property color normalColor: theme.controls.listEntry.background
property color hoveredColor: theme.controls.listEntry.hoveredBackground
property color pressedColor: theme.controls.listEntry.pressedBackground
property color checkedColor: theme.controls.listEntry.checkedBackground
color: checked ? checkedColor :
// tap.pressed ? pressedColor :
hover.hovered ? hoveredColor :
normalColor
Behavior on color {
ColorAnimation { duration: theme.animationDuration / 1.5 }
}
HoverHandler { id: hover }
TapHandler { id: tap }
}

6
src/qml/Base/HRichLabel.qml
View File

@ -24,11 +24,5 @@ HLabel {
mouse.accepted = Boolean(link)
if (link) { Qt.openUrlExternally(link) }
}
onPressAndHold: mouse.accepted = false
onDoubleClicked: mouse.accepted = false
onPressed: mouse.accepted = false
onReleased: mouse.accepted = false
onWheel: mouse.accepted = false
}
}

77
src/qml/SidePane/AccountDelegate.qml
View File

@ -13,53 +13,60 @@ Column {
property bool expanded: true
HRowLayout {
HHighlightRectangle {
width: parent.width
height: childrenRect.height
id: row
HUserAvatar {
id: avatar
// Need to do this because conflict with the model property
Component.onCompleted: userId = model.userId
}
normalColor: theme.sidePane.account.background
HColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
HRowLayout {
id: row
width: parent.width
HLabel {
id: accountLabel
text: userInfo.displayName || model.userId
elide: HLabel.ElideRight
maximumLineCount: 1
Layout.fillWidth: true
leftPadding: 6
rightPadding: leftPadding
HUserAvatar {
id: avatar
// Need to do this because conflict with the model property
Component.onCompleted: userId = model.userId
}
HTextField {
id: statusEdit
text: userInfo.statusMessage
placeholderText: qsTr("Set status message")
font.pixelSize: theme.fontSize.small
background: null
padding: 0
leftPadding: accountLabel.leftPadding
rightPadding: leftPadding
HColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
onEditingFinished: {
//Backend.setStatusMessage(model.userId, text) TODO
pageStack.forceActiveFocus()
HLabel {
id: accountLabel
text: userInfo.displayName || model.userId
elide: HLabel.ElideRight
maximumLineCount: 1
Layout.fillWidth: true
leftPadding: sidePane.currentSpacing
rightPadding: leftPadding
}
HTextField {
id: statusEdit
text: userInfo.statusMessage
placeholderText: qsTr("Set status message")
font.pixelSize: theme.fontSize.small
background: null
padding: 0
leftPadding: accountLabel.leftPadding
rightPadding: leftPadding
Layout.fillWidth: true
onEditingFinished: {
//Backend.setStatusMessage(model.userId, text) TODO
pageStack.forceActiveFocus()
}
}
}
}
ExpandButton {
expandableItem: accountDelegate
Layout.preferredHeight: row.height
ExpandButton {
id: expandButton
expandableItem: accountDelegate
Layout.preferredHeight: row.height
}
}
}

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

@ -30,6 +30,7 @@ Column {
elide: Text.ElideRight
maximumLineCount: 1
Layout.leftMargin: sidePane.currentSpacing
Layout.fillWidth: true
}

101
src/qml/SidePane/RoomDelegate.qml
View File

@ -1,71 +1,82 @@
// Copyright 2019 miruka
// This file is part of harmonyqml, licensed under LGPLv3.
import QtQuick 2.7
import QtQuick 2.12
import QtQuick.Layouts 1.3
import "../Base"
import "../utils.js" as Utils
MouseArea {
HHighlightRectangle {
id: roomDelegate
width: roomList.width
height: childrenRect.height
onClicked:
pageStack.showRoom(roomList.userId, roomList.category, model.roomId)
TapHandler {
onTapped: pageStack.showRoom(
roomList.userId, roomList.category, model.roomId
)
}
HRowLayout {
width: parent.width
spacing: sidePane.collapsed ? 0 : sidePane.normalSpacing
Row {
width: parent.width - sidePane.currentSpacing * 2
padding: sidePane.currentSpacing / 2
leftPadding: sidePane.currentSpacing
rightPadding: 0
HRoomAvatar {
id: roomAvatar
roomId: model.roomId
}
HRowLayout {
width: parent.width
spacing: sidePane.currentSpacing
HColumnLayout {
Layout.fillWidth: true
Layout.maximumWidth:
parent.width - parent.totalSpacing - roomAvatar.width
HLabel {
id: roomLabel
text: model.displayName || "<i>Empty room</i>"
textFormat: model.displayName? Text.PlainText : Text.StyledText
elide: Text.ElideRight
maximumLineCount: 1
verticalAlignment: Qt.AlignVCenter
Layout.maximumWidth: parent.width
HRoomAvatar {
id: roomAvatar
roomId: model.roomId
}
HRichLabel {
function getText(ev) {
if (! ev) { return "" }
HColumnLayout {
Layout.fillWidth: true
Layout.maximumWidth:
parent.width - parent.totalSpacing - roomAvatar.width
if (! Utils.eventIsMessage(ev)) {
return Utils.translatedEventContent(ev)
}
HLabel {
id: roomLabel
text: model.displayName || "<i>Empty room</i>"
textFormat:
model.displayName? Text.PlainText : Text.StyledText
elide: Text.ElideRight
maximumLineCount: 1
verticalAlignment: Qt.AlignVCenter
return Utils.coloredNameHtml(
users.find(ev.senderId).displayName,
ev.senderId
) + ": " + py.callSync("inlinify", [ev.content])
Layout.maximumWidth: parent.width
}
// Have to do it like this to avoid binding loop
property var lastEv: timelines.lastEventOf(model.roomId)
onLastEvChanged: text = getText(lastEv)
HRichLabel {
function getText(ev) {
if (! ev) { return "" }
id: subtitleLabel
visible: Boolean(text)
textFormat: Text.StyledText
if (! Utils.eventIsMessage(ev)) {
return Utils.translatedEventContent(ev)
}
font.pixelSize: theme.fontSize.small
elide: Text.ElideRight
maximumLineCount: 1
return Utils.coloredNameHtml(
users.find(ev.senderId).displayName,
ev.senderId
) + ": " + py.callSync("inlinify", [ev.content])
}
Layout.maximumWidth: parent.width
// Have to do it like this to avoid binding loop
property var lastEv: timelines.lastEventOf(model.roomId)
onLastEvChanged: text = getText(lastEv)
id: subtitleLabel
visible: Boolean(text)
textFormat: Text.StyledText
font.pixelSize: theme.fontSize.small
elide: Text.ElideRight
maximumLineCount: 1
Layout.maximumWidth: parent.width
}
}
}
}

5
src/qml/SidePane/RoomList.qml
View File

@ -8,12 +8,11 @@ import "../Base"
import "../utils.js" as Utils
HListView {
id: roomList
property string userId: ""
property string category: ""
id: roomList
spacing: sidePane.collapsed ? 0 : sidePane.normalSpacing
model: SortFilterProxyModel {
sourceModel: rooms
filters: AllOf {

7
src/qml/SidePane/SidePane.qml
View File

@ -12,6 +12,7 @@ HRectangle {
clip: true
property int normalSpacing: 8
property int currentSpacing: collapsed ? 0 : normalSpacing
property bool collapsed: false
HColumnLayout {
@ -21,10 +22,8 @@ HRectangle {
Layout.fillWidth: true
Layout.fillHeight: true
spacing: collapsed ? 0 : normalSpacing * 3
topMargin: collapsed ? 0 : normalSpacing
bottomMargin: topMargin
Layout.leftMargin: topMargin
spacing: currentSpacing
bottomMargin: currentSpacing
Behavior on spacing { HNumberAnimation {} }
}

11
src/qml/Theme.qml
View File

@ -41,6 +41,13 @@ QtObject {
property color background: colors.background2
}
property QtObject listEntry: QtObject {
property color background: "transparent"
property color hoveredBackground: Qt.hsla(0, 0, 0, 0.2)
property color pressedBackground: Qt.hsla(0, 0, 0, 0.4)
property color checkedBackground: Qt.hsla(0, 0, 0, 0.4)
}
property QtObject textField: QtObject {
property color background: colors.background2
}
@ -53,6 +60,10 @@ QtObject {
property QtObject sidePane: QtObject {
property color background: colors.background2
property QtObject account: QtObject {
property color background: Qt.lighter(colors.background2, 1.05)
}
property QtObject settingsButton: QtObject {
property color background: colors.background2
}

1
src/qml/Window.qml
View File

@ -28,6 +28,7 @@ ApplicationWindow {
Python { id: py }
// Models
Accounts { id: accounts }
Devices { id: devices }
RoomCategories { id: roomCategories }