Fixed the app system buttons UI

This commit is contained in:
Eism 2021-12-14 18:30:14 +02:00
parent 31a9490780
commit 334f97c50d
5 changed files with 148 additions and 50 deletions

View file

@ -103,5 +103,6 @@
<file>qml/AppMenuBar.qml</file>
<file>qml/DevTools/MPE/ArticulationsProfileEditorView.qml</file>
<file>qml/Preferences/internal/MiscellaneousSection.qml</file>
<file>qml/platform/win/AppSystemButtons.qml</file>
</qresource>
</RCC>

View file

@ -0,0 +1,128 @@
import QtQuick 2.15
import MuseScore.Ui 1.0
import MuseScore.UiComponents 1.0
import "../../"
Row {
id: root
property bool windowIsMiximized: false
property NavigationPanel navigationPanel : NavigationPanel {
name: "AppControl"
accessible.name: qsTrc("appshell", "App control")
}
signal showWindowMinimizedRequested()
signal toggleWindowMaximizedRequested()
signal closeWindowRequested()
FlatButton {
id: minimizeButton
icon: IconCode.APP_MINIMIZE
transparent: true
drawFocusBorderInsideRect: true
navigation.name: "AppControl"
navigation.panel: root.navigationPanel
navigation.order: 1
accessible.name: qsTrc("appshell", "Minimize")
backgroundItem: ButtonBackground {
navCtrl: minimizeButton.navigation
mouseArea: minimizeButton.mouseArea
}
onClicked: {
root.showWindowMinimizedRequested()
}
}
FlatButton {
id: maximizeButton
icon: !root.windowIsMiximized ? IconCode.APP_MAXIMIZE : IconCode.APP_UNMAXIMIZE
transparent: true
drawFocusBorderInsideRect: true
navigation.name: "AppControl"
navigation.panel: root.navigationPanel
navigation.order: 2
accessible.name: !root.windowIsMiximized ? qsTrc("appshell", "Maximize") : qsTrc("appshell", "Unmaximize")
backgroundItem: ButtonBackground {
navCtrl: maximizeButton.navigation
mouseArea: maximizeButton.mouseArea
}
onClicked: {
root.toggleWindowMaximizedRequested()
}
}
FlatButton {
id: closeButton
icon: IconCode.APP_CLOSE
transparent: true
drawFocusBorderInsideRect: true
navigation.name: "AppControl"
navigation.panel: root.navigationPanel
navigation.order: 3
accessible.name: qsTrc("appshell", "Quit")
backgroundItem: ButtonBackground {
navCtrl: closeButton.navigation
mouseArea: closeButton.mouseArea
}
onClicked: {
root.closeWindowRequested()
}
}
component ButtonBackground: Rectangle {
id: background
property var navCtrl: null
property var mouseArea: null
color: "transparent"
border.width: ui.theme.borderWidth
border.color: ui.theme.strokeColor
NavigationFocusBorder {
navigationCtrl: background.navCtrl
drawOutsideParent: false
}
states: [
State {
name: "PRESSED"
when: background.mouseArea.pressed
PropertyChanges {
target: background
color: ui.theme.buttonColor
opacity: 1
}
},
State {
name: "HOVERED"
when: background.mouseArea.containsMouse && !background.mouseArea.pressed
PropertyChanges {
target: background
color: ui.theme.buttonColor
opacity: 0.5
}
}
]
}
}

View file

@ -35,6 +35,8 @@ Rectangle {
property alias title: titleLabel.text
property rect titleMoveAreaRect: Qt.rect(titleMoveArea.x, titleMoveArea.y, titleMoveArea.width, titleMoveArea.height)
property alias windowIsMiximized: systemButtons.windowIsMiximized
signal showWindowMinimizedRequested()
signal toggleWindowMaximizedRequested()
signal closeWindowRequested()
@ -84,65 +86,25 @@ Rectangle {
textFormat: Text.RichText
}
Row {
AppSystemButtons {
id: systemButtons
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
NavigationPanel {
id: navAppControlPanel
name: "AppControl"
enabled: systemButtons.enabled && systemButtons.visible
section: navSec
order: 1
accessible.name: qsTrc("appshell", "App control")
navigationPanel.section: navSec
navigationPanel.order: 1
onShowWindowMinimizedRequested: {
root.showWindowMinimizedRequested()
}
FlatButton {
icon: IconCode.MINUS
transparent: true
drawFocusBorderInsideRect: true
navigation.name: "AppControl"
navigation.panel: navAppControlPanel
navigation.order: 1
accessible.name: qsTrc("appshell", "Minimize")
onClicked: {
root.showWindowMinimizedRequested()
}
onToggleWindowMaximizedRequested: {
root.toggleWindowMaximizedRequested()
}
FlatButton {
icon: IconCode.SPLIT_OUT_ARROWS
transparent: true
drawFocusBorderInsideRect: true
navigation.name: "AppControl"
navigation.panel: navAppControlPanel
navigation.order: 2
accessible.name: qsTrc("appshell", "Maximize") // todo
onClicked: {
root.toggleWindowMaximizedRequested()
}
}
FlatButton {
icon: IconCode.CLOSE_X_ROUNDED
transparent: true
hoverHitColor: "red"
drawFocusBorderInsideRect: true
navigation.name: "AppControl"
navigation.panel: navAppControlPanel
navigation.order: 3
accessible.name: qsTrc("appshell", "Quit")
onClicked: {
root.closeWindowRequested()
}
onCloseWindowRequested: {
root.closeWindowRequested()
}
}
}

View file

@ -58,6 +58,8 @@ AppWindow {
height: 32
title: root.title
windowIsMiximized: root.visibility === Window.Maximized
onShowWindowMinimizedRequested: {
root.showMinimized()
}

View file

@ -333,6 +333,11 @@ public:
DIMINUENDO = 0xF414,
CRESCENDO = 0xF415,
APP_MINIMIZE = 0xF41C,
APP_MAXIMIZE = 0xF41D,
APP_UNMAXIMIZE = 0xF41E,
APP_CLOSE = 0xF41F,
NOTEFLAGS_TRADITIONAL = 0xF420,
NOTEFLAGS_STRAIGHT = 0xF421,