Fix DevicesPage and AccountsPage on mobile

Also make the padding smaller
This commit is contained in:
Tobias Fella
2021-09-07 11:48:46 +02:00
parent 8118068fb5
commit 821993c443
3 changed files with 127 additions and 129 deletions

View File

@@ -14,10 +14,10 @@ import NeoChat.Dialog 1.0
Kirigami.Page { Kirigami.Page {
title: i18n("Accounts") title: i18n("Accounts")
leftPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 leftPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
topPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 topPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
bottomPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 bottomPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
rightPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 rightPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
actions.main: Kirigami.Action { actions.main: Kirigami.Action {
text: i18n("Add an account") text: i18n("Add an account")
@@ -26,78 +26,81 @@ Kirigami.Page {
visible: !pageSettingStack.wideMode visible: !pageSettingStack.wideMode
} }
ColumnLayout { Connections {
target: pageSettingStack
onWideModeChanged: scroll.background.visible = pageSettingStack.wideMode
}
Controls.ScrollView {
id: scroll
Component.onCompleted: background.visible = pageSettingStack.wideMode
anchors.fill: parent anchors.fill: parent
Connections { Controls.ScrollBar.horizontal.policy: Controls.ScrollBar.AlwaysOff
target: pageSettingStack ListView {
onWideModeChanged: scroll.background.visible = pageSettingStack.wideMode clip: true
} model: AccountListModel { }
delegate: Kirigami.SwipeListItem {
leftPadding: 0
rightPadding: 0
Kirigami.BasicListItem {
anchors.top: parent.top
anchors.bottom: parent.bottom
Controls.ScrollView { text: model.user.displayName
id: scroll subtitle: model.user.id
Component.onCompleted: background.visible = pageSettingStack.wideMode icon: model.user.avatarMediaId ? ("image://mxc/" + model.user.avatarMediaId) : "im-user"
Layout.fillWidth: true onClicked: {
Layout.fillHeight: true Controller.activeConnection = model.connection
pageStack.layers.pop()
Controls.ScrollBar.horizontal.policy: Controls.ScrollBar.AlwaysOff }
ListView { }
clip: true actions: [
model: AccountListModel { } Kirigami.Action {
delegate: Kirigami.SwipeListItem { text: i18n("Edit this account")
leftPadding: 0 iconName: "document-edit"
rightPadding: 0 onTriggered: {
Kirigami.BasicListItem { userEditSheet.connection = model.connection
anchors.top: parent.top userEditSheet.open()
anchors.bottom: parent.bottom }
},
text: model.user.displayName Kirigami.Action {
subtitle: model.user.id text: i18n("Logout")
icon: model.user.avatarMediaId ? ("image://mxc/" + model.user.avatarMediaId) : "im-user" iconName: "im-kick-user"
onTriggered: {
onClicked: { Controller.logout(model.connection, true)
Controller.activeConnection = model.connection if(Controller.accountCount === 1)
pageStack.layers.pop() pageStack.layers.pop()
} }
} }
actions: [ ]
Kirigami.Action {
text: i18n("Edit this account")
iconName: "document-edit"
onTriggered: {
userEditSheet.connection = model.connection
userEditSheet.open()
}
},
Kirigami.Action {
text: i18n("Logout")
iconName: "im-kick-user"
onTriggered: {
Controller.logout(model.connection, true)
if(Controller.accountCount === 1)
pageStack.layers.pop()
}
}
]
}
}
}
RowLayout {
Item {
Layout.fillWidth: true
}
Controls.Button {
visible: pageSettingStack.wideMode
text: i18n("Add an account")
icon.name: "list-add-user"
onClicked: pageStack.layers.push("qrc:/imports/NeoChat/Page/WelcomePage.qml")
} }
} }
} }
footer: Column {
height: visible ? implicitHeight : 0
Kirigami.ActionToolBar {
alignment: Qt.AlignRight
visible: pageSettingStack.wideMode
rightPadding: Kirigami.Units.smallSpacing
width: parent.width
flat: false
actions: [
Kirigami.Action {
text: i18n("Add an account")
icon.name: "list-add-user"
onTriggered: pageStack.layers.push("qrc:/imports/NeoChat/Page/WelcomePage.qml")
}
]
}
Item {
width: parent.width
height: Kirigami.Units.smallSpacing
}
}
Connections { Connections {
target: Controller target: Controller
function onConnectionAdded() { function onConnectionAdded() {

View File

@@ -12,72 +12,67 @@ import org.kde.neochat 1.0
Kirigami.Page { Kirigami.Page {
title: i18n("Devices") title: i18n("Devices")
leftPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 leftPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
topPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 topPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
bottomPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 bottomPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
rightPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 rightPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
ColumnLayout { Connections {
anchors.fill: parent target: pageSettingStack
function onWideModeChanged() {
Connections { scroll.background.visible = pageSettingStack.wideMode
target: pageSettingStack
function onWideModeChanged() {
scroll.background.visible = pageSettingStack.wideMode
}
} }
}
Controls.ScrollView { Controls.ScrollView {
id: scroll id: scroll
Component.onCompleted: background.visible = pageSettingStack.wideMode Component.onCompleted: background.visible = pageSettingStack.wideMode
Layout.fillWidth: true anchors.fill: parent
Layout.fillHeight: true ListView {
ListView { clip: true
clip: true model: DevicesModel {
model: DevicesModel { id: devices
id: devices }
Kirigami.PlaceholderMessage {
visible: parent.model.count === 0 // We can assume 0 means loading since there is at least one device
anchors.centerIn: parent
text: i18n("Loading")
Controls.BusyIndicator {
running: parent.visible
} }
}
Kirigami.PlaceholderMessage { delegate: Kirigami.SwipeListItem {
visible: parent.model.count === 0 // We can assume 0 means loading since there is at least one device leftPadding: 0
anchors.centerIn: parent rightPadding: 0
text: i18n("Loading") Kirigami.BasicListItem {
Controls.BusyIndicator { anchors.top: parent.top
running: parent.visible anchors.bottom: parent.bottom
}
text: model.displayName
subtitle: model.id
icon: "network-connect"
} }
actions: [
delegate: Kirigami.SwipeListItem { Kirigami.Action {
leftPadding: 0 text: i18n("Edit device name")
rightPadding: 0 iconName: "document-edit"
Kirigami.BasicListItem { onTriggered: {
anchors.top: parent.top renameSheet.index = model.index
anchors.bottom: parent.bottom renameSheet.name = model.displayName
renameSheet.open()
text: model.displayName
subtitle: model.id
icon: "network-connect"
}
actions: [
Kirigami.Action {
text: i18n("Edit device name")
iconName: "document-edit"
onTriggered: {
renameSheet.index = model.index
renameSheet.name = model.displayName
renameSheet.open()
}
},
Kirigami.Action {
text: i18n("Logout device")
iconName: "edit-delete-remove"
onTriggered: {
passwordSheet.index = index
passwordSheet.open()
}
} }
] },
} Kirigami.Action {
text: i18n("Logout device")
iconName: "edit-delete-remove"
onTriggered: {
passwordSheet.index = index
passwordSheet.open()
}
}
]
} }
} }
} }

View File

@@ -15,10 +15,10 @@ import NeoChat.Dialog 1.0
Kirigami.Page { Kirigami.Page {
leftPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 leftPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
topPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 topPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
bottomPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 bottomPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
rightPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0 rightPadding: pageSettingStack.wideMode ? Kirigami.Units.smallSpacing : 0
ColumnLayout { ColumnLayout {
id: column id: column