1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
|
// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
import QtQuick
import QtQuick.Layouts
import QtQuick.Controls.Basic
import FileSystemModule
// The MenuBar also serves as a controller for our window as we don't use any decorations.
MenuBar {
id: root
required property ApplicationWindow dragWindow
property alias infoText: windowInfo.text
// Customization of the top level menus inside the MenuBar
delegate: MenuBarItem {
id: menuBarItem
contentItem: Text {
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
text: menuBarItem.text
font: menuBarItem.font
elide: Text.ElideRight
color: menuBarItem.highlighted ? Colors.textFile : Colors.text
opacity: enabled ? 1.0 : 0.3
}
background: Rectangle {
id: background
color: menuBarItem.highlighted ? Colors.selection : "transparent"
Rectangle {
id: indicator
width: 0; height: 3
anchors.horizontalCenter: parent.horizontalCenter
anchors.bottom: parent.bottom
color: Colors.color1
states: State {
name: "active"
when: menuBarItem.highlighted
PropertyChanges {
indicator.width: background.width - 2
}
}
transitions: Transition {
NumberAnimation {
properties: "width"
duration: 175
}
}
}
}
}
// We use the contentItem property as a place to attach our window decorations. Beneath
// the usual menu entries within a MenuBar, it includes a centered information text, along
// with the minimize, maximize, and close buttons.
contentItem: RowLayout {
id: windowBar
Layout.fillWidth: true
Layout.fillHeight: true
spacing: root.spacing
Repeater {
id: menuBarItems
Layout.alignment: Qt.AlignLeft
model: root.contentModel
}
Item {
Layout.fillWidth: true
Layout.fillHeight: true
Text {
id: windowInfo
width: parent.width; height: parent.height
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
leftPadding: windowActions.width
color: Colors.text
clip: true
}
}
RowLayout {
id: windowActions
Layout.alignment: Qt.AlignRight
Layout.fillHeight: true
spacing: 0
component InteractionButton: Rectangle {
id: interactionButton
signal action()
property alias hovered: hoverHandler.hovered
Layout.fillHeight: true
Layout.preferredWidth: height
color: hovered ? Colors.background : "transparent"
HoverHandler {
id: hoverHandler
}
TapHandler {
id: tapHandler
onTapped: interactionButton.action()
}
}
InteractionButton {
id: minimize
onAction: root.dragWindow.showMinimized()
Rectangle {
anchors.centerIn: parent
color: parent.hovered ? Colors.iconIndicator : Colors.icon
height: 2
width: parent.height - 14
}
}
InteractionButton {
id: maximize
onAction: root.dragWindow.showMaximized()
Rectangle {
anchors.fill: parent
anchors.margins: 7
border.color: parent.hovered ? Colors.iconIndicator : Colors.icon
border.width: 2
color: "transparent"
}
}
InteractionButton {
id: close
color: hovered ? "#ec4143" : "transparent"
onAction: root.dragWindow.close()
Rectangle {
anchors.centerIn: parent
width: parent.height - 8; height: 2
rotation: 45
antialiasing: true
transformOrigin: Item.Center
color: parent.hovered ? Colors.iconIndicator : Colors.icon
Rectangle {
anchors.centerIn: parent
width: parent.height
height: parent.width
antialiasing: true
color: parent.color
}
}
}
}
}
background: Rectangle {
color: Colors.surface2
// Make the empty space drag the specified root window.
WindowDragHandler {
dragWindow: root.dragWindow
}
}
}
|
