2 * Copyright 2013-2016 Canonical Ltd.
4 * This program is free software; you can redistribute it and/or modify
5 * it under the terms of the GNU Lesser General Public License as published by
6 * the Free Software Foundation; version 3.
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 Lesser General Public License for more details.
13 * You should have received a copy of the GNU Lesser General Public License
14 * along with this program. If not, see <http://www.gnu.org/licenses/>.
18import Lomiri.Components 1.3
19import Lomiri.Settings.Components 0.1
25 property string identifier
26 property alias title: indicatorName.text
27 property alias leftLabel: leftLabelItem.text
28 property alias rightLabel: rightLabelItem.text
29 property var icons: undefined
30 property bool expanded: false
31 property bool selected: false
32 property real iconHeight: units.gu(2)
33 readonly property color color: {
34 if (!expanded) return theme.palette.normal.backgroundText;
35 if (!selected) return theme.palette.disabled.backgroundText;
36 return theme.palette.normal.backgroundText;
39 implicitWidth: mainItems.width
41 // Prevent ListView from removing us from the view while expanding.
42 // If we're the PanelBar's initial item, our removal will make it lose
43 // track of us and cause its positioning to go wrong.
44 ListView.delayRemove: stateTransition.running
47 readonly property int stepUp: 1
48 readonly property int stepDown: -1
51 acceptedButtons: Qt.MiddleButton
53 if ((!expanded || selected) && secondaryAction.valid) {
54 secondaryAction.activate();
58 if ((!expanded || selected) && scrollAction.valid) {
59 scrollAction.activate(wheel.angleDelta.y > 0 ? stepUp : stepDown);
66 anchors.centerIn: parent
68 width: leftLabelItem.width + iconsItem.width + rightLabelItem.width
69 implicitHeight: units.gu(2)
73 objectName: "leftLabel"
77 verticalCenter: parent.verticalCenter
79 width: contentWidth > 0 ? contentWidth + units.gu(1) : 0
80 horizontalAlignment: Text.AlignHCenter
85 font.weight: Font.Light
87 Behavior on color { ColorAnimation { duration: LomiriAnimation.FastDuration; easing: LomiriAnimation.StandardEasing } }
94 width: iconRow.width > 0 ? iconRow.width + units.gu(1) : 0
96 left: leftLabelItem.right
97 verticalCenter: parent.verticalCenter
102 anchors.centerIn: iconsItem
107 objectName: "iconRepeater"
109 model: d.useFallbackIcon ? [ "image://theme/settings" ] : root.icons
113 objectName: "icon"+index
115 // FIXME Workaround for bug https://bugs.launchpad.net/lomiri/+source/lomiri-ui-toolkit/+bug/1421293
116 width: implicitWidth > 0 && implicitHeight > 0 ? (implicitWidth / implicitHeight * height) : implicitWidth;
119 Behavior on color { ColorAnimation { duration: LomiriAnimation.FastDuration; easing: LomiriAnimation.StandardEasing } }
121 // Workaround indicators getting stretched/squished when (un)plugging external/virtual monitor
133 objectName: "rightLabel"
136 left: iconsItem.right
137 verticalCenter: parent.verticalCenter
139 width: contentWidth > 0 ? contentWidth + units.gu(1) : 0
140 horizontalAlignment: Text.AlignHCenter
143 font.family: "Ubuntu"
145 font.weight: Font.Light
147 Behavior on color { ColorAnimation { duration: LomiriAnimation.FastDuration; easing: LomiriAnimation.StandardEasing } }
153 objectName: "indicatorName"
155 anchors.top: mainItems.bottom
156 anchors.topMargin: units.gu(0.5)
157 anchors.horizontalCenter: parent.horizontalCenter
158 width: contentWidth > 0 ? contentWidth + units.gu(1) : 0
162 font.weight: Font.Light
163 horizontalAlignment: Text.AlignHCenter
166 Behavior on color { ColorAnimation { duration: LomiriAnimation.FastDuration; easing: LomiriAnimation.StandardEasing } }
170 objectName: "indicatorItemState"
175 when: !expanded && ((icons && icons.length > 0) || leftLabel !== "" || rightLabel !== "")
176 PropertyChanges { target: indicatorName; opacity: 0}
180 name: "minimised_fallback"
181 when: !expanded && (!icons || icons.length === 0) && leftLabel == "" && rightLabel == ""
182 PropertyChanges { target: indicatorName; opacity: 0}
183 PropertyChanges { target: d; useFallbackIcon: true }
188 PropertyChanges { target: indicatorName; visible: true; opacity: 1}
189 PropertyChanges { target: mainItems; anchors.verticalCenterOffset: -units.gu(1) }
193 name: "expanded_icon"
195 when: expanded && (icons && icons.length > 0)
196 AnchorChanges { target: iconsItem; anchors.left: undefined; anchors.horizontalCenter: parent.horizontalCenter }
197 AnchorChanges { target: leftLabelItem; anchors.left: undefined; anchors.right: iconsItem.left }
198 PropertyChanges { target: leftLabelItem; opacity: 0 }
199 PropertyChanges { target: leftLabelItem; opacity: 0 }
200 PropertyChanges { target: rightLabelItem; opacity: 0 }
201 PropertyChanges { target: root; width: Math.max(units.gu(10), Math.max(iconsItem.width, indicatorName.width)) }
205 name: "expanded_fallback"
207 when: expanded && (!icons || icons.length === 0) && leftLabel == "" && rightLabel == ""
208 PropertyChanges { target: d; useFallbackIcon: true }
209 AnchorChanges { target: iconsItem; anchors.left: undefined; anchors.horizontalCenter: parent.horizontalCenter }
210 AnchorChanges { target: leftLabelItem; anchors.left: undefined; anchors.right: iconsItem.left }
211 PropertyChanges { target: leftLabelItem; opacity: 0 }
212 PropertyChanges { target: leftLabelItem; opacity: 0 }
213 PropertyChanges { target: rightLabelItem; opacity: 0 }
214 PropertyChanges { target: root; width: Math.max(units.gu(10), Math.max(iconsItem.width, indicatorName.width)) }
218 name: "expanded_rightLabel"
220 when: expanded && (!icons || icons.length === 0) && rightLabel !== ""
221 AnchorChanges { target: rightLabelItem; anchors.left: undefined; anchors.horizontalCenter: parent.horizontalCenter }
222 PropertyChanges { target: iconsItem; opacity: 0 }
223 PropertyChanges { target: leftLabelItem; opacity: 0 }
224 PropertyChanges { target: root; width: Math.max(units.gu(10), Math.max(rightLabelItem.width, indicatorName.width)) }
228 name: "expanded_leftLabel"
230 when: expanded && (!icons || icons.length === 0) && leftLabel !== ""
231 AnchorChanges { target: leftLabelItem; anchors.left: undefined; anchors.horizontalCenter: parent.horizontalCenter }
232 PropertyChanges { target: iconsItem; opacity: 0 }
233 PropertyChanges { target: rightLabelItem; opacity: 0 }
234 PropertyChanges { target: root; width: Math.max(units.gu(10), Math.max(leftLabelItem.width, indicatorName.width)) }
241 PropertyAction { target: d; property: "useFallbackIcon" }
243 targets: [ mainItems, iconsItem, leftLabelItem, rightLabelItem ]
244 duration: LomiriAnimation.SnapDuration; easing: LomiriAnimation.StandardEasing
247 targets: [ root, mainItems, iconsItem, leftLabelItem, rightLabelItem, indicatorName ]
248 properties: "width, opacity, anchors.verticalCenterOffset";
249 duration: LomiriAnimation.SnapDuration; easing: LomiriAnimation.StandardEasing
255 rootActionState.onUpdated: {
256 if (rootActionState == undefined) {
264 title = rootActionState.title ? rootActionState.title : rootActionState.accessibleName;
265 leftLabel = rootActionState.leftLabel ? rootActionState.leftLabel : "";
266 rightLabel = rootActionState.rightLabel ? rootActionState.rightLabel : "";
267 icons = rootActionState.icons;
273 property bool useFallbackIcon: false
274 property var shouldIndicatorBeShown: undefined
276 onShouldIndicatorBeShownChanged: {
277 if (shouldIndicatorBeShown !== undefined) {
278 submenuAction.changeState(shouldIndicatorBeShown);
287 name: rootActionState.secondaryAction
294 name: rootActionState.scrollAction
301 name: rootActionState.submenuAction
306 property: "shouldIndicatorBeShown"
307 when: submenuAction.valid
308 value: root.selected && root.expanded