Differential D28744 Diff 79907 kcms/keys/package/contents/ui/main.qml

Changeset View

Standalone View

View Options

kcms/keys/package/contents/ui/main.qml

  • This file was added.
1​/*
2​ * Copyright (C) 2020 David Redondo <david@david-redondo.de>
3​ *
4​ * This program is free software; you can redistribute it and/or modify
5​ * it under the terms of the GNU General Public License as published by
6​ * the Free Software Foundation; either version 2 of the License, or
7​ * (at your option) any later version.
8​ *
9​ * This program is distributed in the hope that it will be useful,
10​ * but WITHOUT ANY WARRANTY; without even the implied warranty of
11​ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
12​ * GNU General Public License for more details.
13​ *
14​ * You should have received a copy of the GNU General Public License along
15​ * with this program; if not, write to the Free Software Foundation, Inc.,
16​ * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
17​ */
18​
19​import QtQuick 2.14
20​import QtQuick.Dialogs 1.3
21​import QtQuick.Layouts 1.1
22​import QtQuick.Controls 2.3 as QQC2
23​import QtQml.Models 2.3
24​
25​import org.kde.kirigami 2.10 as Kirigami
26​import org.kde.kcm 1.2 as KCM
27​
28​KCM.SimpleKCM {
29​ id: root
30​ implicitWidth: 1000
31​ implicitHeight: 400
broulikUnsubmitted
Not Done

Kirigami.Units.gridUnit

broulik: `Kirigami.Units.gridUnit`
32​ enabled: kcm.lastError == ""
ngrahamUnsubmitted
Done

The ratio between these is kind of unpleasant; I would recommend 800x600

ngraham: The ratio between these is kind of unpleasant; I would recommend 800x600
33​ property bool exportActive: exportInfo.visible
34​ ColumnLayout{
broulikUnsubmitted
Done

This appears to loop? exportInfo's visible is bound to this

broulik: This appears to loop? `exportInfo`'s `visible` is bound to this
35​ // otherwise we get scrollbars
broulikUnsubmitted
Done

Coding style: ColumnLayout {

broulik: Coding style: `ColumnLayout {`
36​ height: root.availableHeight - Kirigami.Units.smallSpacing
37​ width: root.availableWidth
broulikUnsubmitted
Done

Huh?

broulik: Huh?
38​ Kirigami.InlineMessage {
39​ Layout.fillWidth: true
40​ visible: kcm.lastError != ""
41​ text: kcm.lastError
broulikUnsubmitted
Done

Coding style, also !==

broulik: Coding style, also `!==`
42​ type: Kirigami.MessageType.Error
43​ }
44​ Kirigami.InlineMessage {
45​ id: exportWarning
46​ Layout.fillWidth: true
47​ visible: false
48​ text: i18n("Cannot export scheme while there are unsaved changes")
49​ type: Kirigami.MessageType.Warning
50​ Connections {
51​ target: kcm
52​ enabled: exportWarning.visible
53​ function onNeedsSaveChanged () {
54​ exportWarning.visible = kcm.needsSave
broulikUnsubmitted
Done

What Qt version was that changed, 5.14?
Also why not just bind?

broulik: What Qt version was that changed, 5.14? Also why not just bind?
davidreAuthorUnsubmitted
Done

The way I used it caused a binding loop

Binding on visible {
                when: exportWarning.visible
                value: kcm.needsSave
                restoreMode: Binding.RestoreValue
            }
davidre: The way I used it caused a binding loop ``` Binding on visible { when…
55​ }
56​ }
57​ }
58​ Kirigami.InlineMessage {
59​ id: exportInfo
60​ Layout.fillWidth: true
61​ visible: exportActive
62​ text: i18n("Select the components that should be included in the exported scheme")
63​ type: Kirigami.MessageType.Information
ngrahamUnsubmitted
Done

Maybe Select the components below... for extra clarity?

ngraham: Maybe `Select the components below...` for extra clarity?
64​ showCloseButton: true
65​ actions: [
66​ Kirigami.Action {
ngrahamUnsubmitted
Done

Probably needs a "select all" action to make exporting everything not be incredibly frustrating

ngraham: Probably needs a "select all" action to make exporting everything not be incredibly frustrating
67​ iconName: "document-save"
68​ text: i18n("Save scheme")
69​ onTriggered: {
70​ fileDialogLoader.save = true
71​ fileDialogLoader.active = true
72​ exportInfo.visible = false
73​ }
74​ }
75​ ]
76​ }
77​ Kirigami.SearchField {
78​ id: search
79​ enabled: !exportActive
80​ Layout.fillWidth: true
81​ onAccepted: kcm.filteredModel.filter = text
82​ }
ngrahamUnsubmitted
Done

Would be nice to filter immediately as the user types rather than having to hit the return key

ngraham: Would be nice to filter immediately as the user types rather than having to hit the return key
83​ GridLayout {
84​ columns: 2
85​ QQC2.ScrollView {
86​ Component.onCompleted: background.visible = true
87​ Layout.preferredWidth: 300
88​ Layout.fillHeight:true
broulikUnsubmitted
Not Done

Kirigami.Units.gridUnit and/or maybe proportional to the window width?

broulik: `Kirigami.Units.gridUnit` and/or maybe proportional to the window width?
89​ ListView {
90​ id: components
91​ clip: true
92​ model: kcm.filteredModel
93​ delegate: Kirigami.AbstractListItem {
94​ RowLayout {
95​ Kirigami.Icon {
broulikUnsubmitted
Done

Is contentItem the default property?

broulik: Is `contentItem` the default property?
davidreAuthorUnsubmitted
Done

Yes

davidre: Yes
96​ source: model.decoration
97​ Layout.preferredWidth: Kirigami.Units.iconSizes.small
98​ Layout.preferredHeight: Layout.preferredWidth
99​ }
100​ QQC2.Label {
101​ Layout.fillWidth: true
102​ text: model.display
103​ }
broulikUnsubmitted
Done

Make sure to replicate the color behavior on hover and when selected, right now text stays black with the blue selection background behind it

broulik: Make sure to replicate the color behavior on hover and when selected, right now text stays…
104​ QQC2.CheckBox {
105​ id: checkbox
106​ checked: model.checked
107​ visible: root.exportActive
108​ onToggled: model.checked = checked
109​ }
110​ }
111​ }
112​ section.property: "section"
113​ section.delegate: Kirigami.ListSectionHeader {
114​ label: section
115​ }
broulikUnsubmitted
Done

Perhaps you could put a checkbox here so one check all items in a section

broulik: Perhaps you could put a checkbox here so one check all items in a section
116​ }
117​ }
118​ QQC2.ScrollView {
119​ property var rootIndex : kcm.filteredModel.index(components.currentIndex, 0)
ngrahamUnsubmitted
Done

When I click on it, the KCM enters this state:

ngraham: When I click on it, the KCM enters this state: {F8249469}
120​ enabled: !exportActive
121​ id: shortcutsScroll
ngrahamUnsubmitted
Done

How about "Remove all shortcuts for [model.name]"

ngraham: How about "Remove all shortcuts for [model.name]"
122​ Layout.fillHeight: true
123​ Layout.fillWidth: true
124​ Component.onCompleted: background.visible = true
125​ onRootIndexChanged: shortcutsList.currentIndex = -1
126​ ListView {
127​ clip:true
ngrahamUnsubmitted
Done

Need to do one of the following:

  • Make this view never empty because something in the left view is always selected
  • Add a standard-looking placeholder message that appears in the center of this view when nothing is selected that says something like "Select an item from the list to view its shortcuts here"
ngraham: Need to do one of the following: - Make this view never empty because something in the left…
128​ id: shortcutsList
129​ model: DelegateModel {
130​ id: dm
131​ rootIndex: shortcutsScroll.rootIndex
132​ model: rootIndex.valid ? kcm.filteredModel : undefined
133​ delegate: ShortcutActionDelegate {}
134​ }
135​ }
136​ }
137​ RowLayout {
138​ Layout.alignment: Qt.AlignRight
139​ QQC2.Button {
140​ icon.name: "list-add"
141​ text: i18n("Add application...")
142​ onClicked: {
broulikUnsubmitted
Done

Capitalize: "Add Application..."

How do I remove applications again, though?

broulik: Capitalize: "Add Application..." How do I remove applications again, though?
davidreAuthorUnsubmitted
Done

I know...
I will look into what's the most reliable way of deleting things...

davidre: I know... I will look into what's the most reliable way of deleting things...
143​ kcm.addApplication()
144​ }
145​ }
146​ }
147​ RowLayout {
148​ enabled: !exportActive
149​ Layout.alignment: Qt.AlignRight
150​ QQC2.Button {
151​ icon.name: "document-import"
152​ text: i18n("Import Scheme...")
153​ onClicked: importSheet.open()
154​ }
155​ QQC2.Button {
156​ icon.name: "document-export"
157​ text:i18n("Export Scheme...")
158​ onClicked: {
broulikUnsubmitted
Done

I kinda think this button should turn into a "Cancel Export" button when exporting? Not sure that closing the message widget is obvious enough to the user?

broulik: I kinda think this button should turn into a "Cancel Export" button when exporting? Not sure…
159​ if (kcm.needsSave) {
160​ exportWarning.visible = true
161​ } else {
broulikUnsubmitted
Done

You're doing a Connections above already.

broulik: You're doing a `Connections` above already.
162​ search.text = ""
163​ kcm.filteredModel.filter = ""
164​ exportInfo.visible = true
broulikUnsubmitted
Done

This should just be bound to the search.text and work automatically

broulik: This should just be bound to the `search.text` and work automatically
165​ }
broulikUnsubmitted
Done

You seem to love being overly explicit with this? :P You have a binding above already...

Perhaps run the application with QT_LOGGING_RULES="qt.qml.binding.removal.info=true" to clean those up

broulik: You seem to love being overly explicit with this? :P You have a binding above already...
166​ }
167​ }
168​ }
ngrahamUnsubmitted
Done

Make it a level 3 Heading

ngraham: Make it a level 3 `Heading`
169​ }
170​ }
171​ Loader {
172​ id: fileDialogLoader
173​ active: false
174​ property bool save
ngrahamUnsubmitted
Done

For some reason this list view doesn't get any sctollbars when it's scrollable. Also it implements kinetic scrolling while the other list view doesn't

ngraham: For some reason this list view doesn't get any sctollbars when it's scrollable. Also it…
175​ sourceComponent: FileDialog {
176​ id: fileDialog
177​ title: save ? i18n("Export Shortcut Scheme") : i18n("Import Shortcut Scheme")
178​ folder: shortcuts.home
179​ nameFilters: [ i18nc("Template for file dialog","Schortcut Scheme (*.kksrc)") ]
180​ defaultSuffix: ".kksrc"
181​ selectExisting: !fileDialogLoader.save
182​ Component.onCompleted: open()
183​ onAccepted: {
184​ save ? kcm.writeScheme(fileUrls[0]) : kcm.loadScheme(fileUrls[0])
185​ fileDialogLoader.active = false
186​ }
187​ onRejected: fileDialogLoader.active = false
188​ }
189​ }
190​ Kirigami.OverlaySheet {
191​ id: importSheet
192​ header: Kirigami.Heading {
193​ text: i18n("Import Shortcut Scheme")
194​ }
195​
196​ ColumnLayout {
197​ anchors.centerIn: parent
198​ QQC2.Label {
199​ text: i18n("Select the scheme to import:")
200​ }
201​ RowLayout {
202​ QQC2.ComboBox {
203​ id: schemeBox
204​ readonly property bool customSchemeSelected: currentIndex == count - 1
205​ property string url: ""
206​ currentIndex: count - 1
207​ textRole: "name"
208​ onActivated: url = model[index]["url"]
209​ Component.onCompleted: {
210​ var defaultSchemes = kcm.defaultSchemes()
211​ defaultSchemes.push({name: i18n("Custom Scheme"), url: "unused"})
212​ model = defaultSchemes
213​ }
214​ }
215​ QQC2.Button {
216​ text: schemeBox.customSchemeSelected ? i18n("Select File...") : i18n("Import")
217​ onClicked: {
218​ if (schemeBox.customSchemeSelected) {
219​ fileDialogLoader.save = false;
220​ fileDialogLoader.active = true;
221​ } else {
222​ kcm.loadScheme(schemeBox.defaultSchemes[schemeBox.url])
223​ }
224​ importSheet.close()
225​ }
broulikUnsubmitted
Done

Found it a bit odd that the overlaysheet suddenly closed as a result.
I would have expected clicking "Select File", choosing one, and then it being added to and selected in the combox list and then confirming this by clicking "Import"

broulik: Found it a bit odd that the overlaysheet suddenly closed as a result. I would have expected…
226​ }
227​ }
228​ }
229​ }
230​}
231​