diff --git a/src/controls/ToolBarApplicationHeader.qml b/src/controls/ToolBarApplicationHeader.qml --- a/src/controls/ToolBarApplicationHeader.qml +++ b/src/controls/ToolBarApplicationHeader.qml @@ -43,19 +43,19 @@ id: delegateItem readonly property bool current: __appWindow.pageStack.currentIndex == index - Row { - id: layout - anchors.verticalCenter: parent.verticalCenter - spacing: 2 - + RowLayout { + anchors { + right: heading.left + left: parent.left + verticalCenter: parent.verticalCenter + } Separator { anchors.verticalCenter: parent.verticalCenter - height: parent.height * 0.6 + Layout.preferredHeight: parent.height * 0.6 visible: index > 0 } PrivateActionToolButton { anchors.verticalCenter: parent.verticalCenter - anchors.leftMargin: 4 kirigamiAction: page && page.actions ? page.actions.left : null } PrivateActionToolButton { @@ -66,101 +66,105 @@ anchors.verticalCenter: parent.verticalCenter kirigamiAction: page && page.actions ? page.actions.right : null } - Separator { - anchors.verticalCenter: parent.verticalCenter - height: parent.height * 0.6 - visible: page && page.actions && (page.actions.left || page.actions.main || page.actions.right) - } - - Row { - id: contextActionsContainer - property var overflowSet: [] - - Repeater { - id: repeater - model: page && page.actions.contextualActions ? page.actions.contextualActions : null - delegate: PrivateActionToolButton { - id: actionDelegate - anchors.verticalCenter: parent.verticalCenter - kirigamiAction: modelData - property bool fits: x+contextActionsContainer.x+layout.x+width < delegateItem.width - moreButton.width - onFitsChanged: updateOverflowSet() - function updateOverflowSet() { - var index = contextActionsContainer.overflowSet.findIndex(function(act){ - return act == modelData}); - - if ((fits || !modelData.visible) && index > -1) { - contextActionsContainer.overflowSet.splice(index, 1); - } else if (!fits && modelData.visible && index == -1) { - contextActionsContainer.overflowSet.push(modelData); - } - contextActionsContainer.overflowSetChanged(); - } - visible: modelData.visible && fits - - Connections { - target: modelData - onVisibleChanged: actionDelegate.updateOverflowSet(); - } - Component.onCompleted: { - actionDelegate.updateOverflowSet(); - } - } - } + Item { + Layout.fillWidth: true + Layout.fillHeight: true } } Heading { id: heading - anchors.verticalCenter: parent.verticalCenter + anchors.centerIn: parent leftPadding: units.gridUnit - visible: layout.width <= 0 opacity: delegateItem.current ? 1 : 0.4 maximumLineCount: 1 - width: parent.width color: Theme.textColor elide: Text.ElideRight text: page ? page.title : "" font.pointSize: Math.max(1, (parent.height / 1.6) / Units.devicePixelRatio) } - Controls.ToolButton { - id: moreButton + + RowLayout { + id: contextActionsContainer anchors { right: parent.right + left: heading.right verticalCenter: parent.verticalCenter } + property var overflowSet: [] + + Item { + Layout.fillWidth: true + Layout.fillHeight: true + } - Icon { - anchors.fill: parent - source: "overflow-menu" - anchors.margins: 4 + Repeater { + model: page && page.actions.contextualActions ? page.actions.contextualActions : null + delegate: PrivateActionToolButton { + id: actionDelegate + anchors.verticalCenter: parent.verticalCenter + kirigamiAction: modelData + readonly property bool fits: x < contextActionsContainer.x + onFitsChanged: updateOverflowSet() + function updateOverflowSet() { + var index = contextActionsContainer.overflowSet.findIndex(function(act){ + return act == modelData}); + + if ((fits || !modelData.visible) && index > -1) { + contextActionsContainer.overflowSet.splice(index, 1); + } else if (!fits && modelData.visible && index == -1) { + contextActionsContainer.overflowSet.push(modelData); + } + contextActionsContainer.overflowSetChanged(); + } + visible: modelData.visible && fits + + Connections { + target: modelData + onVisibleChanged: actionDelegate.updateOverflowSet(); + } + Component.onCompleted: { + actionDelegate.updateOverflowSet(); + } + } } - checkable: true - checked: menu.visible - visible: contextActionsContainer.overflowSet.length > 0; - onClicked: menu.open() - - Controls.Menu { - id: menu - y: moreButton.height - x: -width + moreButton.width - - Repeater { - model: page && page.actions.contextualActions ? page.actions.contextualActions : null - delegate: BasicListItem { - text: modelData ? modelData.text : "" - icon: modelData.icon - checkable: modelData.checkable - checked: modelData.checked - onClicked: { - modelData.trigger(); - menu.visible = false; + + Controls.ToolButton { + id: moreButton + anchors.verticalCenter: parent.verticalCenter + + Icon { + anchors.fill: parent + source: "overflow-menu" + anchors.margins: 4 + } + checkable: true + checked: menu.visible + visible: contextActionsContainer.overflowSet.length > 0; + onClicked: menu.open() + + Controls.Menu { + id: menu + y: moreButton.height + x: -width + moreButton.width + + Repeater { + model: contextActionsContainer.overflowSet ? contextActionsContainer.overflowSet : null + delegate: BasicListItem { + text: modelData ? modelData.text : "" + icon: modelData.icon + checkable: modelData.checkable + checked: modelData.checked + onClicked: { + modelData.trigger(); + menu.visible = false; + } + separatorVisible: false + backgroundColor: "transparent" + visible: contextActionsContainer.overflowSet.findIndex(function(act) { + return act == modelData}) > -1 && modelData.visible + enabled: modelData.enabled } - separatorVisible: false - backgroundColor: "transparent" - visible: contextActionsContainer.overflowSet.findIndex(function(act) { - return act == modelData}) > -1 && modelData.visible - enabled: modelData.enabled } } }