feat: adjust notification center UI styling and layout#1522
Merged
deepin-bot[bot] merged 1 commit intolinuxdeepin:masterfrom Mar 23, 2026
Merged
feat: adjust notification center UI styling and layout#1522deepin-bot[bot] merged 1 commit intolinuxdeepin:masterfrom
deepin-bot[bot] merged 1 commit intolinuxdeepin:masterfrom
Conversation
Reviewer's GuideRefines the notification center’s visual design by tightening layout margins/padding, adjusting crystal theme/background and blur colors, tuning notification/overlap backgrounds and opacity, simplifying text rendering, and adding configurability for overlap clipping and theme-aware header text colors. Class diagram for updated notification center QML componentsclassDiagram
class MainWindow {
+int contentPadding
+int width
+int topMargin
+int rightMargin
+int bottomMargin
+double blendColorAlpha(double fallback)
}
class StyledBehindWindowBlur {
+bool valid
+color blendColor
}
class NotifyHeaderTitleText {
+font tFont
+color color
}
class DropShadowText {
+color color
}
class OverlapIndicator {
+int count
+int radius
+int overlapHeight
+bool revert
+bool enableAnimation
+bool clipItems
}
class OverlapNotify {
+int count
}
class NormalNotify {
+int count
}
class NotifyItemBackground {
+double opacity
+Palette backgroundColor
}
class Palette {
+PaletteVariant normal
+PaletteVariant normalDark
}
class PaletteVariant {
+color common
+color crystal
}
class NotifyStyle {
+int scrollBarPadding
+int leftMargin
}
class contentItem {
+int width
}
DropShadowText <|-- NotifyHeaderTitleText
MainWindow o-- StyledBehindWindowBlur
OverlapNotify o-- OverlapIndicator
OverlapNotify o-- NotifyItemBackground
NormalNotify o-- NotifyItemBackground
NotifyItemBackground o-- Palette
Palette o-- PaletteVariant
MainWindow o-- NotifyStyle
NotifyStyle o-- contentItem
Flow diagram for updated blendColorAlpha selection logicflowchart TD
A[Start blendColorAlpha] --> B[Get appearance from DS.applet]
B --> C{appearance exists and appearance.opacity >= 0}
C -- Yes --> D[Return appearance.opacity]
C -- No --> E[Return fallback]
D --> F[End]
E --> F[End]
File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
![sourcery-ai[bot]](https://avatars.githubusercontent.com/in/48477?s=60&v=4){kind=small}
There was a problem hiding this comment.
Hey - I've found 1 issue, and left some high level feedback:
- The new blendColorAlpha(fallback) helper directly returns appearance.opacity without any bounds checking; consider clamping this value to a sane range (e.g. 0–1) to avoid surprising results if appearance returns out‑of‑range values.
- In OverlapIndicator the new clipItems property defaults to false, changing the previous behavior where clip was always true; if only some consumers need unclipped items, it might be safer to default clipItems to true and explicitly disable it where needed.
- DropShadowText now has the DropShadow layer completely commented out; if the shadow is no longer needed, consider removing the dead code instead of commenting it to keep the component clean and easier to maintain.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- The new blendColorAlpha(fallback) helper directly returns appearance.opacity without any bounds checking; consider clamping this value to a sane range (e.g. 0–1) to avoid surprising results if appearance returns out‑of‑range values.
- In OverlapIndicator the new clipItems property defaults to false, changing the previous behavior where clip was always true; if only some consumers need unclipped items, it might be safer to default clipItems to true and explicitly disable it where needed.
- DropShadowText now has the DropShadow layer completely commented out; if the shadow is no longer needed, consider removing the dead code instead of commenting it to keep the component clean and easier to maintain.
## Individual Comments
### Comment 1
<location path="panels/notification/center/OverlapNotify.qml" line_range="151" />
<code_context>
z: -1
count: root.count
background: NotifyItemBackground {
+ opacity: parent && parent.realIndex === 0 ? 0.6 : 0.4
backgroundColor: Palette {
normal {
</code_context>
<issue_to_address>
**issue (bug_risk):** `parent.realIndex` is likely not the intended source for the index.
Within `NotifyItemBackground`, `parent` is likely the `Loader` (or another wrapper), not the Repeater delegate that owns `realIndex`. That would make `parent.realIndex` `undefined`, so this always evaluates to `0.4` and the first item never gets `0.6` opacity. Consider passing `realIndex` explicitly as a property to `NotifyItemBackground` or referencing it via a specific id in scope instead of relying on `parent.realIndex`.
</issue_to_address>Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
18202781743
reviewed
Mar 23, 2026
wjyrich
force-pushed
the
feat-updateNotifyUI
branch
2 times, most recently
from
6414895 to
00d2079
Compare
1. Changed crystal theme background color from pure white to light gray (240/255) for better visual comfort 2. Added text color handling for notification header using DStyle control selectColor 3. Reduced content padding from 20 to 10 and adjusted window margins for tighter layout 4. Removed left margin from content area and right margin from header 5. Updated blendColor function to use local blendColorAlpha instead of dock.blendColorAlpha 6. Modified blur background colors and opacity values for better visual integration 7. Added clipItems property to OverlapIndicator to control clipping behavior 8. Adjusted close button position in NotifyItemContent (rightMargin: -width/2 + 6) 9. Changed gradient background opacity from 1.0 to 0.5 for crystal theme 10. Reduced leftMargin in NotifyStyle from 20 to 10 11. Disabled drop shadow effect on DropShadowText for cleaner appearance Log: Improved notification center visual design with adjusted colors, spacing, and effects Influence: 1. Verify notification center appearance in both light and dark themes 2. Test overlapping notifications display with new clipping behavior 3. Check close button positioning in notification items 4. Verify window margins and padding in different screen configurations 5. Test notification header text color in various theme conditions 6. Validate blur effect and transparency in crystal theme 7. Check notification item background opacity in overlap mode feat: 调整通知中心UI样式和布局 1. 将水晶主题背景色从纯白色改为浅灰色(240/255)，提升视觉舒适度 2. 为通知标题添加使用DStyle控制选择颜色的文本颜色处理 3. 将内容内边距从20减少到10，调整窗口边距实现更紧凑的布局 4. 移除内容区域的左边距和标题的右边距 5. 更新混合颜色函数使用本地blendColorAlpha替代dock.blendColorAlpha 6. 修改模糊背景颜色和透明度值以实现更好的视觉融合 7. 为重叠指示器添加clipItems属性以控制裁剪行为 8. 调整通知项内容中关闭按钮的位置(rightMargin: -width/2 + 6) 9. 将渐变背景透明度从1.0改为0.5（水晶主题） 10. 将NotifyStyle中的左边距从20减少到10 11. 禁用DropShadowText的阴影效果以获得更简洁的外观 Log: 优化通知中心视觉设计，调整颜色、间距和效果 Influence: 1. 验证通知中心在浅色和深色主题下的外观 2. 测试重叠通知显示与新裁剪行为 3. 检查通知项中关闭按钮的定位 4. 验证不同屏幕配置下的窗口边距和内边距 5. 测试各种主题条件下通知标题文本颜色 6. 验证水晶主题下的模糊效果和透明度 7. 检查重叠模式下通知项背景透明度
wjyrich
force-pushed
the
feat-updateNotifyUI
branch
from
00d2079 to
7b2ec7c
Compare
18202781743
approved these changes
Mar 23, 2026
|
[APPROVALNOTIFIER] This PR is NOT APPROVED This pull-request has been approved by: 18202781743, wjyrich The full list of commands accepted by this bot can be found here. DetailsNeeds approval from an approver in each of these files:Approvers can indicate their approval by writing |
Contributor
Author
|
/forcemerge |
|
This pr force merged! (status: behind) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Log: Improved notification center visual design with adjusted colors, spacing, and effects
Influence:
feat: 调整通知中心UI样式和布局
Log: 优化通知中心视觉设计，调整颜色、间距和效果
Influence:
Summary by Sourcery
Refine the notification center’s visual design for the crystal theme and general layouts to improve readability and spatial compactness.
Enhancements: