diff --git a/qml/Setting.qml b/qml/Setting.qml index 84c07ae..5dab213 100644 --- a/qml/Setting.qml +++ b/qml/Setting.qml @@ -7,31 +7,84 @@ import Matrique.Settings 0.1 import "component" import "form" +import "qrc:/js/util.js" as Util Page { property alias listModel: accountSettingsListView.model + Page { id: accountForm + parent: null padding: 64 - ListView { + ColumnLayout { anchors.fill: parent - id: accountSettingsListView + ListView { + Layout.fillWidth: true + Layout.fillHeight: true - spacing: 0 + id: accountSettingsListView - delegate: RowLayout{ - Label { - text: accountID - } - ItemDelegate { - text: "Logout" - onClicked: matriqueController.logout(connection); + delegate: SwipeDelegate { + width: accountSettingsListView.width + height: 64 + + clip: true + + Row { + anchors.fill: parent + anchors.margins: 8 + + spacing: 8 + + ImageItem { + width: parent.height + height: parent.height + + hint: name + defaultColor: Util.stringToColor(name) + image: avatar + } + + ColumnLayout { + Label { + text: name + } + Label { + text: accountID + } + } + } + + swipe.right: Rectangle { + width: parent.height + height: parent.height + anchors.right: parent.right + + color: Material.accent + + MaterialIcon { + anchors.fill: parent + + icon: "\ue879" + color: "white" + } + + SwipeDelegate.onClicked: matriqueController.logout(connection) + } } } + + Button { + text: "Add Account" + flat: true + highlighted: true + + onClicked: Util.pushToStack(stackView, loginPage) + } } } @@ -40,6 +93,8 @@ Page { parent: null + padding: 64 + Column { Switch { text: "Lazy load at initial sync" @@ -69,6 +124,8 @@ Page { parent: null + padding: 64 + Column { Switch { text: "Dark theme" @@ -95,6 +152,7 @@ Page { Page { id: aboutForm + parent: null padding: 64 @@ -112,48 +170,52 @@ Page { } } - RowLayout { - ColumnLayout { - Layout.preferredWidth: 240 - Layout.fillHeight: true + Rectangle { + width: 240 + height: parent.height - spacing: 0 + id: settingDrawer + + color: MSettings.darkTheme ? "#323232" : "#f3f3f3" + + Column { + anchors.fill: parent ItemDelegate { - Layout.fillWidth: true + width: parent.width text: "Account" onClicked: pushToStack(accountForm) } ItemDelegate { - Layout.fillWidth: true + width: parent.width text: "General" onClicked: pushToStack(generalForm) } ItemDelegate { - Layout.fillWidth: true + width: parent.width text: "Appearance" onClicked: pushToStack(appearanceForm) } ItemDelegate { - Layout.fillWidth: true + width: parent.width text: "About" onClicked: pushToStack(aboutForm) } } + } - StackView { - Layout.fillWidth: true - Layout.fillHeight: true + StackView { + anchors.fill: parent + anchors.leftMargin: settingDrawer.width - id: settingStackView - } + id: settingStackView } function pushToStack(item) { diff --git a/qml/component/ImageStatus.qml b/qml/component/ImageStatus.qml deleted file mode 100644 index 2144783..0000000 --- a/qml/component/ImageStatus.qml +++ /dev/null @@ -1,79 +0,0 @@ -import QtQuick 2.9 -import QtQuick.Controls 2.2 -import QtGraphicalEffects 1.0 -import QtQuick.Controls.Material 2.2 - -Item { - property bool round: true - property string source: "" - property string displayText: "" - readonly property bool showImage: source - readonly property bool showInitial: !showImage && displayText || avatar.status != Image.Ready - - id: item - - Image { - width: item.width - height: item.width - - id: avatar - - visible: showImage - source: item.source - - mipmap: true - layer.enabled: true - fillMode: Image.PreserveAspectCrop - sourceSize.width: item.width - - layer.effect: OpacityMask { - maskSource: Item { - width: avatar.width - height: avatar.width - Rectangle { - anchors.centerIn: parent - width: avatar.width - height: avatar.width - radius: round? avatar.width / 2 : 0 - } - } - } - } - - Label { - anchors.fill: parent - - color: "white" - visible: showInitial - text: showInitial ? getInitials(displayText)[0] : "" - font.pixelSize: 22 - font.bold: true - horizontalAlignment: Text.AlignHCenter - verticalAlignment: Text.AlignVCenter - background: Rectangle { - anchors.fill: parent - radius: round? width / 2 : 0 - color: showInitial ? stringToColor(displayText) : Material.accent - } - } - - function getInitials(text) { - if (!text) return "N" - var initial = text.toUpperCase().replace(/[^a-zA-Z- ]/g, "").match(/\b\w/g); - if (!initial) return "N" - return initial - } - - function stringToColor(str) { - var hash = 0; - for (var i = 0; i < str.length; i++) { - hash = str.charCodeAt(i) + ((hash << 5) - hash); - } - var colour = '#'; - for (var j = 0; j < 3; j++) { - var value = (hash >> (j * 8)) & 0xFF; - colour += ('00' + value.toString(16)).substr(-2); - } - return colour; - } -} diff --git a/qml/main.qml b/qml/main.qml index b0dd9c1..c2648e9 100644 --- a/qml/main.qml +++ b/qml/main.qml @@ -242,19 +242,6 @@ ApplicationWindow { } } - SideNavButton { - Layout.fillWidth: true - Layout.preferredHeight: width - - MaterialIcon { - anchors.fill: parent - - icon: "\ue8b8" - color: "white" - } - page: loginPage - } - SideNavButton { Layout.fillWidth: true Layout.preferredHeight: width diff --git a/res.qrc b/res.qrc index cebc6a2..0095a76 100644 --- a/res.qrc +++ b/res.qrc @@ -6,7 +6,6 @@ asset/font/material.ttf qml/Login.qml qml/main.qml - qml/component/ImageStatus.qml qml/form/RoomForm.qml qml/Room.qml qml/component/SideNavButton.qml diff --git a/src/matriqueuser.h b/src/matriqueuser.h index 49df02d..11de703 100644 --- a/src/matriqueuser.h +++ b/src/matriqueuser.h @@ -17,7 +17,7 @@ class MatriqueUser : public User { QImage getAvatar() { return avatar(64); } signals: - void inheritedAvatarChanged(User* user, const Room* roomContext); + void inheritedAvatarChanged(User* user, const Room* roomContext); // https://bugreports.qt.io/browse/QTBUG-7684 }; #endif // MATRIQUEUSER_H