status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

divide left tab into 2 files

This commit is contained in:
Iuri Matias 2020-05-27 16:57:36 -04:00
parent aa5dbc6994
commit 1503f2d1f8
6 changed files with 358 additions and 336 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ui/app/AppLayouts/Chat/ChatColumn.qml
View File

@ -352,4 +352,3 @@ Designer {
D{i:0;formeditorColor:"#ffffff";height:770;width:800}
}
##^##*/

341
ui/app/AppLayouts/Profile/LeftTab.qml
View File

@ -6,10 +6,12 @@ import QtQuick.Layouts 1.3
import Qt.labs.platform 1.1
import "../../../imports"
import "../../../shared"
import "./LeftTab"
ColumnLayout {
readonly property int w: 340
property alias currentTab: profileScreenButtons.currentIndex
// property alias currentTab: profileScreenButtons.currentIndex
property alias currentTab: profileMenu.profileCurrentIndex
id: profileInfoContainer
width: w
@ -21,343 +23,12 @@ ColumnLayout {
anchors.bottom: parent.bottom
anchors.bottomMargin: 0
RowLayout {
id: profileHeader
height: 240
Layout.fillWidth: true
width: profileInfoContainer.w
Profile {}
Rectangle {
id: profileHeaderContent
height: parent.height
Layout.fillWidth: true
Item {
id: profileImgNameContainer
width: profileHeaderContent.width
height: profileHeaderContent.height
anchors.horizontalCenter: parent.horizontalCenter
anchors.top: parent.top
Image {
id: profileImg
source: profileModel.profile.identicon
width: 80
height: 80
fillMode: Image.PreserveAspectCrop
anchors.horizontalCenter: parent.horizontalCenter
property bool rounded: true
property bool adapt: false
y: 78
layer.enabled: rounded
layer.effect: OpacityMask {
maskSource: Item {
width: profileImg.width
height: profileImg.height
Rectangle {
anchors.centerIn: parent
width: profileImg.adapt ? profileImg.width : Math.min(profileImg.width, profileImg.height)
height: profileImg.adapt ? profileImg.height : width
radius: Math.min(width, height)
}
}
}
Menu {
id: profileMenu
}
Text {
id: profileName
text: profileModel.profile.username
anchors.top: profileImg.bottom
anchors.topMargin: 10
anchors.horizontalCenterOffset: 0
anchors.horizontalCenter: parent.horizontalCenter
font.weight: Font.Medium
font.pixelSize: 20
}
}
}
}
RowLayout {
readonly property int btnheight: 42
id: profileTabBar
width: profileInfoContainer.w
height: btnheight * 10
Layout.fillHeight: true
Layout.fillWidth: true
Rectangle {
id: profileTabBarBg
color: "#ffffff"
height: parent.height
Layout.fillHeight: true
Layout.fillWidth: true
TabBar {
id: profileScreenButtons
width: profileInfoContainer.w
height: parent.height
anchors.bottom: parent.bottom
anchors.bottomMargin: 0
currentIndex: 0
spacing: 0
background: Rectangle {
color: "#00000000"
}
TabButton {
id: ensTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.top: parent.top
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element1
color: "#000000"
text: qsTr("ENS usernames")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: contactsTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: ensTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element2
color: "#000000"
text: qsTr("Contacts")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: privacyTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: contactsTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element3
color: "#000000"
text: qsTr("Privacy and security")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: syncTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: privacyTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element4
color: "#000000"
text: qsTr("Sync settings")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: languageTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: syncTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element5
color: "#000000"
text: qsTr("Language settings")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: notificationsTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: languageTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element6
color: "#000000"
text: qsTr("Notifications settings")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: advancedTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: notificationsTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element7
color: "#000000"
text: qsTr("Advanced settings")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: helpTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: advancedTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element8
color: "#000000"
text: qsTr("Need help?")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: aboutTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: helpTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element9
color: "#000000"
text: qsTr("About")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: signoutTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: aboutTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element10
color: "#000000"
text: qsTr("Sign out")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
}
}
}
}
/*##^##

285
ui/app/AppLayouts/Profile/LeftTab/Menu.qml Normal file
View File

@ -0,0 +1,285 @@
import QtGraphicalEffects 1.12
import QtQuick 2.0
import QtQuick.Layouts 1.3
import QtQuick.Controls 2.3
import "../../../../imports"
RowLayout {
property alias profileCurrentIndex: profileScreenButtons.currentIndex
readonly property int btnheight: 42
id: profileTabBar
width: profileInfoContainer.w
height: btnheight * 10
Layout.fillHeight: true
Layout.fillWidth: true
Rectangle {
id: profileTabBarBg
color: "#ffffff"
height: parent.height
Layout.fillHeight: true
Layout.fillWidth: true
TabBar {
id: profileScreenButtons
width: profileInfoContainer.w
height: parent.height
anchors.bottom: parent.bottom
anchors.bottomMargin: 0
currentIndex: 0
spacing: 0
background: Rectangle {
color: "#00000000"
}
TabButton {
id: ensTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.top: parent.top
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element1
color: "#000000"
text: qsTr("ENS usernames")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: contactsTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: ensTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element2
color: "#000000"
text: qsTr("Contacts")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: privacyTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: contactsTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element3
color: "#000000"
text: qsTr("Privacy and security")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: syncTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: privacyTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element4
color: "#000000"
text: qsTr("Sync settings")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: languageTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: syncTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element5
color: "#000000"
text: qsTr("Language settings")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: notificationsTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: languageTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element6
color: "#000000"
text: qsTr("Notifications settings")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: advancedTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: notificationsTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element7
color: "#000000"
text: qsTr("Advanced settings")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: helpTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: advancedTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element8
color: "#000000"
text: qsTr("Need help?")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: aboutTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: helpTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element9
color: "#000000"
text: qsTr("About")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
TabButton {
id: signoutTabButton
width: profileInfoContainer.w
height: profileTabBar.btnheight
text: ""
anchors.left: parent.left
anchors.leftMargin: 0
anchors.top: aboutTabButton.bottom
anchors.topMargin: 0
background: Rectangle {
color: Theme.transparent
}
Text {
id: element10
color: "#000000"
text: qsTr("Sign out")
anchors.left: parent.left
anchors.leftMargin: 72
anchors.verticalCenter: parent.verticalCenter
font.weight: Font.Medium
font.pixelSize: 14
}
}
}
}
}

64
ui/app/AppLayouts/Profile/LeftTab/Profile.qml Normal file
View File

@ -0,0 +1,64 @@
import QtGraphicalEffects 1.12
import QtQuick 2.0
import QtQuick.Layouts 1.3
import QtQuick.Controls 2.3
import "../../../../imports"
RowLayout {
id: profileHeader
height: 240
Layout.fillWidth: true
width: profileInfoContainer.w
Rectangle {
id: profileHeaderContent
height: parent.height
Layout.fillWidth: true
Item {
id: profileImgNameContainer
width: profileHeaderContent.width
height: profileHeaderContent.height
anchors.horizontalCenter: parent.horizontalCenter
anchors.top: parent.top
Image {
id: profileImg
source: profileModel.profile.identicon
width: 80
height: 80
fillMode: Image.PreserveAspectCrop
anchors.horizontalCenter: parent.horizontalCenter
property bool rounded: true
property bool adapt: false
y: 78
layer.enabled: rounded
layer.effect: OpacityMask {
maskSource: Item {
width: profileImg.width
height: profileImg.height
Rectangle {
anchors.centerIn: parent
width: profileImg.adapt ? profileImg.width : Math.min(profileImg.width, profileImg.height)
height: profileImg.adapt ? profileImg.height : width
radius: Math.min(width, height)
}
}
}
}
Text {
id: profileName
text: profileModel.profile.username
anchors.top: profileImg.bottom
anchors.topMargin: 10
anchors.horizontalCenterOffset: 0
anchors.horizontalCenter: parent.horizontalCenter
font.weight: Font.Medium
font.pixelSize: 20
}
}
}
}

2
ui/app/AppLayouts/Profile/LeftTab/qmldir Normal file
View File

@ -0,0 +1,2 @@
Profile 1.0 Profile.qml
Menu 1.0 Menu.qml

1
ui/nim-status-client.pro
View File

@ -58,6 +58,7 @@ DISTFILES += \
app/AppLayouts/Chat/components/qmldir \
app/AppLayouts/Chat/qmldir \
app/AppLayouts/Node/NodeLayout.qml \
app/AppLayouts/Profile/LeftTab/qmldir \
app/AppLayouts/Profile/ProfileLayout.qml \
app/AppLayouts/Wallet/LeftTab.qml \
app/AppLayouts/Wallet/WalletLayout.qml \