Unity 8
 All Classes Functions Properties
PinLockscreen.qml
1 /*
2  * Copyright (C) 2013 Canonical, Ltd.
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; version 3.
7  *
8  * This program is distributed in the hope that it will be useful,
9  * but WITHOUT ANY WARRANTY; without even the implied warranty of
10  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11  * GNU General Public License for more details.
12  *
13  * You should have received a copy of the GNU General Public License
14  * along with this program. If not, see <http://www.gnu.org/licenses/>.
15  */
16 
17 import QtQuick 2.0
18 import Ubuntu.Components 0.1
19 import Ubuntu.Components.ListItems 0.1
20 import "../Components"
21 
22 Column {
23  id: root
24  anchors.centerIn: parent
25  spacing: units.gu(3.5)
26 
27  property alias placeholderText: pinentryField.placeholderText
28  property int padWidth: units.gu(34)
29  property int padHeight: units.gu(28)
30  property int pinLength: -1
31 
32  signal entered(string passphrase)
33  signal cancel()
34 
35  property bool entryEnabled: true
36 
37  function clear(playAnimation) {
38  pinentryField.text = "";
39  if (playAnimation) {
40  wrongPasswordAnimation.start();
41  }
42  }
43 
44 
45  UbuntuShape {
46  id: pinentryField
47  objectName: "pinentryField"
48  anchors.horizontalCenter: parent.horizontalCenter
49  color: "#55000000"
50  width:root.padWidth
51  height: units.gu(5)
52  radius: "medium"
53  property string text: ""
54  property string placeholderText: ""
55  onTextChanged: {
56  pinentryFieldLabel.text = "";
57  for (var i = 0; i < text.length; ++i) {
58  pinentryFieldLabel.text += "•";
59  }
60  if (text.length === root.pinLength) {
61  root.entered(text);
62  }
63  }
64 
65  Label {
66  id: pinentryFieldLabel
67  anchors.centerIn: parent
68  width: parent.width - (backspaceIcon.width + backspaceIcon.anchors.rightMargin) * 2
69  elide: Text.ElideMiddle
70  horizontalAlignment: Text.AlignHCenter
71  font.pixelSize: units.dp(44)
72  color: "#f3f3e7"
73  opacity: 0.6
74  }
75  Label {
76  id: pinentryFieldPlaceHolder
77  anchors.centerIn: parent
78  color: "grey"
79  text: parent.placeholderText
80  visible: pinentryFieldLabel.text.length == 0
81  }
82 
83  Icon {
84  id: backspaceIcon
85  objectName: "backspaceIcon"
86  anchors {
87  top: parent.top
88  topMargin: units.gu(1)
89  right: parent.right
90  rightMargin: units.gu(2)
91  bottom: parent.bottom
92  bottomMargin: units.gu(1)
93  }
94  visible: root.pinLength == -1
95  width: height
96  name: "erase"
97  MouseArea {
98  anchors.fill: parent
99  onClicked: pinentryField.text = pinentryField.text.substring(0, pinentryField.text.length-1);
100  }
101  }
102  }
103 
104  UbuntuShape {
105  anchors {
106  left: parent.left
107  right: parent.right
108  margins: (parent.width - root.padWidth) / 2
109  }
110  height: root.padHeight
111  color: "#55000000"
112  radius: "medium"
113 
114  ThinDivider {
115  anchors {
116  left: parent.left
117  right: parent.right
118  top: parent.top
119  topMargin: root.padHeight / 4
120  }
121  }
122  ThinDivider {
123  anchors {
124  left: parent.left
125  right: parent.right
126  verticalCenter: parent.verticalCenter
127  }
128  }
129  ThinDivider {
130  anchors {
131  left: parent.left
132  right: parent.right
133  bottom: parent.bottom
134  bottomMargin: root.padHeight / 4
135  }
136  }
137 
138  ThinDivider {
139  anchors.centerIn: parent
140  anchors.horizontalCenterOffset: -root.padWidth / 6
141  width: root.padHeight
142  rotation: -90
143  }
144  ThinDivider {
145  anchors.centerIn: parent
146  anchors.horizontalCenterOffset: root.padWidth / 6
147  width: root.padHeight
148  rotation: -90
149  }
150 
151  Grid {
152  anchors {
153  left: parent.left
154  right: parent.right
155  margins: (parent.width - root.padWidth) / 2
156  }
157 
158  columns: 3
159 
160  Repeater {
161  model: 9
162 
163  PinPadButton {
164  objectName: "pinPadButton" + (index + 1)
165  width: root.padWidth / 3
166  height: root.padHeight / 4
167  text: index + 1
168  enabled: entryEnabled
169 
170  onClicked: {
171  pinentryField.text = pinentryField.text + text;
172  }
173  }
174  }
175 
176  PinPadButton {
177  objectName: "pinPadButtonBack"
178  width: root.padWidth / 3
179  height: root.padHeight / 4
180  subText: "CANCEL"
181  onClicked: root.cancel();
182  }
183 
184  PinPadButton {
185  objectName: "pinPadButton0"
186  width: root.padWidth / 3
187  height: root.padHeight / 4
188  text: "0"
189  onClicked: pinentryField.text = pinentryField.text + text
190  enabled: entryEnabled
191  }
192 
193  PinPadButton {
194  objectName: "pinPadButtonErase"
195  width: root.padWidth / 3
196  height: root.padHeight / 4
197  iconName: root.pinLength == -1 ? "" : "erase"
198  subText: root.pinLength == -1 ? "DONE" : ""
199  onClicked: {
200  if (root.pinLength !== -1) {
201  pinentryField.text = pinentryField.text.substring(0, pinentryField.text.length-1);
202  } else {
203  root.entered(pinentryField.text);
204  }
205  }
206  enabled: entryEnabled
207  }
208  }
209  }
210 
211  WrongPasswordAnimation {
212  id: wrongPasswordAnimation
213  objectName: "wrongPasswordAnimation"
214  target: pinentryField
215  }
216 }