Skip to content

Commit 31f81d6

Browse files
committed
feat: improve file actions window UI.
Signed-off-by: Camila Ayres <[email protected]>
1 parent ccd6b2b commit 31f81d6

File tree

1 file changed

+137
-109
lines changed

1 file changed

+137
-109
lines changed

src/gui/declarativeui/FileActionsWindow.qml

Lines changed: 137 additions & 109 deletions
Original file line numberDiff line numberDiff line change
@@ -7,16 +7,15 @@ import QtQuick
77
import QtQuick.Window
88
import QtQuick.Layouts
99
import QtQuick.Controls
10+
import Qt5Compat.GraphicalEffects
1011
import com.nextcloud.desktopclient
1112
import Style
1213

1314
ApplicationWindow {
1415
id: root
15-
width: 400
16-
height: 300
17-
minimumWidth: 300
18-
minimumHeight: 200
19-
flags: Qt.Dialog
16+
height: Style.trayWindowWidth
17+
width: Systray.useNormalWindow ? Style.trayWindowHeight : Style.trayWindowWidth
18+
flags: Systray.useNormalWindow ? Qt.Window : Qt.Dialog | Qt.FramelessWindowHint
2019
visible: true
2120

2221
property var accountState: ({})
@@ -32,120 +31,146 @@ ApplicationWindow {
3231
localPath: root.localPath
3332
}
3433

35-
Rectangle {
34+
background: Rectangle {
35+
//radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius
36+
border.width: Style.trayWindowBorderWidth
37+
border.color: palette.dark
38+
color: palette.window
39+
}
40+
41+
// TO FIX: OpacityMask {
42+
// anchors.fill: parent
43+
// anchors.margins: Style.trayWindowBorderWidth
44+
// source: ShaderEffectSource {
45+
// sourceItem: windowContent
46+
// hideSource: true
47+
// }
48+
// maskSource: Rectangle {
49+
// width: root.width
50+
// height: root.height
51+
// radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius
52+
// }
53+
// }
54+
55+
ColumnLayout {
56+
id: windowContent
3657
anchors.fill: parent
37-
color: Style.infoBoxBackgroundColor
38-
//radius: Style.trayWindowRadius
39-
border.color: Style.accentColor
58+
anchors.margins: Style.standardSpacing
4059

41-
ColumnLayout {
42-
anchors.fill: parent
43-
anchors.margins: Style.standardSpacing
60+
RowLayout {
61+
id: windowHeader
62+
Layout.fillWidth: true
4463
spacing: Style.standardSpacing
4564

46-
RowLayout {
47-
id: windowHeader
48-
Layout.fillWidth: true
49-
spacing: Style.standardSpacing
50-
51-
Image {
52-
source: "image://svgimage-custom-color/file-open.svg/" + palette.windowText
53-
width: Style.minimumActivityItemHeight
54-
height: Style.minimumActivityItemHeight
55-
}
56-
57-
ColumnLayout {
58-
Layout.fillWidth: true
59-
spacing: Style.extraSmallSpacing
60-
61-
Label {
62-
text: root.shortLocalPath
63-
font.bold: true
64-
font.pixelSize: Style.pixelSize
65-
color: Style.ncHeaderTextColor
66-
}
67-
}
65+
Image {
66+
source: "image://svgimage-custom-color/file-open.svg/" + palette.windowText
67+
width: Style.minimumActivityItemHeight
68+
height: Style.minimumActivityItemHeight
69+
Layout.alignment: Qt.AlignVCenter
70+
Layout.margins: Style.extraSmallSpacing
6871
}
6972

70-
Rectangle {
71-
id: lineTop
73+
Label {
74+
id: headerLocalPath
75+
text: root.shortLocalPath
76+
elide: Text.ElideRight
77+
font.bold: true
78+
font.pixelSize: Style.pixelSize
79+
color: palette.text
7280
Layout.fillWidth: true
73-
height: Style.extraExtraSmallSpacing
74-
color: Style.accentColor
81+
Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
7582
}
7683

77-
ListView {
78-
id: fileActionsView
79-
model: fileActionModel
80-
clip: true
81-
spacing: Style.trayHorizontalMargin
82-
Layout.fillWidth: true
83-
Layout.fillHeight: true
84-
delegate: fileActionsDelegate
84+
Button {
85+
id: closeButton
86+
flat: true
87+
padding: 0
88+
spacing: 0
89+
icon.source: "image://svgimage-custom-color/close.svg/" + palette.windowText
90+
icon.width: Style.extraSmallIconSize
91+
icon.height: Style.extraSmallIconSize
92+
Layout.alignment: Qt.AlignTop | Qt.AlignRight
93+
Layout.rightMargin: Style.extraSmallSpacing
94+
Layout.topMargin: Style.extraSmallSpacing
95+
onClicked: root.close()
96+
background: Rectangle {
97+
color: "transparent"
98+
radius: 0
99+
border.width: closeButton.hovered ? Style.trayWindowBorderWidth : 0
100+
border.color: palette.dark
101+
anchors.fill: parent
102+
Layout.margins: Style.extraSmallSpacing
103+
}
85104
}
105+
}
86106

87-
Rectangle {
88-
id: lineBottom
89-
Layout.fillWidth: true
90-
height: Style.extraExtraSmallSpacing
91-
color: Style.accentColor
92-
}
107+
Rectangle {
108+
id: lineTop
109+
Layout.fillWidth: true
110+
height: Style.extraExtraSmallSpacing
111+
color: palette.dark
112+
}
93113

94-
Button {
95-
id: responseButton
96-
visible: responseText.text !== ""
97-
flat: true
98-
Layout.fillWidth: true
99-
implicitHeight: Style.activityListButtonHeight
114+
ListView {
115+
id: fileActionsView
116+
model: fileActionModel
117+
clip: true
118+
spacing: Style.trayHorizontalMargin
119+
Layout.fillWidth: true
120+
Layout.fillHeight: true
121+
delegate: fileActionsDelegate
122+
}
100123

101-
padding: 0
102-
leftPadding: Style.standardSpacing
103-
rightPadding: Style.standardSpacing
104-
spacing: Style.standardSpacing
124+
Button {
125+
id: responseButton
126+
visible: responseText.text !== ""
127+
flat: true
128+
Layout.fillWidth: true
129+
implicitHeight: Style.activityListButtonHeight
105130

106-
contentItem: Row {
107-
id: responseContent
108-
anchors.fill: parent
109-
anchors.margins: Style.smallSpacing
110-
spacing: Style.standardSpacing
131+
padding: 0
132+
leftPadding: Style.smallSpacing
133+
rightPadding: Style.smallSpacing
134+
spacing: Style.standardSpacing
111135

112-
Image {
113-
source: "image://svgimage-custom-color/public.svg/" + palette.windowText
114-
width: Style.minimumActivityItemHeight
115-
height: Style.minimumActivityItemHeight
116-
fillMode: Image.PreserveAspectFit
117-
anchors.verticalCenter: parent.verticalCenter
118-
}
136+
background: Rectangle {
137+
//radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius
138+
border.width: Style.trayWindowBorderWidth
139+
border.color: palette.dark
140+
color: palette.window
141+
}
119142

120-
Text {
121-
id: responseText
122-
text: fileActionModel.responseLabel
123-
textFormat: Text.RichText
124-
color: Style.ncHeaderTextColor
125-
font.pointSize: Style.pixelSize
126-
font.underline: true
127-
anchors.verticalCenter: parent.verticalCenter
128-
MouseArea {
129-
id: responseArea
130-
anchors.fill: parent
131-
cursorShape: Qt.PointingHandCursor
132-
onClicked: Qt.openUrlExternally(fileActionModel.responseUrl)
133-
}
134-
}
143+
contentItem: Row {
144+
id: responseContent
145+
anchors.fill: parent
146+
anchors.margins: Style.smallSpacing
147+
spacing: Style.halfTrayWindowRadius
148+
Layout.fillWidth: true
149+
150+
Image {
151+
source: "image://svgimage-custom-color/backup.svg/" + palette.windowText
152+
width: Style.accountAvatarStateIndicatorSize
153+
height: Style.accountAvatarStateIndicatorSize
154+
fillMode: Image.PreserveAspectFit
155+
anchors.verticalCenter: parent.verticalCenter
135156
}
136157

137-
ToolTip {
138-
visible: responseButton.hovered
158+
Text {
159+
id: responseText
139160
text: fileActionModel.responseLabel
161+
textFormat: Text.RichText
162+
color: palette.text
163+
font.pointSize: Style.pixelSize
164+
font.underline: true
165+
anchors.verticalCenter: parent.verticalCenter
140166
}
141167
}
142168

143-
Rectangle {
144-
id: repsonseLineBottom
145-
visible: response.text != ""
146-
Layout.fillWidth: true
147-
height: Style.extraExtraSmallSpacing
148-
color: Style.accentColor
169+
MouseArea {
170+
id: responseArea
171+
anchors.fill: parent
172+
cursorShape: Qt.PointingHandCursor
173+
onClicked: Qt.openUrlExternally(fileActionModel.responseUrl)
149174
}
150175
}
151176
}
@@ -155,8 +180,10 @@ ApplicationWindow {
155180

156181
RowLayout {
157182
Layout.fillWidth: true
183+
Layout.margins: Style.extraSmallSpacing
158184
spacing: Style.standardSpacing
159185
height: implicitHeight
186+
width: implicitWidth
160187

161188
required property string name
162189
required property int index
@@ -169,39 +196,40 @@ ApplicationWindow {
169196
implicitHeight: Style.activityListButtonHeight
170197

171198
padding: 0
172-
leftPadding: Style.standardSpacing
173-
rightPadding: Style.standardSpacing
199+
leftPadding: Style.smallSpacing
200+
rightPadding: Style.smallSpacing
174201
spacing: Style.standardSpacing
175202

176203
contentItem: Row {
177204
id: fileActionsContent
178205
anchors.fill: parent
179206
anchors.margins: Style.smallSpacing
180207
spacing: Style.standardSpacing
208+
Layout.fillWidth: true
181209

182210
Image {
183-
source: icon
184-
width: Style.minimumActivityItemHeight
185-
height: Style.minimumActivityItemHeight
211+
source: icon + palette.windowText
212+
width: Style.activityListButtonHeight
213+
height: Style.activityListButtonHeight
186214
fillMode: Image.PreserveAspectFit
187215
anchors.verticalCenter: parent.verticalCenter
188216
}
189217

190218
Label {
191219
text: name
192-
color: Style.ncHeaderTextColor
193-
font.pixelSize: Style.pixelSize
220+
color: palette.text
221+
font.pixelSize: Style.defaultFontPtSize
194222
verticalAlignment: Text.AlignVCenter
195223
anchors.verticalCenter: parent.verticalCenter
196224
}
197225
}
198226

199-
ToolTip {
200-
visible: fileActionButton.hovered
201-
text: name
227+
MouseArea {
228+
id: fileActionMouseArea
229+
anchors.fill: parent
230+
cursorShape: Qt.PointingHandCursor
231+
onClicked: fileActionModel.createRequest(index)
202232
}
203-
204-
onClicked: fileActionModel.createRequest(index)
205233
}
206234
}
207235
}

0 commit comments

Comments
 (0)