Skip to content

Commit 6dbf86a

Browse files
wjyrichwjyrich
committed
feat: add split window background support for dock app items
1. Created new AppBackground.qml component to handle split window background rendering 2. Added splitBackgroundVisible property to control split background display 3. Enhanced AppletItemBackground.qml with drawDefaultBackground property for conditional rendering 4. Modified AppItem.qml to use AppBackground instead of AppletItemBackground 5. Updated text calculation logic to remove extra spacing between icon and title 6. Added windowSplit property propagation through components 7. Improved title text color handling based on active state and theme Log: Added split window background visualization for dock app items Influence: 1. Test dock app items with multiple windows open in split mode 2. Verify background colors change correctly in light and dark themes 3. Check hover and active states for split window backgrounds 4. Test title text color changes when app is active 5. Verify spacing between icon and title in split mode 6. Test transition animations when switching between split and non- split modes feat: 为任务栏应用项添加分屏窗口背景支持 1. 创建新的 AppBackground.qml 组件处理分屏窗口背景渲染 2. 添加 splitBackgroundVisible 属性控制分屏背景显示 3. 增强 AppletItemBackground.qml 添加 drawDefaultBackground 属性用于条件 渲染 4. 修改 AppItem.qml 使用 AppBackground 替代 AppletItemBackground 5. 更新文本计算逻辑，移除图标和标题之间的额外间距 6. 添加 windowSplit 属性在组件间传递 7. 改进标题文本颜色处理，基于激活状态和主题 Log: 新增任务栏应用项分屏窗口背景可视化功能 Influence: 1. 测试分屏模式下打开多个窗口的任务栏应用项 2. 验证浅色和深色主题下背景颜色正确变化 3. 检查分屏窗口背景的悬停和激活状态 4. 测试应用激活时标题文本颜色变化 5. 验证分屏模式下图标和标题之间的间距 6. 测试分屏和非分屏模式切换时的过渡动画
1 parent 79ee98f commit 6dbf86a

File tree

7 files changed

+245
-46
lines changed

7 files changed

+245
-46
lines changed

‎panels/dock/AppletItemBackground.qml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
// SPDX-FileCopyrightText: 2024 UnionTech Software Technology Co., Ltd.
1+
// SPDX-FileCopyrightText: 2024 - 2026 UnionTech Software Technology Co., Ltd.
22
//
33
// SPDX-License-Identifier: GPL-3.0-or-later
44

‎panels/dock/taskmanager/package/AppBackground.qml‎

