7cde4b1028
Summary: As documented via bug reports and online support requests, many users have difficulty learning that window decorations are customizable, because they don't notice or understand the little icon-only button in the bottom-left corner of each theme preview. This patch centers the buttons and adds text including the theme name , making it obvious what the buttons are for. Also, clicking on one of the buttons now automatically selects its corresponding theme, because configuring an un-selected theme doesn't make a lot of sense and could lead to user confusion once this UI is more obvious and widely-used. BUG: 390245 Test Plan: {F5761897} - Clicked on the configure buttons; each one selects its parent theme and opens its configuration dialog Reviewers: #kwin, #plasma, #vdg, cfeck, graesslin Reviewed By: #kwin, #plasma, graesslin Subscribers: richardbowen, zzag, kigwana, rkflx, matheusm, fabianr, abetts, Fuchs, graesslin, kwin Tags: #kwin Differential Revision: https://phabricator.kde.org/D11201
152 lines
6.7 KiB
QML
152 lines
6.7 KiB
QML
/*
|
|
* Copyright 2014 Martin Gräßlin <mgraesslin@kde.org>
|
|
*
|
|
* This program is free software; you can redistribute it and/or
|
|
* modify it under the terms of the GNU General Public License as
|
|
* published by the Free Software Foundation; either version 2 of
|
|
* the License or (at your option) version 3 or any later version
|
|
* accepted by the membership of KDE e.V. (or its successor approved
|
|
* by the membership of KDE e.V.), which shall act as a proxy
|
|
* defined in Section 14 of version 3 of the license.
|
|
*
|
|
* This program is distributed in the hope that it will be useful,
|
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
* GNU General Public License for more details.
|
|
*
|
|
* You should have received a copy of the GNU General Public License
|
|
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
*/
|
|
import QtQuick 2.1
|
|
import QtQuick.Controls 1.2
|
|
import QtQuick.Layouts 1.1
|
|
import org.kde.kwin.private.kdecoration 1.0 as KDecoration
|
|
import org.kde.plasma.core 2.0 as PlasmaCore;
|
|
|
|
ScrollView {
|
|
objectName: "themeList"
|
|
frameVisible: true
|
|
GridView {
|
|
id: gridView
|
|
objectName: "listView"
|
|
model: decorationsModel
|
|
cellWidth: 20 * units.gridUnit
|
|
cellHeight: cellWidth / 1.6
|
|
onContentHeightChanged: {
|
|
if (gridView.currentIndex == -1) {
|
|
gridView.currentIndex = savedIndex;
|
|
}
|
|
gridView.positionViewAtIndex(gridView.currentIndex, GridView.Visible);
|
|
}
|
|
|
|
Rectangle {
|
|
z: -1
|
|
anchors.fill: parent
|
|
color: baseColor
|
|
}
|
|
highlight: Rectangle {
|
|
color: highlightColor
|
|
opacity: 0.6
|
|
}
|
|
highlightMoveDuration: units.longDuration
|
|
boundsBehavior: Flickable.StopAtBounds
|
|
property int borderSizesIndex: 3 // 3 == Normal
|
|
delegate: Item {
|
|
width: gridView.cellWidth
|
|
height: gridView.cellHeight
|
|
KDecoration.Bridge {
|
|
id: bridgeItem
|
|
plugin: model["plugin"]
|
|
theme: model["theme"]
|
|
}
|
|
KDecoration.Settings {
|
|
id: settingsItem
|
|
bridge: bridgeItem.bridge
|
|
borderSizesIndex: gridView.borderSizesIndex
|
|
}
|
|
MouseArea {
|
|
hoverEnabled: false
|
|
anchors.fill: parent
|
|
onClicked: {
|
|
gridView.currentIndex = index;
|
|
}
|
|
}
|
|
ColumnLayout {
|
|
id: decorationPreviews
|
|
property string themeName: model["display"]
|
|
anchors.fill: parent
|
|
Item {
|
|
KDecoration.Decoration {
|
|
id: inactivePreview
|
|
bridge: bridgeItem.bridge
|
|
settings: settingsItem
|
|
anchors.fill: parent
|
|
Component.onCompleted: {
|
|
client.caption = decorationPreviews.themeName
|
|
client.active = false;
|
|
anchors.leftMargin = Qt.binding(function() { return 40 - (inactivePreview.shadow ? inactivePreview.shadow.paddingLeft : 0);});
|
|
anchors.rightMargin = Qt.binding(function() { return 10 - (inactivePreview.shadow ? inactivePreview.shadow.paddingRight : 0);});
|
|
anchors.topMargin = Qt.binding(function() { return 10 - (inactivePreview.shadow ? inactivePreview.shadow.paddingTop : 0);});
|
|
anchors.bottomMargin = Qt.binding(function() { return 40 - (inactivePreview.shadow ? inactivePreview.shadow.paddingBottom : 0);});
|
|
}
|
|
}
|
|
KDecoration.Decoration {
|
|
id: activePreview
|
|
bridge: bridgeItem.bridge
|
|
settings: settingsItem
|
|
anchors.fill: parent
|
|
Component.onCompleted: {
|
|
client.caption = decorationPreviews.themeName
|
|
client.active = true;
|
|
anchors.leftMargin = Qt.binding(function() { return 10 - (activePreview.shadow ? activePreview.shadow.paddingLeft : 0);});
|
|
anchors.rightMargin = Qt.binding(function() { return 40 - (activePreview.shadow ? activePreview.shadow.paddingRight : 0);});
|
|
anchors.topMargin = Qt.binding(function() { return 40 - (activePreview.shadow ? activePreview.shadow.paddingTop : 0);});
|
|
anchors.bottomMargin = Qt.binding(function() { return 10 - (activePreview.shadow ? activePreview.shadow.paddingBottom : 0);});
|
|
}
|
|
}
|
|
MouseArea {
|
|
hoverEnabled: false
|
|
anchors.fill: parent
|
|
onClicked: {
|
|
gridView.currentIndex = index;
|
|
}
|
|
}
|
|
Layout.fillWidth: true
|
|
Layout.fillHeight: true
|
|
/* Create an invisible rectangle that's the same size as the inner content rect
|
|
of the foreground window preview so that we can center the button within it.
|
|
We have to center rather than using anchors because the button width varies
|
|
with different localizations */
|
|
Item {
|
|
anchors {
|
|
left: parent.left
|
|
leftMargin: 10
|
|
right: parent.right
|
|
rightMargin: 40
|
|
top: parent.top
|
|
topMargin: 68
|
|
bottom: parent.bottom
|
|
bottomMargin: 10
|
|
}
|
|
Button {
|
|
id: configureButton
|
|
anchors {
|
|
horizontalCenter: parent.horizontalCenter
|
|
verticalCenter: parent.verticalCenter
|
|
}
|
|
enabled: model["configureable"]
|
|
iconName: "configure"
|
|
text: i18n("Configure %1...", decorationPreviews.themeName)
|
|
onClicked: {
|
|
gridView.currentIndex = index
|
|
bridgeItem.bridge.configure()
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
Layout.preferredHeight: 20 * units.gridUnit
|
|
}
|
|
|