on xenial help sign in
Added overflow button
643142fNick Dedekind
qml/ApplicationMenus/MenuBar.qml+148−130
@@ -25,12 +25,13 @@ Item {
25 id: root
25 id: root
26 objectName: "menuBar"
26 objectName: "menuBar"
27
27
28+ // set from outside
28 property alias unityMenuModel: rowRepeater.model
29 property alias unityMenuModel: rowRepeater.model
29−
30− readonly property bool valid: rowRepeater.count > 0
31−
32 property bool enableKeyFilter: false
30 property bool enableKeyFilter: false
31+ property real overflowWidth: width
33
32
33+ // read from outside
34+ readonly property bool valid: rowRepeater.count > 0
34 readonly property bool showRequested: d.longAltPressed || d.currentItem != null
35 readonly property bool showRequested: d.longAltPressed || d.currentItem != null
35
36
36 implicitWidth: row.width
37 implicitWidth: row.width
@@ -65,168 +66,185 @@ Item {
65 onPressed: d.dismissAll()
66 onPressed: d.dismissAll()
66 }
67 }
67
68
68− Item {
69+ Rectangle {
69− id: clippingItem
70+ anchors.fill: row
70−
71+ color: Qt.rgba(1,0,0,0.4)
71− height: root.height
72− width: root.width
73− clip: true
74−
75− Row {
76− id: row
77− spacing: units.gu(2)
78− height: parent.height
79−
80− ActionContext {
81− id: menuBarContext
82− objectName: "barContext"
83− active: !d.currentItem && enableKeyFilter
84− }
72+ }
85−
86− Repeater {
87− id: rowRepeater
88−
89− Item {
90− id: visualItem
91− objectName: root.objectName + "-item" + __ownIndex
92
73
93− readonly property int __ownIndex: index
74+ Row {
94− property Item __popup: null;
75+ id: row
95− property bool popupVisible: __popup && __popup.visible
76+ spacing: units.gu(2)
77+ height: parent.height
96
78
97− implicitWidth: column.implicitWidth
79+ ActionContext {
98− implicitHeight: row.height
80+ id: menuBarContext
99− enabled: model.sensitive
81+ objectName: "barContext"
82+ active: !d.currentItem && enableKeyFilter
83+ }
100
84
85+ Repeater {
86+ id: rowRepeater
87+
88+ Item {
89+ id: visualItem
90+ objectName: root.objectName + "-item" + __ownIndex
91+
92+ readonly property int __ownIndex: index
93+ property Item __popup: null;
94+ property bool popupVisible: __popup && __popup.visible
95+ property bool shouldDisplay: x + width + ((index < rowRepeater.count-1) ? units.gu(1) : 0) <
96+ (root.overflowWidth - (overflowButton.visible ? overflowButton.width : 0))
97+
98+ implicitWidth: column.implicitWidth
99+ implicitHeight: row.height
100+ enabled: model.sensitive && shouldDisplay
101+ opacity: shouldDisplay ? 1 : 0
102+
101− function show() {
103+ function show() {
102− if (!__popup) {
104+ if (!__popup) {
103− __popup = menuComponent.createObject(root, { objectName: visualItem.objectName + "-menu" });
105+ __popup = menuComponent.createObject(root, { objectName: visualItem.objectName + "-menu" });
104− // force the current item to be the newly popped up menu
106+ // force the current item to be the newly popped up menu
105− } else {
107+ } else {
106− __popup.show();
108+ __popup.show();
107− }
108− d.currentItem = visualItem;
109 }
109 }
110+ d.currentItem = visualItem;
111+ }
110− function hide() {
112+ function hide() {
111− if (__popup) {
113+ if (__popup) {
112− __popup.hide();
114+ __popup.hide();
113
115
114− if (d.currentItem === visualItem) {
116+ if (d.currentItem === visualItem) {
115− d.currentItem = null;
117+ d.currentItem = null;
116− }
117 }
118 }
118 }
119 }
120+ }
119− function dismiss() {
121+ function dismiss() {
120− if (__popup) {
122+ if (__popup) {
121− __popup.destroy();
123+ __popup.destroy();
122− __popup = null;
124+ __popup = null;
123
125
124− if (d.currentItem === visualItem) {
126+ if (d.currentItem === visualItem) {
125− d.currentItem = null;
127+ d.currentItem = null;
126− }
127 }
128 }
128 }
129 }
130+ }
129
131
130− Connections {
132+ Connections {
131− target: d
133+ target: d
132− onDismissAll: visualItem.dismiss()
134+ onDismissAll: visualItem.dismiss()
133− }
135+ }
134
136
135− Component {
137+ Component {
136− id: menuComponent
138+ id: menuComponent
137− MenuPopup {
139+ MenuPopup {
138− x: visualItem.x - units.gu(1)
140+ x: visualItem.x - units.gu(1)
139− anchors.top: parent.bottom
141+ anchors.top: parent.bottom
140− unityMenuModel: root.unityMenuModel.submenu(visualItem.__ownIndex)
142+ unityMenuModel: root.unityMenuModel.submenu(visualItem.__ownIndex)
141
143
142− Component.onCompleted: reset();
144+ Component.onCompleted: reset();
143− }
144 }
145 }
146+ }
145
147
146− RowLayout {
148+ RowLayout {
147− id: column
149+ id: column
148− spacing: units.gu(1)
150+ spacing: units.gu(1)
149− anchors {
151+ anchors {
150− centerIn: parent
152+ centerIn: parent
151− }
153+ }
152
154
153− Icon {
155+ Icon {
154− Layout.preferredWidth: units.gu(2)
156+ Layout.preferredWidth: units.gu(2)
155− Layout.preferredHeight: units.gu(2)
157+ Layout.preferredHeight: units.gu(2)
156− Layout.alignment: Qt.AlignVCenter
158+ Layout.alignment: Qt.AlignVCenter
157
159
158− visible: model.icon || false
160+ visible: model.icon || false
159− source: model.icon || ""
161+ source: model.icon || ""
160− }
162+ }
161
163
162− ActionItem {
164+ ActionItem {
163− id: actionItem
165+ id: actionItem
164− width: _title.width
166+ width: _title.width
165− height: _title.height
167+ height: _title.height
166
168
167− action: Action {
169+ action: Action {
168− // FIXME - SDK Action:text modifies menu text with html underline for mnemonic
170+ // FIXME - SDK Action:text modifies menu text with html underline for mnemonic
169− text: model.label.replace("_", "&").replace("<u>", "&").replace("</u>", "")
171+ text: model.label.replace("_", "&").replace("<u>", "&").replace("</u>", "")
170
172
171− onTriggered: {
173+ onTriggered: {
172− visualItem.show();
174+ visualItem.show();
173− }
174 }
175 }
176+ }
175
177
176− Label {
178+ Label {
177− id: _title
179+ id: _title
178− text: actionItem.text
180+ text: actionItem.text
179− horizontalAlignment: Text.AlignLeft
181+ horizontalAlignment: Text.AlignLeft
180− color: enabled ? theme.palette.normal.overlayText : theme.palette.disabled.overlayText
182+ color: enabled ? theme.palette.normal.overlayText : theme.palette.disabled.overlayText
181− }
182 }
183 }
183 }
184 }
185+ }
184− } // Item ( delegate )
186+ } // Item ( delegate )
185− } // Repeater
187+ } // Repeater
186− } // Row
188+ } // Row
189+
190+ MouseArea {
191+ id: overflowButton
192+ visible: root.implicitWidth > root.width
193+ height: parent.height
194+ width: units.gu(4)
195+ anchors.right: parent.right
196+
197+ Icon {
198+ id: icon
199+ width: units.gu(2)
200+ height: units.gu(2)
201+ anchors.centerIn: parent
202+ color: theme.palette.normal.overlayText
203+ name: "toolkit_chevron-down_2gu"
204+ }
205+ }
187
206
188− MouseArea {
207+ MouseArea {
189− anchors.fill: parent
208+ anchors.fill: parent
190− hoverEnabled: d.currentItem
209+ hoverEnabled: d.currentItem
191
210
192− onEntered: {
211+ onEntered: {
193− if (d.currentItem) {
212+ if (d.currentItem) {
194− updateCurrentItemFromPosition(Qt.point(mouseX, mouseY))
213+ updateCurrentItemFromPosition(Qt.point(mouseX, mouseY))
195− }
196 }
214 }
215+ }
197− onPositionChanged: {
216+ onPositionChanged: {
198− if (d.currentItem) {
217+ if (d.currentItem) {
199− updateCurrentItemFromPosition(Qt.point(mouse.x, mouse.y))
218+ updateCurrentItemFromPosition(Qt.point(mouse.x, mouse.y))
200− }
201 }
219 }
220+ }
202− onClicked: updateCurrentItemFromPosition(Qt.point(mouse.x, mouse.y))
221+ onClicked: updateCurrentItemFromPosition(Qt.point(mouse.x, mouse.y))
203
222
204− function updateCurrentItemFromPosition(point) {
223+ function updateCurrentItemFromPosition(point) {
205− var pos = mapToItem(row, point.x, point.y);
224+ var pos = mapToItem(row, point.x, point.y);
206
225
207− if (!d.hoveredItem || !d.currentItem || !d.hoveredItem.contains(Qt.point(pos.x - d.currentItem.x, pos.y - d.currentItem.y))) {
226+ if (!d.hoveredItem || !d.currentItem || !d.hoveredItem.contains(Qt.point(pos.x - d.currentItem.x, pos.y - d.currentItem.y))) {
208− d.hoveredItem = row.childAt(pos.x, pos.y);
227+ d.hoveredItem = row.childAt(pos.x, pos.y);
209− if (!d.hoveredItem || !d.hoveredItem.enabled)
228+ if (!d.hoveredItem || !d.hoveredItem.enabled)
210− return false;
229+ return false;
211− if (d.currentItem != d.hoveredItem) {
230+ if (d.currentItem != d.hoveredItem) {
212− d.currentItem = d.hoveredItem;
231+ d.currentItem = d.hoveredItem;
213− }
214 }
232 }
215− return true;
216 }
233 }
234+ return true;
217 }
235 }
236+ }
218
237
219− Rectangle {
238+ Rectangle {
220− id: underline
239+ id: underline
221− anchors {
240+ anchors {
222− bottom: row.bottom
241+ bottom: row.bottom
223− }
224− x: d.currentItem ? row.x + d.currentItem.x - units.gu(1) : 0
225− width: d.currentItem ? d.currentItem.width + units.gu(2) : 0
226− height: units.dp(4)
227− color: theme.palette.normal.activity
228− visible: d.currentItem
229 }
242 }
243+ x: d.currentItem ? row.x + d.currentItem.x - units.gu(1) : 0
244+ width: d.currentItem ? d.currentItem.width + units.gu(2) : 0
245+ height: units.dp(4)
246+ color: theme.palette.normal.activity
247+ visible: d.currentItem
230 }
248 }
231
249
232 MenuNavigator {
250 MenuNavigator {
qml/ApplicationMenus/MenuItem.qml+1−1
@@ -137,7 +137,7 @@ ActionItem {
137 theme.palette.disabled.backgroundSecondaryText
137 theme.palette.disabled.backgroundSecondaryText
138
138
139 visible: root.hasSubmenu
139 visible: root.hasSubmenu
140− name: "chevron"
140+ name: "toolkit_chevron-ltr_2gu"
141 }
141 }
142 }
142 }
143
143