diff --git a/containments/desktop/package/contents/ui/ConfigIcons.qml b/containments/desktop/package/contents/ui/ConfigIcons.qml --- a/containments/desktop/package/contents/ui/ConfigIcons.qml +++ b/containments/desktop/package/contents/ui/ConfigIcons.qml @@ -28,6 +28,7 @@ import org.kde.plasma.components 2.0 as PlasmaComponents import org.kde.kquickcontrolsaddons 2.0 import org.kde.kconfig 1.0 // for KAuthorized +import org.kde.kirigami 2.4 as Kirigami import org.kde.private.desktopcontainment.desktop 0.1 as Desktop import org.kde.private.desktopcontainment.folder 0.1 as Folder @@ -64,36 +65,24 @@ onIconNameChanged: cfg_icon = iconName || "folder" } - GridLayout { + Kirigami.FormLayout { + anchors.horizontalCenter: parent.horizontalCenter - // Row 0: "Panel button" - Label { - Layout.row: 0 - Layout.column: 0 - - visible: isPopup - text: i18n("Panel button:") - } - - CheckBox { - id: useCustomIcon - Layout.row: 0 - Layout.column: 1 - Layout.columnSpan: 2 - - visible: isPopup - checked: cfg_useCustomIcon - text: i18n("Use a custom icon") - } + // Panel button RowLayout { - Layout.row: 0 - Layout.column: 3 - Layout.alignment: Qt.AlignRight spacing: units.smallSpacing - visible: isPopup + Kirigami.FormData.label: i18n("Panel button:") + + CheckBox { + id: useCustomIcon + visible: isPopup + checked: cfg_useCustomIcon + text: i18n("Use a custom icon") + } + Button { id: iconButton Layout.minimumWidth: units.iconSizes.large + units.smallSpacing * 2 @@ -138,64 +127,32 @@ } } - // Row 1: Spacing Item { - Layout.row: 1 - Layout.column: 0 - Layout.minimumHeight: units.largeSpacing visible: isPopup + Kirigami.FormData.isSection: true } - // Row 2: "Arrangment" - "Arrange in" - Label { - Layout.row: 2 - Layout.column: 0 - - text: i18n("Arrangement:") - } - - Label { - Layout.row: 2 - Layout.column: 1 - text: i18n("Arrange in") - } + // Arrangment section ComboBox { id: arrangement - Layout.row: 2 - Layout.column: 2 - Layout.columnSpan: 2 Layout.fillWidth: true - model: [i18n("Rows"), i18n("Columns")] - } - - // Row 3: "Arrangment" - "Align" - Label { - Layout.row: 3 - Layout.column: 1 + Kirigami.FormData.label: i18n("Arrangement:") - text: i18n("Align") + model: [i18n("Rows"), i18n("Columns")] } ComboBox { id: alignment - Layout.row: 3 - Layout.column: 2 - Layout.columnSpan: 2 Layout.fillWidth: true - model: [i18n("Left"), i18n("Right")] + model: [i18n("Align Left"), i18n("Align Right")] } - // Row 4: "Arrangment" - "Lock" CheckBox { id: locked - Layout.row: 4 - Layout.column: 1 - Layout.columnSpan: 3 - visible: ("containmentType" in plasmoid) checked: cfg_locked || lockedByKiosk enabled: !lockedByKiosk @@ -209,238 +166,143 @@ text: i18n("Lock in place") } - // Row 5: Spacing Item { - Layout.row: 5 - Layout.column: 0 - Layout.minimumHeight: units.largeSpacing + Kirigami.FormData.isSection: true } - // Row 6: "Sorting" - "Sort by" - Label { - Layout.row: 6 - Layout.column: 0 - - text: i18n("Sorting:") - } - - Label { - Layout.row: 6 - Layout.column: 1 - - text: i18n("Sort by") - } + // Sorting section ComboBox { id: sortMode - Layout.row: 6 - Layout.column: 2 - Layout.columnSpan: 2 Layout.fillWidth: true + Kirigami.FormData.label: i18n("Sorting:") + property int mode // FIXME TODO HACK: This maps the combo box list model to the KDirModel::ModelColumns // enum, which should be done in C++. property variant indexToMode: [-1, 0, 1, 6, 2] property variant modeToIndex: {'-1' : '0', '0' : '1', '1' : '2', '6' : '3', '2' : '4'} - model: [i18n("Unsorted"), i18n("Name"), i18n("Size"), i18n("Type"), i18n("Date")] + model: [i18n("Manual"), i18n("Name"), i18n("Size"), i18n("Type"), i18n("Date")] Component.onCompleted: currentIndex = modeToIndex[mode] onActivated: mode = indexToMode[index] } - // Row 7: "Sorting" - "Descending" CheckBox { id: sortDesc - Layout.row: 7 - Layout.column: 1 - Layout.columnSpan: 3 enabled: (sortMode.currentIndex != 0) text: i18n("Descending") } - // Row 8: "Sorting" - "Directories first" CheckBox { id: sortDirsFirst - Layout.row: 8 - Layout.column: 1 - Layout.columnSpan: 3 enabled: (sortMode.currentIndex != 0) text: i18n("Folders first") } - // Row 9: Spacing Item { - Layout.row: 9 - Layout.column: 0 - Layout.minimumHeight: units.largeSpacing - } - - // Row 10: "Appearance" - "View mode" - Label { - Layout.row: (isPopup ? 10 : 11) - Layout.column: 0 - - text: i18n("Appearance:") + Kirigami.FormData.isSection: true } - Label { - Layout.row: 10 - Layout.column: 1 - - visible: isPopup - - text: i18nc("whether to use icon or list view", "View mode") - } + // View Mode section (only if we're a pop-up) ComboBox { id: viewMode - Layout.row: 10 - Layout.column: 2 - Layout.columnSpan: 2 + visible: isPopup Layout.fillWidth: true - visible: isPopup + Kirigami.FormData.label: i18nc("whether to use icon or list view", "View mode:") model: [i18n("List"), i18n("Icons")] } - // Rows 11+12: "Appearance" - "Size" - Label { - Layout.row: 11 - Layout.column: 1 - - visible: !isPopup || viewMode.currentIndex === 1 - - text: i18n("Size") - } + // Size section Slider { id: iconSize - Layout.row: 11 - Layout.column: 2 - Layout.columnSpan: 2 - Layout.fillWidth: true - visible: !isPopup || viewMode.currentIndex === 1 + Kirigami.FormData.label: i18n("Size:") + minimumValue: 0 maximumValue: 5 stepSize: 1 tickmarksEnabled: true } - Label { - Layout.row: 12 - Layout.column: 2 - Layout.alignment: Qt.AlignLeft - - visible: !isPopup || viewMode.currentIndex === 1 - - text: i18n("Small") - } - - Label { - Layout.row: 12 - Layout.column: 3 - Layout.alignment: Qt.AlignRight - - visible: !isPopup || viewMode.currentIndex === 1 - - text: i18n("Large") - } + RowLayout { + Layout.fillWidth: true - // Row 13: "Appearance" - "Text lines" - Label { - Layout.row: 13 - Layout.column: 1 + Label { + Layout.alignment: Qt.AlignLeft + visible: !isPopup || viewMode.currentIndex === 1 - visible: !isPopup || viewMode.currentIndex === 1 + text: i18n("Small") + } + Item { + Layout.fillWidth: true + } + Label { + Layout.alignment: Qt.AlignRight + visible: !isPopup || viewMode.currentIndex === 1 - text: i18n("Text lines") + text: i18n("Large") + } } SpinBox { id: textLines - Layout.row: 13 - Layout.column: 2 - Layout.columnSpan: 2 - visible: !isPopup || viewMode.currentIndex === 1 + Kirigami.FormData.label: i18n("Text lines:") + minimumValue: 1 maximumValue: 10 stepSize: 1 } - // Row 14: Spacing Item { - Layout.row: 14 - Layout.column: 0 - Layout.minimumHeight: units.largeSpacing + Kirigami.FormData.isSection: true } - // Row 15: "Features" - "Tool tips" - Label { - Layout.row: 15 - Layout.column: 0 - - text: i18n("Features:") - } + // Features section CheckBox { id: toolTips - Layout.row: 15 - Layout.column: 1 - Layout.columnSpan: 3 - text: i18n("Tool tips") + Kirigami.FormData.label: i18n("Features:") + + text: i18n("Tooltips") } - // Row 16: "Features" - "Selection markers" CheckBox { id: selectionMarkers - Layout.row: 16 - Layout.column: 1 - Layout.columnSpan: 3 - visible: Qt.styleHints.singleClickActivation text: i18n("Selection markers") } - // Row 17: "Features" - "Folder preview popups" CheckBox { id: popups - Layout.row: 17 - Layout.column: 1 - Layout.columnSpan: 3 - visible: !isPopup text: i18n("Folder preview popups") } - // Rows 18+19: "Features" - "Preview thumbnails" CheckBox { id: previews - Layout.row: 18 - Layout.column: 1 - Layout.columnSpan: 3 text: i18n("Preview thumbnails") } Button { id: previewSettings - Layout.row: 19 - Layout.column: 3 - Layout.alignment: Qt.AlignRight text: i18n("More Preview Options...") diff --git a/containments/desktop/package/contents/ui/ConfigLocation.qml b/containments/desktop/package/contents/ui/ConfigLocation.qml --- a/containments/desktop/package/contents/ui/ConfigLocation.qml +++ b/containments/desktop/package/contents/ui/ConfigLocation.qml @@ -22,6 +22,7 @@ import QtQuick.Layouts 1.0 import org.kde.plasma.plasmoid 2.0 +import org.kde.kirigami 2.4 as Kirigami import org.kde.private.desktopcontainment.folder 0.1 as Folder @@ -84,178 +85,143 @@ } } - GridLayout { - - // Row 0: "Show the Desktop folder" - Label { - id: locationLabel - Layout.column: 0 - Layout.row: 0 - text: i18n("Location:") - } + Kirigami.FormLayout { + anchors.horizontalCenter: parent.horizontalCenter RadioButton { id: locationDesktop - Layout.row: 0 - Layout.column: 1 - Layout.columnSpan: 3 - text: i18n("Show the Desktop folder") + + Kirigami.FormData.label: i18n("Show:") + + text: i18n("Desktop folder") exclusiveGroup: locationGroup } - // Row 1: "Show files linked to the current activity" RadioButton { id: locationCurrentActivity - Layout.row: 1 - Layout.column: 1 - Layout.columnSpan: 3 - visible: placesModel.activityLinkingEnabled - text: i18n("Show files linked to the current activity") + + text: i18n("Files linked to the current activity") exclusiveGroup: locationGroup } - // Rows 2+3: "Show a place" RadioButton { id: locationPlace - Layout.row: 2 - Layout.column: 1 - Layout.columnSpan: 3 - text: i18n("Show a place:") + + text: i18n("Places panel item:") exclusiveGroup: locationGroup onCheckedChanged: { locationPlaceValue.enabled = checked; } } + RowLayout { + Layout.fillWidth: true - Item { - id: indentSpacer - Layout.row: 3 - Layout.column: 1 - Layout.minimumWidth: units.largeSpacing - } + Item { + width: units.largeSpacing + } + ComboBox { + id: locationPlaceValue - ComboBox { - id: locationPlaceValue - Layout.row: 3 - Layout.column: 2 - Layout.columnSpan: 2 - Layout.fillWidth: true + Layout.fillWidth: true - model: placesModel - textRole: "display" + model: placesModel + textRole: "display" - enabled: true + enabled: true - onEnabledChanged: { - if (enabled && currentIndex != -1) { - cfg_url = placesModel.urlForIndex(currentIndex); + onEnabledChanged: { + if (enabled && currentIndex != -1) { + cfg_url = placesModel.urlForIndex(currentIndex); + } } - } - onActivated: { - cfg_url = placesModel.urlForIndex(index); + onActivated: { + cfg_url = placesModel.urlForIndex(index); + } } } - // Rows 4+5: "Specify a folder" - RadioButton { id: locationCustom - Layout.row: 4 - Layout.column: 1 - Layout.columnSpan: 3 exclusiveGroup: locationGroup - text: i18n("Specify a folder:") + text: i18n("Custom location:") } - TextField { - id: locationCustomValue - Layout.row: 5 - Layout.column: 2 + RowLayout { Layout.fillWidth: true + Item { + width: units.largeSpacing + } + TextField { + id: locationCustomValue + enabled: locationCustom.checked + Layout.fillWidth: true - enabled: locationCustom.checked - - placeholderText: i18n("Type a path or a URL here") + placeholderText: i18n("Type a path or a URL here") - onEnabledChanged: { - if (enabled && text != "") { - cfg_url = text; + onEnabledChanged: { + if (enabled && text != "") { + cfg_url = text; + } } - } - onTextChanged: { - if (enabled) { - cfg_url = text; + onTextChanged: { + if (enabled) { + cfg_url = text; + } } } - } - - Button { - Layout.row: 5 - Layout.column: 3 - Layout.alignment: Qt.AlignLeft - iconName: "document-open" + Button { + iconName: "document-open" - enabled: locationCustom.checked + enabled: locationCustom.checked - onClicked: { - directoryPicker.open(); + onClicked: { + directoryPicker.open(); + } } - } + Folder.DirectoryPicker { + id: directoryPicker - Folder.DirectoryPicker { - id: directoryPicker - - onUrlChanged: { - locationCustomValue.text = url; + onUrlChanged: { + locationCustomValue.text = url; + } } } - // Row 6: Spacing Item { - id: titleSpacer - Layout.column: 0 - Layout.row: 6 - Layout.minimumHeight: units.largeSpacing - visible: titleVisible - } - - // Rows 7+8: "Title" - Label { - id: titleLabel - Layout.column: 0 - Layout.row: 7 - text: i18n("Title:") visible: titleVisible + Kirigami.FormData.isSection: true } ComboBox { id: labelMode - Layout.row: 7 - Layout.column: 1 - Layout.columnSpan: 3 - Layout.fillWidth: true visible: titleVisible + Layout.fillWidth: true + + Kirigami.FormData.label: i18n("Title:") model: [i18n("None"), i18n("Default"), i18n("Full path"), i18n("Custom title")] } - TextField { - id: labelText - Layout.row: 8 - Layout.column: 2 - Layout.columnSpan: 2 + RowLayout { Layout.fillWidth: true visible: titleVisible - enabled: (labelMode.currentIndex == 3) + Item { + width: units.largeSpacing + } + TextField { + id: labelText + Layout.fillWidth: true + enabled: (labelMode.currentIndex == 3) - placeholderText: i18n("Enter custom title here") + placeholderText: i18n("Enter custom title here") + } } } }