Changeset View
Changeset View
Standalone View
Standalone View
kcmkwin/kwincompositing/qml/EffectView.qml
Show All 13 Lines | |||||
14 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * | 14 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * | ||
15 | * GNU General Public License for more details. * | 15 | * GNU General Public License for more details. * | ||
16 | * * | 16 | * * | ||
17 | * You should have received a copy of the GNU General Public License * | 17 | * You should have received a copy of the GNU General Public License * | ||
18 | * along with this program. If not, see <http://www.gnu.org/licenses/>. * | 18 | * along with this program. If not, see <http://www.gnu.org/licenses/>. * | ||
19 | **************************************************************************/ | 19 | **************************************************************************/ | ||
20 | 20 | | |||
21 | import QtQuick 2.1 | 21 | import QtQuick 2.1 | ||
22 | import QtQuick.Controls 1.0 | 22 | import QtQuick.Controls 2.4 | ||
23 | import QtQuick.Controls 2.0 as QQC2 | | |||
24 | import QtQuick.Layouts 1.0 | 23 | import QtQuick.Layouts 1.0 | ||
25 | import org.kde.kwin.kwincompositing 1.0 | 24 | import org.kde.kwin.kwincompositing 1.0 | ||
26 | 25 | | |||
27 | Rectangle { | 26 | Rectangle { | ||
28 | signal changed | 27 | signal changed | ||
29 | implicitWidth: col.implicitWidth | 28 | implicitHeight: 500 | ||
30 | implicitHeight: col.implicitHeight | 29 | implicitWidth: 400 | ||
31 | | ||||
32 | Component { | | |||
33 | id: sectionHeading | | |||
34 | Rectangle { | | |||
35 | width: parent.width | | |||
36 | implicitHeight: sectionText.implicitHeight + 2 * col.spacing | | |||
37 | color: searchModel.backgroundNormalColor | | |||
38 | | ||||
39 | QQC2.Label { | | |||
40 | id: sectionText | | |||
41 | x: col.spacing | | |||
42 | y: col.spacing | | |||
43 | text: section | | |||
44 | font.weight: Font.Bold | | |||
45 | color: searchModel.sectionColor | | |||
46 | anchors.horizontalCenter: parent.horizontalCenter | | |||
47 | } | | |||
48 | } | | |||
49 | } | | |||
50 | 30 | | |||
51 | EffectConfig { | 31 | EffectConfig { | ||
52 | id: effectConfig | 32 | id: effectConfig | ||
53 | onEffectListChanged: { | 33 | onEffectListChanged: { | ||
54 | searchModel.load() | 34 | searchModel.load() | ||
55 | } | 35 | } | ||
56 | } | 36 | } | ||
57 | 37 | | |||
58 | ColumnLayout { | 38 | ColumnLayout { | ||
59 | id: col | 39 | id: col | ||
60 | anchors.fill: parent | 40 | anchors.fill: parent | ||
61 | 41 | | |||
62 | QQC2.Label { | 42 | Label { | ||
63 | id: hint | 43 | id: hint | ||
44 | Layout.fillWidth: true | ||||
45 | Layout.alignment: Qt.AlignLeft | ||||
46 | | ||||
64 | text: i18n("Hint: To find out or configure how to activate an effect, look at the effect's settings.") | 47 | text: i18n("Hint: To find out or configure how to activate an effect, look at the effect's settings.") | ||
65 | anchors { | 48 | elide: Text.ElideRight | ||
davidedmundson: good fix! | |||||
66 | top: parent.top | | |||
67 | left: parent.left | | |||
68 | } | | |||
69 | } | 49 | } | ||
70 | 50 | | |||
71 | RowLayout { | 51 | RowLayout { | ||
72 | QQC2.TextField { | 52 | TextField { | ||
73 | // TODO: needs clear button, missing in Qt | 53 | // TODO: needs clear button, missing in Qt | ||
74 | id: searchField | 54 | id: searchField | ||
75 | placeholderText: i18n("Search...") | 55 | placeholderText: i18n("Search...") | ||
76 | Layout.fillWidth: true | 56 | Layout.fillWidth: true | ||
77 | focus: true | 57 | focus: true | ||
78 | } | 58 | } | ||
79 | 59 | | |||
80 | Button { | 60 | Button { | ||
81 | iconName: "configure" | 61 | id: configureButton | ||
82 | tooltip: i18n("Configure filter") | 62 | icon.name: "configure" | ||
83 | menu: Menu { | 63 | ToolTip.visible: hovered | ||
64 | ToolTip.text: i18n("Configure filter") | ||||
65 | onClicked: menu.opened ? menu.close() : menu.open() | ||||
66 | } | ||||
67 | Menu { | ||||
68 | id: menu | ||||
69 | y: configureButton.height | ||||
70 | x: parent.width - width | ||||
davidedmundson: In RTL is this correct? | |||||
ngraham: Yep, works just fine when run with `-reverse`! | |||||
84 | MenuItem { | 71 | MenuItem { | ||
85 | text: i18n("Exclude Desktop Effects not supported by the Compositor") | 72 | text: i18n("Exclude Desktop Effects not supported by the Compositor") | ||
86 | checkable: true | 73 | checkable: true | ||
87 | checked: searchModel.filterOutUnsupported | 74 | checked: searchModel.filterOutUnsupported | ||
88 | onTriggered: { | 75 | onToggled: { | ||
89 | searchModel.filterOutUnsupported = !searchModel.filterOutUnsupported; | 76 | searchModel.filterOutUnsupported = !searchModel.filterOutUnsupported; | ||
90 | } | 77 | } | ||
91 | } | 78 | } | ||
92 | MenuItem { | 79 | MenuItem { | ||
93 | text: i18n("Exclude internal Desktop Effects") | 80 | text: i18n("Exclude internal Desktop Effects") | ||
94 | checkable: true | 81 | checkable: true | ||
95 | checked: searchModel.filterOutInternal | 82 | checked: searchModel.filterOutInternal | ||
96 | onTriggered: { | 83 | onToggled: { | ||
97 | searchModel.filterOutInternal = !searchModel.filterOutInternal | 84 | searchModel.filterOutInternal = !searchModel.filterOutInternal | ||
98 | } | 85 | } | ||
99 | } | 86 | } | ||
100 | } | 87 | } | ||
101 | } | 88 | } | ||
102 | } | | |||
103 | | ||||
104 | EffectFilterModel { | | |||
105 | id: searchModel | | |||
106 | objectName: "filterModel" | | |||
107 | filter: searchField.text | | |||
108 | } | | |||
109 | 89 | | |||
110 | ScrollView { | 90 | ScrollView { | ||
111 | id: scroll | | |||
112 | frameVisible: true | | |||
113 | highlightOnFocus: true | | |||
114 | Layout.fillWidth: true | 91 | Layout.fillWidth: true | ||
115 | Layout.fillHeight: true | 92 | Layout.fillHeight: true | ||
116 | Rectangle { | 93 | clip: true | ||
117 | color: effectView.backgroundNormalColor | 94 | | ||
118 | anchors.fill: parent | 95 | // Draw a frame around the scrollview | ||
119 | } | 96 | Component.onCompleted: background.visible = true; | ||
97 | | ||||
120 | ListView { | 98 | ListView { | ||
For the borders add this to the ScrollView Component.onCompleted: background.visible = true; davidedmundson: For the borders add this to the ScrollView
Component.onCompleted: background.visible = true;
| |||||
121 | function exclusiveGroupForCategory(category) { | 99 | function exclusiveGroupForCategory(category) { | ||
122 | for (var i = 0; i < effectView.exclusiveGroups.length; ++i) { | 100 | for (var i = 0; i < effectView.exclusiveGroups.length; ++i) { | ||
123 | var item = effectView.exclusiveGroups[i]; | 101 | var item = effectView.exclusiveGroups[i]; | ||
124 | if (item.category == category) { | 102 | if (item.category == category) { | ||
125 | return item.group; | 103 | return item.group; | ||
126 | } | 104 | } | ||
127 | } | 105 | } | ||
128 | var newGroup = Qt.createQmlObject('import QtQuick 2.1; import QtQuick.Controls 1.1; ExclusiveGroup {}', | 106 | var newGroup = Qt.createQmlObject('import QtQuick 2.1; import QtQuick.Controls 1.1; ExclusiveGroup {}', | ||
129 | effectView, | 107 | effectView, | ||
130 | "dynamicExclusiveGroup" + effectView.exclusiveGroups.length); | 108 | "dynamicExclusiveGroup" + effectView.exclusiveGroups.length); | ||
131 | effectView.exclusiveGroups[effectView.exclusiveGroups.length] = { | 109 | effectView.exclusiveGroups[effectView.exclusiveGroups.length] = { | ||
132 | 'category': category, | 110 | 'category': category, | ||
133 | 'group': newGroup | 111 | 'group': newGroup | ||
134 | }; | 112 | }; | ||
135 | return newGroup; | 113 | return newGroup; | ||
136 | } | 114 | } | ||
137 | id: effectView | 115 | id: effectView | ||
138 | property var exclusiveGroups: [] | 116 | property var exclusiveGroups: [] | ||
139 | property color backgroundNormalColor: searchModel.backgroundNormalColor | 117 | property color backgroundNormalColor: searchModel.backgroundNormalColor | ||
140 | property color backgroundAlternateColor: searchModel.backgroundAlternateColor | 118 | property color backgroundAlternateColor: searchModel.backgroundAlternateColor | ||
141 | anchors.fill: parent | 119 | anchors.fill: parent | ||
142 | model: searchModel | 120 | model: EffectFilterModel { | ||
121 | id: searchModel | ||||
122 | objectName: "filterModel" | ||||
123 | filter: searchField.text | ||||
124 | } | ||||
143 | delegate: Effect{ | 125 | delegate: Effect{ | ||
144 | id: effectDelegate | 126 | id: effectDelegate | ||
145 | Connections { | 127 | Connections { | ||
146 | id: effectStateConnection | 128 | id: effectStateConnection | ||
147 | target: null | 129 | target: null | ||
148 | onChanged: { | 130 | onChanged: { | ||
149 | searchModel.updateEffectStatus(index, checkedState); | 131 | searchModel.updateEffectStatus(index, checkedState); | ||
150 | } | 132 | } | ||
151 | } | 133 | } | ||
152 | Component.onCompleted: { | 134 | Component.onCompleted: { | ||
153 | effectStateConnection.target = effectDelegate | 135 | effectStateConnection.target = effectDelegate | ||
154 | } | 136 | } | ||
155 | } | 137 | } | ||
156 | 138 | | |||
157 | section.property: "CategoryRole" | 139 | section.property: "CategoryRole" | ||
158 | section.delegate: sectionHeading | 140 | section.delegate: Rectangle { | ||
141 | width: parent.width | ||||
142 | implicitHeight: sectionText.implicitHeight + 2 * col.spacing | ||||
143 | color: searchModel.backgroundNormalColor | ||||
144 | | ||||
145 | Label { | ||||
146 | id: sectionText | ||||
147 | anchors.fill: parent | ||||
148 | horizontalAlignment: Text.AlignHCenter | ||||
149 | verticalAlignment: Text.AlignVCenter | ||||
150 | | ||||
151 | text: section | ||||
152 | font.weight: Font.Bold | ||||
I know you've just moved this, but this is messy. You can't specify x and an horizontal anchor. It should be fill horizontally and use Text.alignment Though we can fix after. davidedmundson: I know you've just moved this, but this is messy.
You can't specify x and an horizontal anchor. | |||||
153 | color: searchModel.sectionColor | ||||
154 | } | ||||
155 | } | ||||
159 | spacing: col.spacing | 156 | spacing: col.spacing | ||
160 | focus: true | 157 | focus: true | ||
161 | } | 158 | } | ||
162 | } | 159 | } | ||
163 | 160 | | |||
164 | RowLayout { | 161 | RowLayout { | ||
165 | Layout.fillWidth: true | 162 | Layout.fillWidth: true | ||
166 | 163 | | |||
167 | Item { | 164 | Item { | ||
168 | Layout.fillWidth: true | 165 | Layout.fillWidth: true | ||
169 | } | 166 | } | ||
170 | Button { | 167 | Button { | ||
171 | id: ghnsButton | 168 | id: ghnsButton | ||
172 | text: i18n("Get New Desktop Effects...") | 169 | text: i18n("Get New Desktop Effects...") | ||
173 | iconName: "get-hot-new-stuff" | 170 | icon.name: "get-hot-new-stuff" | ||
174 | onClicked: effectConfig.openGHNS() | 171 | onClicked: effectConfig.openGHNS() | ||
175 | } | 172 | } | ||
176 | } | 173 | } | ||
177 | }//End ColumnLayout | 174 | }//End ColumnLayout | ||
178 | Connections { | 175 | Connections { | ||
179 | target: searchModel | 176 | target: searchModel | ||
180 | onDataChanged: changed() | 177 | onDataChanged: changed() | ||
181 | } | 178 | } | ||
182 | }//End item | 179 | }//End Rectangle |
good fix!