summaryrefslogtreecommitdiffstats
path: root/imports/agl-demo-controls
diff options
context:
space:
mode:
Diffstat (limited to 'imports/agl-demo-controls')
-rw-r--r--imports/agl-demo-controls/AbstractKeyboard.qml36
-rw-r--r--imports/agl-demo-controls/Alphabet.qml140
-rw-r--r--imports/agl-demo-controls/ImageButton.qml46
-rw-r--r--imports/agl-demo-controls/Key.qml90
-rw-r--r--imports/agl-demo-controls/Keyboard.qml58
-rw-r--r--imports/agl-demo-controls/Symbols.qml138
-rw-r--r--imports/agl-demo-controls/ToggleButton.qml31
-rw-r--r--imports/agl-demo-controls/agl-demo-controls.pro8
-rw-r--r--imports/agl-demo-controls/images/Keyboard_Arrow.svg65
-rw-r--r--imports/agl-demo-controls/images/Keyboard_Back.svg57
-rw-r--r--imports/agl-demo-controls/images/Keyboard_Shift.svg57
-rw-r--r--imports/agl-demo-controls/images/Keyboard_Space.svg57
-rw-r--r--imports/agl-demo-controls/qmldir3
13 files changed, 786 insertions, 0 deletions
diff --git a/imports/agl-demo-controls/AbstractKeyboard.qml b/imports/agl-demo-controls/AbstractKeyboard.qml
new file mode 100644
index 0000000..94e1eeb
--- /dev/null
+++ b/imports/agl-demo-controls/AbstractKeyboard.qml
@@ -0,0 +1,36 @@
+/*
+ * Copyright (C) 2016 The Qt Company Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import QtQuick 2.6
+import QtQuick.Window 2.0
+
+Item {
+ id: root
+ implicitWidth: Screen.width
+ implicitHeight: Screen.height / 3
+ signal show()
+ signal hide()
+ signal toggleMode()
+ property Item target
+
+ onTargetChanged: {
+ var v = target && target.activeFocus && typeof(target.inputMethodComposing) !== 'undefined'
+ if (v)
+ show()
+ else
+ hide()
+ }
+}
diff --git a/imports/agl-demo-controls/Alphabet.qml b/imports/agl-demo-controls/Alphabet.qml
new file mode 100644
index 0000000..3a0fb6f
--- /dev/null
+++ b/imports/agl-demo-controls/Alphabet.qml
@@ -0,0 +1,140 @@
+/*
+ * Copyright (C) 2016 The Qt Company Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import QtQuick 2.6
+import QtQuick.Window 2.0
+import QtQuick.Layouts 1.1
+
+AbstractKeyboard {
+ id: root
+
+ ColumnLayout {
+ anchors.fill: parent
+ anchors.margins: root.height / 10
+ RowLayout {
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ Repeater {
+ model: ['q', 'w', 'e', 'r', 't', 'y', 'u', 'i', 'o', 'p']
+ delegate: Key {
+ text: model.modelData
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ capital: shift.checked
+ }
+ }
+ }
+ RowLayout {
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ Item {
+ Layout.preferredWidth: 1
+ Layout.fillWidth: true
+ }
+
+ Repeater {
+ model: ['a', 's', 'd', 'f', 'g', 'h', 'j', 'k', 'l']
+ delegate: Key {
+ text: model.modelData
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ capital: shift.checked
+ }
+ }
+ Item {
+ Layout.preferredWidth: 1
+ Layout.fillWidth: true
+ }
+ }
+ RowLayout {
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ Key {
+ id: shift
+ image: './images/Keyboard_Shift.svg'
+ checkable: true
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ }
+ Repeater {
+ model: ['z', 'x', 'c', 'v', 'b', 'n', 'm', '@']
+ delegate: Key {
+ text: model.modelData
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ capital: shift.checked
+ }
+ }
+ Key {
+ image: './images/Keyboard_Back.svg'
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ onClicked: {
+ if (!clearSelctedText()) {
+ var input = keyboard.target
+ if (input.cursorPosition > 0)
+ keyboard.target.remove(input.cursorPosition - 1, input.cursorPosition)
+ }
+ }
+ }
+ }
+ RowLayout {
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ Key {
+ text: '123'
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ onClicked: root.toggleMode()
+ }
+ Key {
+ text: '.'
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ }
+ Key {
+ text: ' '
+ image: './images/Keyboard_Space.svg'
+ Layout.preferredWidth: 12
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ }
+ Key {
+ text: '!?'
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ onClicked: root.toggleMode()
+ }
+ Key {
+ image: './images/Keyboard_Arrow.svg'
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ onClicked: {
+ root.hide()
+ }
+ }
+ }
+ }
+}
diff --git a/imports/agl-demo-controls/ImageButton.qml b/imports/agl-demo-controls/ImageButton.qml
new file mode 100644
index 0000000..c8d05b1
--- /dev/null
+++ b/imports/agl-demo-controls/ImageButton.qml
@@ -0,0 +1,46 @@
+/*
+ * Copyright (C) 2016 The Qt Company Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import QtQuick 2.6
+import QtQuick.Templates 2.0 as T
+
+T.Button {
+ id: control
+ implicitWidth: contentItem.implicitWidth
+ implicitHeight: contentItem.implicitHeight
+
+ property url offImage
+ property url onImage: offImage
+
+ contentItem: Image {
+ source: control.pressed ? control.onImage : control.offImage
+ transform: [
+ Translate {
+ id: translate
+ }
+ ]
+ states: [
+ State {
+ when: control.pressed
+ PropertyChanges {
+ target: translate
+ x: 5
+ y: 5
+ }
+ }
+ ]
+ }
+}
diff --git a/imports/agl-demo-controls/Key.qml b/imports/agl-demo-controls/Key.qml
new file mode 100644
index 0000000..a81a126
--- /dev/null
+++ b/imports/agl-demo-controls/Key.qml
@@ -0,0 +1,90 @@
+/*
+ * Copyright (C) 2016 The Qt Company Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import QtQuick 2.6
+
+MouseArea {
+ id: root
+ implicitWidth: 50
+ implicitHeight: 80
+ property string text
+ property alias image: image.source
+ property bool checkable: false
+ property bool checked: false
+ property bool capital: false
+
+ onClicked: {
+ if (checkable) {
+ checked = !checked
+ } else {
+ if (label.text.length === 1)
+ insert(label.text)
+ }
+ }
+
+ function clearSelctedText() {
+ var input = keyboard.target
+ if (input.selectedText.length > 0) {
+ input.remove(input.selectionStart, input.selectionEnd)
+ return true
+ }
+ return false
+ }
+
+ function insert(text) {
+ clearSelctedText()
+ var input = keyboard.target
+ keyboard.target.insert(input.cursorPosition, text)
+ }
+
+ Rectangle {
+ anchors.fill: parent
+ border.width: 2
+ border.color: 'white'
+ smooth: true
+ radius: root.height / 10
+ color: 'gray'
+ Rectangle {
+ anchors.fill: parent
+ radius: parent.radius
+ opacity: root.pressed || root.checked ? 0 : 0.5
+ gradient: Gradient {
+ GradientStop {
+ position: 0.0
+ color: 'transparent'
+ }
+ GradientStop {
+ position: 1.0
+ color: '#66FF99'
+ }
+ }
+ }
+ }
+
+ Text {
+ id: label
+ anchors.centerIn: parent
+ color: 'white'
+ font.pixelSize: root.height / 2
+ text: root.capital ? root.text.toUpperCase() : root.text.toLowerCase()
+ }
+
+ Image {
+ id: image
+ anchors.centerIn: parent
+ scale: 0.8
+ }
+}
diff --git a/imports/agl-demo-controls/Keyboard.qml b/imports/agl-demo-controls/Keyboard.qml
new file mode 100644
index 0000000..f1af9d9
--- /dev/null
+++ b/imports/agl-demo-controls/Keyboard.qml
@@ -0,0 +1,58 @@
+/*
+ * Copyright (C) 2016 The Qt Company Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import QtQuick 2.6
+import QtQuick.Window 2.0
+import QtQuick.Layouts 1.1
+import QtQuick.Controls 2.0
+
+Item {
+ id: root
+ implicitWidth: Screen.width
+ implicitHeight: Screen.height / 2
+
+ property Item target
+ visible: false
+
+ Rectangle {
+ anchors.fill: parent
+ color: 'black'
+ opacity: 0.5
+ }
+
+ property AbstractKeyboard active: alphabet
+ Alphabet {
+ id: alphabet
+ anchors.fill: parent
+ anchors.margins: parent.height / 20
+ target: root.target
+ visible: root.active === alphabet
+ onShow: root.visible = true
+ onHide: root.visible = false
+ onToggleMode: root.active = symbols
+ }
+
+ Symbols {
+ id: symbols
+ anchors.fill: parent
+ anchors.margins: parent.height / 20
+ target: root.target
+ visible: root.active === symbols
+ onShow: root.visible = true
+ onHide: root.visible = false
+ onToggleMode: root.active = alphabet
+ }
+}
diff --git a/imports/agl-demo-controls/Symbols.qml b/imports/agl-demo-controls/Symbols.qml
new file mode 100644
index 0000000..a47ccea
--- /dev/null
+++ b/imports/agl-demo-controls/Symbols.qml
@@ -0,0 +1,138 @@
+/*
+ * Copyright (C) 2016 The Qt Company Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import QtQuick 2.6
+import QtQuick.Window 2.0
+import QtQuick.Layouts 1.1
+
+AbstractKeyboard {
+ id: root
+
+ ColumnLayout {
+ anchors.fill: parent
+ anchors.margins: root.height / 10
+ RowLayout {
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ Repeater {
+ model: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0']
+ delegate: Key {
+ text: model.modelData
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ }
+ }
+ }
+ RowLayout {
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ Item {
+ Layout.preferredWidth: 1
+ Layout.fillWidth: true
+ }
+
+ Repeater {
+ model: ['@', '#', '%', '&', '*', '-', '+', '(', ')']
+ delegate: Key {
+ text: model.modelData
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ }
+ }
+ Item {
+ Layout.preferredWidth: 1
+ Layout.fillWidth: true
+ }
+ }
+ RowLayout {
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ Key {
+ id: shift
+ image: './images/Keyboard_Shift.svg'
+ checkable: true
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ }
+ Repeater {
+ model: ['!', '"', '<', '>', '\'', ':', ';', '/']
+ delegate: Key {
+ text: model.modelData
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ capital: shift.checked
+ }
+ }
+ Key {
+ image: './images/Keyboard_Back.svg'
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ onClicked: {
+ if (!clearSelctedText()) {
+ var input = keyboard.target
+ if (input.cursorPosition > 0)
+ keyboard.target.remove(input.cursorPosition - 1, input.cursorPosition)
+ }
+ }
+ }
+ }
+ RowLayout {
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ Key {
+ text: 'ABC'
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ onClicked: root.toggleMode()
+ }
+ Key {
+ text: '.'
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ }
+ Key {
+ text: ' '
+ image: './images/Keyboard_Space.svg'
+ Layout.preferredWidth: 12
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ }
+ Key {
+ text: '!?'
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ onClicked: root.toggleMode()
+ }
+ Key {
+ image: './images/Keyboard_Arrow.svg'
+ Layout.preferredWidth: 2
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ onClicked: {
+ root.hide()
+ }
+ }
+ }
+ }
+}
diff --git a/imports/agl-demo-controls/ToggleButton.qml b/imports/agl-demo-controls/ToggleButton.qml
new file mode 100644
index 0000000..4a9fc72
--- /dev/null
+++ b/imports/agl-demo-controls/ToggleButton.qml
@@ -0,0 +1,31 @@
+/*
+ * Copyright (C) 2016 The Qt Company Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import QtQuick 2.6
+import QtQuick.Templates 2.0 as T
+
+T.CheckBox {
+ id: control
+ implicitWidth: contentItem.implicitWidth
+ implicitHeight: contentItem.implicitHeight
+
+ property url onImage
+ property url offImage
+
+ contentItem: Image {
+ source: control.checked ? control.onImage : control.offImage
+ }
+}
diff --git a/imports/agl-demo-controls/agl-demo-controls.pro b/imports/agl-demo-controls/agl-demo-controls.pro
new file mode 100644
index 0000000..988edd1
--- /dev/null
+++ b/imports/agl-demo-controls/agl-demo-controls.pro
@@ -0,0 +1,8 @@
+TEMPLATE = aux
+
+DISTFILES = *.qml qmldir images
+
+files.files = $$DISTFILES
+files.path = $$[QT_INSTALL_QML]/AGL/Demo/Controls
+
+INSTALLS += files
diff --git a/imports/agl-demo-controls/images/Keyboard_Arrow.svg b/imports/agl-demo-controls/images/Keyboard_Arrow.svg
new file mode 100644
index 0000000..0b28afe
--- /dev/null
+++ b/imports/agl-demo-controls/images/Keyboard_Arrow.svg
@@ -0,0 +1,65 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+
+<svg
+ xmlns:i="&amp;ns_ai;"
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ version="1.1"
+ id="Layer_1"
+ x="0px"
+ y="0px"
+ viewBox="0 0 89.6 119.8"
+ style="enable-background:new 0 0 89.6 119.8;"
+ xml:space="preserve"
+ inkscape:version="0.91 r13725"
+ sodipodi:docname="Keyboard_Arrow.svg"><metadata
+ id="metadata42"><rdf:RDF><cc:Work
+ rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
+ id="defs40" /><sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="2560"
+ inkscape:window-height="1464"
+ id="namedview38"
+ showgrid="false"
+ inkscape:zoom="1.9699499"
+ inkscape:cx="-219.92755"
+ inkscape:cy="59.900002"
+ inkscape:window-x="0"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="Layer_1" /><style
+ type="text/css"
+ id="style3">
+ .st0{opacity:0.42;fill:#ACACA5;}
+ .st1{opacity:0.42;fill:url(#SVGID_1_);}
+ .st2{fill:none;stroke:#ACACA5;stroke-miterlimit:10;}
+ .st3{fill:none;stroke:#FFFFFF;stroke-width:2;stroke-miterlimit:10;}
+ .st4{fill:#FFFFFF;}
+</style><switch
+ id="switch5"><g
+ i:extraneous="self"
+ id="g7"><g
+ id="g9"><g
+ id="g28"><g
+ id="g30"><polyline
+ class="st3"
+ points="53.7,44 53.7,71.2 22,71.2 "
+ id="polyline32" /><g
+ id="g34"><path
+ class="st4"
+ d="M35.7,61.6c0.3,0.5,0.2,1.1-0.3,1.4l-12.9,8.2l12.9,8.2c0.5,0.3,0.6,0.9,0.3,1.4 c-0.3,0.5-0.9,0.6-1.4,0.3l-14.2-9.1c-0.3-0.2-0.5-0.5-0.5-0.8c0-0.3,0.2-0.7,0.5-0.8l14.2-9.1c0.2-0.1,0.4-0.2,0.5-0.2 C35.2,61.2,35.5,61.3,35.7,61.6z"
+ id="path36" /></g></g></g></g></g></switch></svg> \ No newline at end of file
diff --git a/imports/agl-demo-controls/images/Keyboard_Back.svg b/imports/agl-demo-controls/images/Keyboard_Back.svg
new file mode 100644
index 0000000..e28b58e
--- /dev/null
+++ b/imports/agl-demo-controls/images/Keyboard_Back.svg
@@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+
+<svg
+ xmlns:i="&amp;ns_ai;"
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ version="1.1"
+ id="Layer_1"
+ x="0px"
+ y="0px"
+ viewBox="0 0 78.3 119.8"
+ style="enable-background:new 0 0 78.3 119.8;"
+ xml:space="preserve"
+ inkscape:version="0.91 r13725"
+ sodipodi:docname="Keyboard_Inactive_Back.svg"><metadata
+ id="metadata21"><rdf:RDF><cc:Work
+ rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
+ id="defs19" /><sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="2560"
+ inkscape:window-height="1464"
+ id="namedview17"
+ showgrid="false"
+ inkscape:zoom="1.9699499"
+ inkscape:cx="-229.89238"
+ inkscape:cy="59.900002"
+ inkscape:window-x="0"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="Layer_1" /><style
+ type="text/css"
+ id="style3">
+ .st0{opacity:0.42;fill:#ACACA5;}
+ .st1{fill:none;stroke:#ACACA5;stroke-miterlimit:10;}
+ .st2{fill:#FFFFFF;}
+</style><switch
+ id="switch5"><g
+ i:extraneous="self"
+ id="g7"><g
+ id="g9"><path
+ class="st2"
+ d="M61.5,45.1H26.3c-0.5,0-1,0.2-1.3,0.5L10.6,59.9c-0.3,0.3-0.5,0.8-0.5,1.3s0.2,1,0.5,1.3L25,76.9 c0.3,0.3,0.8,0.5,1.3,0.5h35.3c1,0,1.8-0.8,1.8-1.8V46.9C63.4,45.9,62.5,45.1,61.5,45.1z M48.8,65.6c0.9,0.9,0.9,2.2,0,3.1 c-0.8,0.8-2.2,0.8-3.1,0l-4.3-4.3L37,68.7c-0.8,0.9-2.2,0.8-3.1,0c-0.8-0.8-0.9-2.2,0-3.1l4.3-4.3L34,56.9 c-0.8-0.8-0.8-2.2,0-3.1c0.9-0.9,2.2-0.8,3.1,0l4.3,4.3l4.4-4.4c0.8-0.8,2.2-0.8,3.1,0c0.8,0.8,0.8,2.2,0,3.1l-4.4,4.4L48.8,65.6 z"
+ id="path15" /></g></g></switch></svg> \ No newline at end of file
diff --git a/imports/agl-demo-controls/images/Keyboard_Shift.svg b/imports/agl-demo-controls/images/Keyboard_Shift.svg
new file mode 100644
index 0000000..ff322aa
--- /dev/null
+++ b/imports/agl-demo-controls/images/Keyboard_Shift.svg
@@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+
+<svg
+ xmlns:i="&amp;ns_ai;"
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ version="1.1"
+ id="Layer_1"
+ x="0px"
+ y="0px"
+ viewBox="0 0 78.3 119.8"
+ style="enable-background:new 0 0 78.3 119.8;"
+ xml:space="preserve"
+ inkscape:version="0.91 r13725"
+ sodipodi:docname="Keyboard_Inactive_Shift.svg"><metadata
+ id="metadata21"><rdf:RDF><cc:Work
+ rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
+ id="defs19" /><sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="2560"
+ inkscape:window-height="1464"
+ id="namedview17"
+ showgrid="false"
+ inkscape:zoom="1.9699499"
+ inkscape:cx="-186.99789"
+ inkscape:cy="59.900002"
+ inkscape:window-x="0"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="Layer_1" /><style
+ type="text/css"
+ id="style3">
+ .st0{opacity:0.42;fill:#ACACA5;}
+ .st1{fill:none;stroke:#ACACA5;stroke-miterlimit:10;}
+ .st2{fill:#FFFFFF;}
+</style><switch
+ id="switch5"><g
+ i:extraneous="self"
+ id="g7"><g
+ id="g9"><polygon
+ class="st2"
+ points="18.7,59.9 39.1,32.2 59.6,59.9 49.6,59.9 49.6,87.6 28.7,87.6 28.7,59.9 "
+ id="polygon15" /></g></g></switch></svg> \ No newline at end of file
diff --git a/imports/agl-demo-controls/images/Keyboard_Space.svg b/imports/agl-demo-controls/images/Keyboard_Space.svg
new file mode 100644
index 0000000..ee22b48
--- /dev/null
+++ b/imports/agl-demo-controls/images/Keyboard_Space.svg
@@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+
+<svg
+ xmlns:i="&amp;ns_ai;"
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ version="1.1"
+ id="Layer_1"
+ x="0px"
+ y="0px"
+ viewBox="0 0 502.4 119.8"
+ style="enable-background:new 0 0 502.4 119.8;"
+ xml:space="preserve"
+ inkscape:version="0.91 r13725"
+ sodipodi:docname="Keyboard_Inactive_Space.svg"><metadata
+ id="metadata21"><rdf:RDF><cc:Work
+ rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
+ id="defs19" /><sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="2560"
+ inkscape:window-height="1464"
+ id="namedview17"
+ showgrid="false"
+ inkscape:zoom="1.3375796"
+ inkscape:cx="-58.688095"
+ inkscape:cy="59.900002"
+ inkscape:window-x="0"
+ inkscape:window-y="0"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="Layer_1" /><style
+ type="text/css"
+ id="style3">
+ .st0{opacity:0.42;fill:#ACACA5;}
+ .st1{fill:none;stroke:#ACACA5;stroke-miterlimit:10;}
+ .st2{fill:none;stroke:#FFFFFF;stroke-width:5;stroke-miterlimit:10;}
+</style><switch
+ id="switch5"><g
+ i:extraneous="self"
+ id="g7"><g
+ id="g9"><polyline
+ class="st2"
+ points="204.9,54.3 204.9,76.7 301.9,76.7 301.9,54.3 "
+ id="polyline15" /></g></g></switch></svg> \ No newline at end of file
diff --git a/imports/agl-demo-controls/qmldir b/imports/agl-demo-controls/qmldir
new file mode 100644
index 0000000..09e4bb7
--- /dev/null
+++ b/imports/agl-demo-controls/qmldir
@@ -0,0 +1,3 @@
+ToggleButton 1.0 ToggleButton.qml
+ImageButton 1.0 ImageButton.qml
+Keyboard 1.0 Keyboard.qml