@@ -0,0 +1,119 @@
1+/*
2+ * Copyright (C) 2016 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.4
18+import Ubuntu.Components 1.3
19+import Ubuntu.Components.ListItems 1.3 as ListItem
20+
21+Rectangle {
22+ id: optionToggle
23+
24+ property bool expanded
25+ property var model
26+ property int selectedIndex: -1
27+ readonly property double itemHeight: units.gu(4)
28+
29+ color: theme.palette.normal.background
30+ height: expanded ? optionToggleRepeater.count * itemHeight : itemHeight
31+ Behavior on height {
32+ UbuntuNumberAnimation {}
33+ }
34+
35+ width: parent.width
36+ radius: units.gu(0.6)
37+ clip: true
38+ border.width: units.dp(1)
39+ border.color: theme.palette.normal.base
40+
41+ Column {
42+ id: optionToggleContent
43+ width: parent.width
44+
45+ Repeater {
46+ id: optionToggleRepeater
47+ model: optionToggle.model
48+
49+ delegate: Loader {
50+ asynchronous: true
51+ visible: status === Loader.Ready
52+
53+ Component {
54+ id: optionToggleEntry
55+
56+ AbstractButton {
57+ width: optionToggleContent.width
58+ height: optionToggle.itemHeight
59+ onClicked: {
60+ if (expanded) {
61+ selectedIndex = index;
62+ }
63+ expanded = !expanded
64+ }
65+
66+ ListItem.ThinDivider {
67+ visible: expanded
68+ }
69+
70+ Label {
71+ id: delegateLabel
72+ anchors {
73+ left: parent.left
74+ leftMargin: units.gu(1)
75+ right: parent.right
76+ rightMargin: units.gu(1)
77+ verticalCenter: parent.verticalCenter
78+ }
79+
80+ width: parent.width
81+ text: expanded ? modelData : optionToggle.model[selectedIndex]
82+ color: theme.palette.normal.backgroundSecondaryText
83+ font.weight: Font.Light
84+ maximumLineCount: 1
85+ elide: Text.ElideRight
86+ }
87+
88+ Icon {
89+ anchors {
90+ right: parent.right
91+ rightMargin: units.gu(1)
92+ verticalCenter: parent.verticalCenter
93+ }
94+
95+ visible: index == 0
96+ name: optionToggle.height === optionToggle.itemHeight ? "down" : "up"
97+ width: units.gu(2)
98+ height: width
99+ }
100+
101+ Image {
102+ id: checkIcon
103+ anchors {
104+ right: parent.right
105+ rightMargin: units.gu(1)
106+ verticalCenter: parent.verticalCenter
107+ }
108+ visible: expanded && index == optionToggle.selectedIndex && index != 0
109+ height: units.gu(1.5)
110+ fillMode: Image.PreserveAspectFit
111+ source: Qt.resolvedUrl("Pages/data/Tick@30.png")
112+ }
113+ }
114+ }
115+ sourceComponent: optionToggleEntry
116+ }
117+ }
118+ }
119+}