Differential D22468 Diff 61910 kcm/package/contents/ui/Output.qml

Changeset View

Standalone View

View Options

kcm/package/contents/ui/Output.qml

  • This file was added.
1​/********************************************************************
2​Copyright © 2019 Roman Gilg <subdiff@gmail.com>
3​Copyright © 2012 Dan Vratil <dvratil@redhat.com>
4​
5​This program is free software; you can redistribute it and/or modify
6​it under the terms of the GNU General Public License as published by
7​the Free Software Foundation; either version 2 of the License, or
8​(at your option) any later version.
9​
10​This program is distributed in the hope that it will be useful,
11​but WITHOUT ANY WARRANTY; without even the implied warranty of
12​MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
13​GNU General Public License for more details.
14​
15​You should have received a copy of the GNU General Public License
16​along with this program. If not, see <http://www.gnu.org/licenses/>.
17​*********************************************************************/
18​import QtQuick 2.12
19​import QtQuick.Layouts 1.1
20​import QtQuick.Controls 2.3 as Controls
21​import QtGraphicalEffects 1.0
22​
23​Rectangle {
24​ id: output
25​
26​ property bool isSelected: root.selectedOutput === model.index
27​
28​ onIsSelectedChanged: {
29​ if (isSelected) {
30​ z = 89;
31​ } else {
32​ z = 0;
33​ }
34​ }
35​
36​ function getAbsolutePosition(pos) {
37​ return Qt.point((pos.x - screen.xOffset) * screen.relativeFactor,
38​ (pos.y - screen.yOffset) * screen.relativeFactor) ;
39​ }
40​
41​ x: model.position.x / screen.relativeFactor + screen.xOffset
42​ y: model.position.y / screen.relativeFactor + screen.yOffset
43​
44​ width: model.size.width / screen.relativeFactor
45​ height: model.size.height / screen.relativeFactor
46​
47​ SystemPalette {
48​ id: palette
49​ }
50​
51​ radius: 4
52​ color: palette.window
53​ smooth: true
54​ clip: true
55​
56​ border {
57​ color: isSelected ? palette.highlight : palette.shadow
58​ width: 1
59​
60​ Behavior on color {
61​ PropertyAnimation {
62​ duration: 150
63​ }
64​ }
65​ }
66​
67​ Item {
68​ anchors.fill: parent
69​
70​ ColumnLayout {
71​ anchors.centerIn: parent
72​ spacing: units.smallSpacing
73​ width: parent.width
74​ Layout.maximumHeight: parent.height
75​
76​ Controls.Label {
77​ Layout.fillWidth: true
78​ Layout.margins: units.smallSpacing
79​
80​ text: model.display
81​ horizontalAlignment: Text.AlignHCenter
82​ elide: Text.ElideRight
83​ color: palette.text
84​ }
85​
86​ Controls.Label {
87​ Layout.fillWidth: true
88​ Layout.margins: units.smallSpacing
89​
90​ text: "(" + model.size.width + "x" + model.size.height + ")"
91​ horizontalAlignment: Text.AlignHCenter
92​ elide: Text.ElideRight
93​ color: palette.text
94​ }
95​ }
96​ }
97​
98​ Rectangle {
99​ id: posLabel
100​
101​ y: 4
102​ x: 4
103​ width: childrenRect.width + 5
104​ height: childrenRect.height + 2
105​ radius: 4
106​
107​ opacity: model.enabled &&
108​ (tapHandler.isLongPressed || dragHandler.active) ? 0.9 : 0.0
109​
110​
111​ color: palette.shadow
112​
113​ Text {
114​ id: posLabelText
115​
116​ y: 2
117​ x: 2
118​
119​ text: model.normalizedPosition.x + "," + model.normalizedPosition.y
120​ color: "white"
121​ }
122​
123​ Behavior on opacity {
124​ PropertyAnimation {
125​ duration: 100;
126​ }
127​ }
128​ }
129​
130​ Item {
131​ id: orientationPanelContainer
132​
133​ anchors.fill: output
134​ visible: false
135​
136​ Rectangle {
137​ id: orientationPanel
138​ anchors {
139​ left: parent.left
140​ right: parent.right
141​ bottom: parent.bottom
142​ }
143​
144​ height: 10
145​ color: isSelected ? palette.highlight : palette.shadow
146​ smooth: true
147​
148​ Behavior on color {
149​ PropertyAnimation {
150​ duration: 150
151​ }
152​ }
153​ }
154​ }
155​
156​ states: [
157​ State {
158​ name: "rot90"
159​ when: model.rotation === 2
160​ PropertyChanges {
161​ target: orientationPanel
162​ height: undefined
163​ width: 10
164​ }
165​ AnchorChanges {
166​ target: orientationPanel
167​ anchors.right: undefined
168​ anchors.top: orientationPanelContainer.top
169​ }
170​ },
171​ State {
172​ name: "rot180"
173​ when: model.rotation === 4
174​ AnchorChanges {
175​ target: orientationPanel
176​ anchors.top: orientationPanelContainer.top
177​ anchors.bottom: undefined
178​ }
179​ },
180​ State {
181​ name: "rot270"
182​ when: model.rotation === 8
183​ PropertyChanges {
184​ target: orientationPanel
185​ height: undefined
186​ width: 10
187​ }
188​ AnchorChanges {
189​ target: orientationPanel
190​ anchors.left: undefined
191​ anchors.top: orientationPanelContainer.top
192​ }
193​ }
194​ ]
195​
196​ OpacityMask {
197​ anchors.fill: orientationPanelContainer
198​ source: orientationPanelContainer
199​ maskSource: output
200​ }
201​
202​ property point dragStartPosition
203​
204​ TapHandler {
205​ id: tapHandler
206​ property bool isLongPressed: false
207​
208​ function bindSelectedOutput() {
209​ root.selectedOutput
210​ = Qt.binding(function() { return model.index; });
211​ }
212​ onPressedChanged: {
213​ if (pressed) {
214​ bindSelectedOutput();
215​ dragStartPosition = Qt.point(output.x, output.y)
216​ } else {
217​ isLongPressed = false;
218​ }
219​ }
220​ onLongPressed: isLongPressed = true;
221​ longPressThreshold: 0.3
222​ }
223​ DragHandler {
224​ id: dragHandler
225​ acceptedButtons: Qt.LeftButton
226​ target: null
227​
228​ onTranslationChanged: {
229​ var newX = dragStartPosition.x + translation.x;
230​ var newY = dragStartPosition.y + translation.y;
231​ model.position = getAbsolutePosition(Qt.point(newX, newY));
232​ }
233​ }
234​}
235​