Lines changed: 208 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,208 @@
1+
// SPDX-FileCopyrightText: 2026 UnionTech Software Technology Co., Ltd.
2+
//
3+
// SPDX-License-Identifier: GPL-3.0-or-later
4+
5+
import QtQuick
6+
import QtQuick.Controls
7+
8+
import org.deepin.ds.dock 1.0
9+
import org.deepin.dtk
10+
11+
AppletItemBackground {
12+
id: control
13+
property bool splitBackgroundVisible: false
14+
property bool windowSplit: false
15+
property int windowCount: 0
16+
property int displayMode: Dock.Efficient
17+
property bool isHovered: false
18+
backgroundColor: Palette {
19+
normal {
20+
crystal: if (displayMode === Dock.Efficient && control.windowCount > 0) {
21+
return Qt.rgba(1.0, 1.0, 1.0, 0.35)
22+
} else {
23+
return ("transparent")
24+
}
25+
}
26+
normalDark: {
27+
crystal: if (displayMode === Dock.Efficient && control.windowCount > 0) {
28+
return Qt.rgba(1.0, 1.0, 1.0, 0.1)
29+
} else {
30+
return ("transparent")
31+
}
32+
}
33+
hovered {
34+
crystal: Qt.rgba(1.0, 1.0, 1.0, 0.15)
35+
}
36+
hoveredDark {
37+
crystal: Qt.rgba(1.0, 1.0, 1.0, 0.15)
38+
}
39+
pressed {
40+
crystal: Qt.rgba(1.0, 1.0, 1.0, 0.25)
41+
}
42+
pressedDark {
43+
crystal: Qt.rgba(1.0, 1.0, 1.0, 0.25)
44+
}
45+
}
46+
activeBackgroundColor: Palette {
47+
normal {
48+
crystal: if (displayMode === Dock.Efficient) {
49+
return Qt.rgba(1.0, 1.0, 1.0, 0.8)
50+
} else {
51+
return ("transparent")
52+
}
53+
}
54+
normalDark: {
55+
crystal: if (displayMode === Dock.Efficient) {
56+
return Qt.rgba(1.0, 1.0, 1.0, 0.6)
57+
} else {
58+
return ("transparent")
59+
}
60+
}
61+
hovered {
62+
crystal: if (displayMode === Dock.Efficient) {
63+
return Qt.rgba(1.0, 1.0, 1.0, 0.9)
64+
} else {
65+
return ("transparent")
66+
}
67+
}
68+
hoveredDark: {
69+
crystal: if (displayMode === Dock.Efficient) {
70+
return Qt.rgba(1.0, 1.0, 1.0, 0.7)
71+
} else {
72+
return Qt.rgba(1.0, 1.0, 1.0, 0.15)
73+
}
74+
}
75+
pressed {
76+
crystal: Qt.rgba(1.0, 1.0, 1.0, 0.6)
77+
}
78+
pressedDark: {
79+
crystal: Qt.rgba(1.0, 1.0, 1.0, 0.8)
80+
}
81+
}
82+
insideBorderColor: Palette {
83+
normal {
84+
crystal: if (displayMode === Dock.Efficient && control.windowCount > 0) {
85+
return Qt.rgba(1.0, 1.0, 1.0, 0.05)
86+
} else {
87+
return ("transparent")
88+
}
89+
}
90+
normalDark: normal
91+
hovered {
92+
crystal: Qt.rgba(0, 0, 0, 0.05)
93+
}
94+
hoveredDark: hovered
95+
pressed: hovered
96+
pressedDark: pressed
97+
}
98+
99+
activeInsideBorderColor: Palette {
100+
normal {
101+
crystal: if (displayMode === Dock.Efficient) {
102+
return Qt.rgba(0, 0, 0, 0.1)
103+
} else {
104+
return ("transparent")
105+
}
106+
}
107+
normalDark: {
108+
crystal: if (displayMode === Dock.Efficient) {
109+
return Qt.rgba(1.0, 1.0, 1.0, 0.1)
110+
} else {
111+
return ("transparent")
112+
}
113+
}
114+
hovered {
115+
crystal: Qt.rgba(1.0, 1.0, 1.0, 0.1)
116+
}
117+
hoveredDark: hovered
118+
pressed: hovered
119+
pressedDark: pressed
120+
}
121+
outsideBorderColor: Palette {
122+
normal: {
123+
crystal: ("transparent")
124+
}
125+
normalDark: normal
126+
hovered : normal
127+
hoveredDark: hovered
128+
pressed: hovered
129+
pressedDark: pressed
130+
}
131+
activeOutsideBorderColor: Palette {
132+
normal {
133+
crystal: if (displayMode === Dock.Efficient) {
134+
return Qt.rgba(0, 0, 0, 0.1)
135+
} else {
136+
return ("transparent")
137+
}
138+
}
139+
normalDark {
140+
crystal: if (displayMode === Dock.Efficient) {
141+
return Qt.rgba(0, 0, 0, 0.05)
142+
} else {
143+
return ("transparent")
144+
}
145+
}
146+
hovered {
147+
crystal: Qt.rgba(0.0, 0.0, 0.0, 0.10)
148+
}
149+
hoveredDark: hovered
150+
pressed {
151+
crystal: Qt.rgba(0.0, 0.0, 0.0, 0.10)
152+
}
153+
pressedDark {
154+
crystal: Qt.rgba(0.0, 0.0, 0.0, 0.05)
155+
}
156+
}
157+
158+
// Rectangle {
159+
// anchors.fill: parent
160+
// radius: control.radius
161+
// visible: control.windowCount > 0 && control.displayMode === Dock.Efficient
162+
// color: {
163+
// if (displayMode === Dock.Efficient) {
164+
// if (isActive) {
165+
// return DTK.themeType === ApplicationHelper.DarkType
166+
// ? Qt.rgba(1.0, 1.0, 1.0, 0.6) : Qt.rgba(1.0, 1.0, 1.0, 0.8)
167+
// } else {
168+
// return DTK.themeType === ApplicationHelper.DarkType
169+
// ? Qt.rgba(1.0, 1.0, 1.0, 0.1) : Qt.rgba(1.0, 1.0, 1.0, 0.35)
170+
// }
171+
// }
172+
// }
173+
// }
174+
// InsideBoxBorder {
175+
// anchors.fill: parent
176+
// radius: control.radius
177+
// visible: control.windowCount > 0 && control.displayMode === Dock.Efficient
178+
// color: {
179+
// if (displayMode === Dock.Efficient) {
180+
// if (isActive) {
181+
// return DTK.themeType === ApplicationHelper.DarkType
182+
// ? Qt.rgba(0, 0, 0, 0.1) : Qt.rgba(0, 0, 0, 0.1)
183+
// } else {
184+
// return DTK.themeType === ApplicationHelper.DarkType
185+
// ? Qt.rgba(0, 0, 0, 0.05) : Qt.rgba(0, 0, 0, 0.05)
186+
// }
187+
// }
188+
// }
189+
// borderWidth: 1 / Screen.devicePixelRatio
190+
// }
191+
// OutsideBoxBorder {
192+
// anchors.fill: parent
193+
// radius: control.radius
194+
// visible: control.windowCount > 0 && control.displayMode === Dock.Efficient
195+
// color: {
196+
// if (displayMode === Dock.Efficient) {
197+
// if (isActive) {
198+
// return DTK.themeType === ApplicationHelper.DarkType
199+
// ? Qt.rgba(0, 0, 0, 0.1) : Qt.rgba(0, 0, 0, 0.1)
200+
// } else {
201+
// return ("transparent")
202+
// }
203+
// }
204+
// }
205+
// borderWidth: 1 / Screen.devicePixelRatio
206+
// }
207+
208+
}

