on xenial help sign in
Make sure overflow indicators are hidden and not the search label.
df67261Nick Dedekind
Panel/IndicatorRow.qml+51−12
@@ -27,6 +27,8 @@ Item {
27 property alias row: row
27 property alias row: row
28 property QtObject indicatorsModel: null
28 property QtObject indicatorsModel: null
29 property var visibleIndicators: defined
29 property var visibleIndicators: defined
30+ property int overFlowWidth: width
31+ property bool showAll: false
30
32
31 width: units.gu(40)
33 width: units.gu(40)
32 height: units.gu(3)
34 height: units.gu(3)
@@ -42,6 +44,15 @@ Item {
42 }
44 }
43 }
45 }
44
46
47+ Timer {
48+ id: allVisible
49+ interval: 1000
50+
51+ onTriggered: {
52+ showAll = false;
53+ }
54+ }
55+
45 Row {
56 Row {
46 id: row
57 id: row
47
58
@@ -54,16 +65,31 @@ Item {
54 objectName: "rowRepeater"
65 objectName: "rowRepeater"
55 model: indicatorsModel ? indicatorsModel : undefined
66 model: indicatorsModel ? indicatorsModel : undefined
56
67
68+ property int lastCount: 0
69+ onCountChanged: {
70+ if (lastCount < count) {
71+ showAll = true;
72+ allVisible.start();
73+ }
74+ lastCount = count;
75+ }
76+
57 Item {
77 Item {
58 id: itemWrapper
78 id: itemWrapper
59 height: indicatorRow.height
79 height: indicatorRow.height
60 width: indicatorItem.width
80 width: indicatorItem.width
61 visible: indicatorItem.indicatorVisible
81 visible: indicatorItem.indicatorVisible
82+ opacity: 1.0
83+ y: 0
84+ state: "standard"
62
85
63 property int ownIndex: index
86 property int ownIndex: index
64 property alias highlighted: indicatorItem.highlighted
87 property alias highlighted: indicatorItem.highlighted
65 property alias dimmed: indicatorItem.dimmed
88 property alias dimmed: indicatorItem.dimmed
66
89
90+ property bool hidden: !showAll && !indicatorItem.highlighted && (indicatorRow.state == "locked" || indicatorRow.state == "commit")
91+ property bool overflow: row.width - itemWrapper.x > overFlowWidth
92+
67 IndicatorItem {
93 IndicatorItem {
68 id: indicatorItem
94 id: indicatorItem
69 height: parent.height
95 height: parent.height
@@ -87,22 +113,35 @@ Item {
87 }
113 }
88 indicatorRow.visibleIndicators[model.identifier] = indicatorVisible;
114 indicatorRow.visibleIndicators[model.identifier] = indicatorVisible;
89 indicatorRow.visibleIndicatorsChanged();
115 indicatorRow.visibleIndicatorsChanged();
116+
117+ if (indicatorVisible) {
118+ showAll = true;
119+ allVisible.start();
120+ }
90 }
121 }
91 }
122 }
92
123
93− opacity: {
124+ states: [
94− if (!indicatorItem.highlighted && (indicatorRow.state == "locked" || indicatorRow.state == "commit")) {
125+ State {
95− return 0.0;
126+ name: "standard"
96− } else {
127+ when: !hidden && !overflow
97− return 1.0;
128+ },
129+ State {
130+ name: "overflow"
131+ when: hidden || overflow
132+ PropertyChanges { target: itemWrapper; opacity: 0.0 }
98 }
133 }
99− }
134+ ]
100− Behavior on opacity {
135+
136+ transitions: [
137+ Transition {
101− StandardAnimation {
138+ StandardAnimation {
102− // flow away from current index
139+ target: itemWrapper
103− duration: (rowRepeater.count - Math.abs(indicatorRow.currentItemIndex - index)) * (500/rowRepeater.count)
140+ property: "opacity"
141+ duration: 300
104− }
142+ }
105− }
143+ }
144+ ]
106 }
145 }
107 }
146 }
108 }
147 }
Panel/Indicators.qml+2
@@ -29,6 +29,8 @@ Showable {
29 property real openedHeight: units.gu(71)
29 property real openedHeight: units.gu(71)
30 property int panelHeight: units.gu(3)
30 property int panelHeight: units.gu(3)
31 property bool pinnedMode: true //should be set true if indicators menu can cover whole screen
31 property bool pinnedMode: true //should be set true if indicators menu can cover whole screen
32+ property alias overFlowWidth: indicatorRow.overFlowWidth
33+ property alias showAll: indicatorRow.showAll
32
34
33 property int hintValue
35 property int hintValue
34 readonly property int lockThreshold: openedHeight / 2
36 readonly property int lockThreshold: openedHeight / 2
Panel/Panel.qml+2−2
@@ -83,6 +83,7 @@ Item {
83 panelHeight: __panelMinusSeparatorLineHeight
83 panelHeight: __panelMinusSeparatorLineHeight
84 openedHeight: parent.height + (pinnedMode ? 0 : root.panelHeight)
84 openedHeight: parent.height + (pinnedMode ? 0 : root.panelHeight)
85 pinnedMode: !fullscreenMode
85 pinnedMode: !fullscreenMode
86+ overFlowWidth: search.state=="hidden" ? parent.width : parent.width - search.width
86
87
87 property real unitProgress: (height - panelHeight) / (openedHeight - panelHeight)
88 property real unitProgress: (height - panelHeight) / (openedHeight - panelHeight)
88 }
89 }
@@ -121,14 +122,13 @@ Item {
121 return "hidden";
122 return "hidden";
122 }
123 }
123 }
124 }
124− if (root.searchVisible) {
125+ if (root.searchVisible && !indicatorsMenu.showAll) {
125 return "visible";
126 return "visible";
126 }
127 }
127
128
128 return "hidden";
129 return "hidden";
129 }
130 }
130
131
131− width: units.gu(13)
132 height: __panelMinusSeparatorLineHeight
132 height: __panelMinusSeparatorLineHeight
133 anchors {
133 anchors {
134 top: panelBackground.top
134 top: panelBackground.top
Panel/SearchIndicator.qml+9−8
@@ -21,7 +21,7 @@ import "../Components"
21Item {
21Item {
22 id: search
22 id: search
23
23
24− width: units.gu(9)
24+ width: container.width + units.gu(2)
25 height: units.gu(3)
25 height: units.gu(3)
26
26
27 property string headerText: i18n.tr("Search")
27 property string headerText: i18n.tr("Search")
@@ -34,21 +34,24 @@ Item {
34 onClicked: search.clicked()
34 onClicked: search.clicked()
35 }
35 }
36
36
37− Item {
37+ Row {
38 id: container
38 id: container
39 objectName: "container"
39 objectName: "container"
40
40
41− width: parent.width
42 height: parent.height
41 height: parent.height
42+ width: childrenRect.width
43+ anchors {
44+ left: parent.left
45+ leftMargin: units.gu(1)
46+ }
47+ spacing: units.gu(1)
43
48
44− Behavior on opacity { StandardAnimation {} }
49+ Behavior on opacity { StandardAnimation { duration: 300 } }
45
50
46 Image {
51 Image {
47 id: icon
52 id: icon
48 source: "graphics/search.png"
53 source: "graphics/search.png"
49 anchors.verticalCenter: parent.verticalCenter
54 anchors.verticalCenter: parent.verticalCenter
50− anchors.left: parent.left
51− anchors.leftMargin: units.gu(1)
52 }
55 }
53
56
54 Label {
57 Label {
@@ -56,8 +59,6 @@ Item {
56 color: Qt.rgba(0.8, 0.8, 0.8, 1.0)
59 color: Qt.rgba(0.8, 0.8, 0.8, 1.0)
57 fontSize: "small"
60 fontSize: "small"
58 font.capitalization: Font.AllUppercase
61 font.capitalization: Font.AllUppercase
59− anchors.left: icon.right
60− anchors.leftMargin: units.gu(1)
61 anchors.verticalCenter: parent.verticalCenter
62 anchors.verticalCenter: parent.verticalCenter
62 }
63 }
63 }
64 }