ESCA111/neochat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Unify look of scrolling setting page

Browse Source 
* Add frame on desktop
* Remove frame on mobile
* Use actions.main when needed on mobile
* Don't push a new setting page on mobile
This commit is contained in:
Carl Schwan
2021-06-17 12:57:58 +02:00
parent 6487ea7414
commit d7345ee4e6
6 changed files with 267 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

185
imports/NeoChat/Settings/Emoticons.qml
View File

@@ -13,7 +13,92 @@ import NeoChat.Settings 1.0
import NeoChat.Component 1.0 as Components
import NeoChat.Dialog 1.0
Kirigami.ScrollablePage {
Kirigami.Page {
leftPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0
topPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0
bottomPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0
rightPadding: pageSettingStack.wideMode ? Kirigami.Units.gridUnit : 0
ColumnLayout {
id: column
anchors.fill: parent
Connections {
target: pageSettingStack
onWideModeChanged: scroll.background.visible = pageSettingStack.wideMode
}
QQC2.ScrollView {
id: scroll
Component.onCompleted: background.visible = pageSettingStack.wideMode
Layout.fillWidth: true
Layout.fillHeight: true
ListView {
clip: true
model: CustomEmojiModel {
id: emojiModel
connection: Controller.activeConnection
}
Kirigami.PlaceholderMessage {
anchors.centerIn: parent
text: i18n("No custom inline stickers found")
visible: parent.model.count === 0
}
delegate: Kirigami.BasicListItem {
id: del
required property string name
required property url imageURL
text: name
reserveSpaceForSubtitle: true
leading: Image {
width: height
sourceSize.width: width
sourceSize.height: height
source: imageURL
Rectangle {
anchors.fill: parent
visible: parent.status === Image.Loading
radius: height/2
gradient: Components.ShimmerGradient { }
}
}
trailing: QQC2.ToolButton {
width: height
icon.name: "delete"
onClicked: emojiModel.removeEmoji(del.name)
}
}
}
}
Loader {
active: pageSettingStack.wideMode
sourceComponent: addEmojiComponent
Layout.fillWidth: true
}
}
footer: QQC2.ToolBar {
id: toolbar
width: parent.width
visible: !pageSettingStack.wideMode
height: visible ? implicitHeight : 0
contentItem: Loader {
active: !pageSettingStack.wideMode
sourceComponent: addEmojiComponent
}
}
Component {
id: openFileDialog
@@ -22,83 +107,47 @@ Kirigami.ScrollablePage {
}
}
ListView {
header: QQC2.ToolBar {
width: parent.width
contentItem: RowLayout {
Item {
Layout.fillWidth: Qt.application.layoutDirection == Qt.LeftToRight
}
QQC2.TextField {
id: emojiField
placeholderText: i18n("new_emoji_name_here")
property Component addEmojiComponent: RowLayout {
Item {
Layout.fillWidth: Qt.application.layoutDirection == Qt.LeftToRight
}
validator: RegularExpressionValidator {
regularExpression: /[a-zA-Z_0-9]*/
}
}
QQC2.Button {
text: i18n("Add Emoji...")
QQC2.TextField {
id: emojiField
placeholderText: i18n("new_emoji_name_here")
enabled: emojiField.text != ""
property var fileDialog: null
onClicked: {
if (this.fileDialog != null) {
return;
}
this.fileDialog = openFileDialog.createObject(QQC2.Overlay.overlay)
this.fileDialog.chosen.connect((url) => {
emojiModel.addEmoji(emojiField.text, url)
this.fileDialog = null
})
this.fileDialog.onRejected.connect(() => {
rej()
this.fileDialog = null
})
this.fileDialog.open()
}
}
Item {
Layout.fillWidth: Qt.application.layoutDirection == Qt.RightToLeft
}
validator: RegularExpressionValidator {
regularExpression: /[a-zA-Z_0-9]*/
}
}
model: CustomEmojiModel {
id: emojiModel
connection: Controller.activeConnection
}
delegate: Kirigami.BasicListItem {
id: del
QQC2.Button {
text: i18n("Add Emoji...")
required property string name
required property url imageURL
enabled: emojiField.text != ""
property var fileDialog: null
text: name
reserveSpaceForSubtitle: true
leading: Image {
width: height
sourceSize.width: width
sourceSize.height: height
source: imageURL
Rectangle {
anchors.fill: parent
visible: parent.status === Image.Loading
radius: height/2
gradient: Components.ShimmerGradient { }
onClicked: {
if (this.fileDialog != null) {
return;
}
}
trailing: QQC2.ToolButton {
width: height
icon.name: "delete"
onClicked: emojiModel.removeEmoji(del.name)
this.fileDialog = openFileDialog.createObject(QQC2.Overlay.overlay)
this.fileDialog.chosen.connect((url) => {
emojiModel.addEmoji(emojiField.text, url)
this.fileDialog = null
})
this.fileDialog.onRejected.connect(() => {
rej()
this.fileDialog = null
})
this.fileDialog.open()
}
}
Item {
Layout.fillWidth: Qt.application.layoutDirection == Qt.RightToLeft
}
}
}