‎panels/dock/taskmanager/package/AppItem.qml‎

Lines changed: 30 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ Item {
2424
required property int visualIndex
2525
required property var modelIndex
2626
required property string title
27+
required property bool windowSplit
2728

2829
property real blendOpacity: 1.0
2930

@@ -38,11 +39,11 @@ Item {
3839
Drag.mimeData: { "text/x-dde-dock-dnd-appid": itemId, "text/x-dde-dock-dnd-source": "taskbar", "text/x-dde-dock-dnd-winid": windows.length > 0 ? windows[0] : ""}
3940

4041
property bool useColumnLayout: Panel.rootObject.useColumnLayout
41-
property int statusIndicatorSize: useColumnLayout ? root.width * 0.72 : root.height * 0.72
4242
property int iconSize: Panel.rootObject.dockItemMaxSize * 9 / 14
4343
property bool enableTitle: false
4444
property bool titleActive: enableTitle && titleLoader.active
45-
property int appTitleSpacing: 0
45+
property bool isHovered: hoverHandler.hovered
46+
property bool splitBackgroundVisible: root.windowSplit && root.enableTitle
4647
property var iconGlobalPoint: {
4748
var a = icon
4849
var x = 0, y = 0
@@ -79,16 +80,15 @@ Item {
7980
Control {
8081
anchors.fill: parent
8182
id: appItem
82-
implicitWidth: root.titleActive ? (iconContainer.width + 4 + titleLoader.width + root.appTitleSpacing) : iconContainer.width + root.appTitleSpacing
83+
implicitWidth: root.titleActive ? (root.iconSize + hoverBackground.horizontalSpacing + titleLoader.width) : iconContainer.width
8384
visible: !root.Drag.active // When in dragging, hide app item
84-
background: AppletItemBackground {
85+
background: AppBackground {
8586
id: hoverBackground
8687

8788
readonly property int verticalSpacing: Math.round(root.iconSize / 8) + 1
8889
readonly property int horizontalSpacing: Math.round(root.iconSize / 8)
8990
readonly property int nonSplitHeight: root.iconSize + verticalSpacing * 2
90-
readonly property int hoverPadding: Math.round((Panel.rootObject.dockItemMaxSize * 0.8 - root.iconSize) / 2)
91-
readonly property int splitWidth: Math.round(icon.width + titleLoader.width + hoverPadding * 2)
91+
readonly property int splitWidth: Math.round(root.iconSize + titleLoader.width + horizontalSpacing * 3)
9292
readonly property int nonSplitWidth: Math.round(root.iconSize + horizontalSpacing * 2)
9393

9494
enabled: false
@@ -98,10 +98,11 @@ Item {
9898
radius: height / 5
9999
anchors.centerIn: parent
100100
isActive: root.active
101-
opacity: (hoverHandler.hovered || (root.active && root.windows.length > 0)) ? 1.0 : 0.0
102-
Behavior on opacity {
103-
NumberAnimation { duration: 150 }
104-
}
101+
isHovered: root.isHovered
102+
splitBackgroundVisible: root.splitBackgroundVisible
103+
windowSplit: root.windowSplit
104+
windowCount: root.windows.length
105+
displayMode: root.displayMode
105106
}
106107
Item {
107108
id: iconContainer
@@ -118,10 +119,6 @@ Item {
118119
anchors.left: parent.left
119120
anchors.horizontalCenter: undefined
120121
}
121-
PropertyChanges {
122-
target: iconContainer
123-
anchors.leftMargin: hoverBackground.horizontalSpacing
124-
}
125122
},
126123
State {
127124
name: "nonTitleActive"
@@ -134,13 +131,12 @@ Item {
134131
}
135132
}
136133
]
137-
StatusIndicator {
138-
id: statusIndicator
139-
palette: itemPalette
140-
width: root.statusIndicatorSize
141-
height: root.statusIndicatorSize
142-
anchors.centerIn: iconContainer
143-
visible: root.displayMode === Dock.Efficient && root.windows.length > 0
134+
135+
Connections {
136+
function onDisplayModeChanged() {
137+
windowIndicator.updateIndicatorAnchors()
138+
}
139+
target: root
144140
}
145141

146142
Connections {
@@ -215,28 +211,30 @@ Item {
215211
windowIndicator.anchors.horizontalCenter = undefined
216212
windowIndicator.anchors.verticalCenter = undefined
217213

214+
const anchorTarget = root.displayMode === Dock.Efficient ? appItem : hoverBackground
215+
218216
switch(Panel.position) {
219217
case Dock.Top: {
220218
windowIndicator.anchors.horizontalCenter = iconContainer.horizontalCenter
221-
windowIndicator.anchors.top = hoverBackground.top
219+
windowIndicator.anchors.top = anchorTarget.top
222220
windowIndicator.anchors.topMargin = 1
223221
return
224222
}
225223
case Dock.Bottom: {
226224
windowIndicator.anchors.horizontalCenter = iconContainer.horizontalCenter
227-
windowIndicator.anchors.bottom = hoverBackground.bottom
225+
windowIndicator.anchors.bottom = anchorTarget.bottom
228226
windowIndicator.anchors.bottomMargin = 1
229227
return
230228
}
231229
case Dock.Left: {
232230
windowIndicator.anchors.verticalCenter = parent.verticalCenter
233-
windowIndicator.anchors.left = hoverBackground.left
231+
windowIndicator.anchors.left = anchorTarget.left
234232
windowIndicator.anchors.leftMargin = 1
235233
return
236234
}
237235
case Dock.Right:{
238236
windowIndicator.anchors.verticalCenter = parent.verticalCenter
239-
windowIndicator.anchors.right = hoverBackground.right
237+
windowIndicator.anchors.right = anchorTarget.right
240238
windowIndicator.anchors.rightMargin = 1
241239
return
242240
}
@@ -251,13 +249,18 @@ Item {
251249
AppItemTitle {
252250
id: titleLoader
253251
anchors.left: iconContainer.right
254-
anchors.leftMargin: 4
252+
anchors.leftMargin: Math.round(root.iconSize / 8)
255253
anchors.verticalCenter: parent.verticalCenter
256254
enabled: root.enableTitle && root.windows.length > 0
257255
text: root.title
256+
textColor: {
257+
if (root.displayMode === Dock.Efficient && root.active) {
258+
return "#000000"
259+
}
260+
return D.DTK.themeType === D.ApplicationHelper.DarkType ? "#FFFFFF" : "#000000"
261+
}
258262
}
259263

260-
// TODO: value can set during debugPanel
261264
Loader {
262265
id: animationRoot
263266
anchors.fill: parent

‎panels/dock/taskmanager/package/AppItemTitle.qml‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ Item {
1414

1515
property bool active: titleLoader.active
1616
property string text: ""
17+
property color textColor: D.DTK.themeType === D.ApplicationHelper.DarkType ? "#FFFFFF" : "#000000"
1718

1819
implicitWidth: titleLoader.width
1920
implicitHeight: titleLoader.height
@@ -28,7 +29,7 @@ Item {
2829

2930
text: root.TextCalculator.elidedText
3031

31-
color: D.DTK.themeType === D.ApplicationHelper.DarkType ? "#FFFFFF" : "#000000"
32+
color: root.textColor
3233
font: root.TextCalculator.calculator.font
3334
verticalAlignment: Text.AlignVCenter
3435

‎panels/dock/taskmanager/package/StatusIndicator.qml‎

Lines changed: 0 additions & 12 deletions
This file was deleted.

0 commit comments

Comments
 (0)