-
Notifications
You must be signed in to change notification settings - Fork 60
fix: improve taskbar title display with smooth truncation #1443
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: master
Are you sure you want to change the base?
Conversation
|
[APPROVALNOTIFIER] This PR is NOT APPROVED This pull-request has been approved by: 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 |
Reviewer's GuideImplements a smooth fade-out truncation effect for taskbar app titles by replacing ellipsis-based elision with a gradient opacity mask, and adjusts TextCalculator to return full text when at least two characters fit while respecting optimal width constraints. Sequence diagram for taskbar title rendering with fade-out truncationsequenceDiagram
actor User
participant Taskbar
participant AppItemTitleQML
participant TextCalculatorAttached
participant TextCalculator
participant TitleLoader
participant TitleContainer
participant OpacityMaskEffect
User->>Taskbar: View taskbar
Taskbar->>AppItemTitleQML: Create/update title for app item
AppItemTitleQML->>TextCalculatorAttached: set text and calculator
TextCalculatorAttached->>TextCalculatorAttached: updateElidedText()
TextCalculatorAttached->>TextCalculator: font()
TextCalculator->>TextCalculator: optimalSingleTextWidth()
TextCalculatorAttached->>TextCalculatorAttached: canDisplayMinChars(text, fontMetrics, maxWidth)
alt AtLeastTwoCharsFit
TextCalculatorAttached->>TextCalculatorAttached: m_elidedText = full text
else NotEnoughSpace
TextCalculatorAttached->>TextCalculatorAttached: m_elidedText = empty
end
AppItemTitleQML->>TitleLoader: active = enabled && elidedText.length > 0
TitleLoader->>TitleContainer: Instantiate when active
TitleContainer->>TextCalculator: optimalSingleTextWidth()
TitleContainer->>TitleContainer: width = min(titleText.implicitWidth, optimalSingleTextWidth)
TitleContainer->>TitleContainer: layer.enabled = titleText.implicitWidth > width + 1
alt NeedsFadeOut
TitleContainer->>OpacityMaskEffect: Apply horizontal gradient mask
else FitsWithoutFade
TitleContainer->>TitleContainer: clip = false (no fade)
end
TitleContainer->>User: Display title with smooth fade-out when truncated
Class diagram for updated TextCalculator truncation logicclassDiagram
class TextCalculator {
+QFont m_font
+qreal optimalSingleTextWidth()
+QFont font()
+qreal calculateElidedTextWidth(QString text, qreal maxWidth)
+QStringList getApplicationTitles()
}
class TextCalculatorAttached {
-TextCalculator *m_calculator
-QString m_text
-QString m_elidedText
+void updateElidedText()
+QString text()
+QString elidedText()
+TextCalculator* calculator()
}
class canDisplayMinChars {
+static bool canDisplayMinChars(QString text, QFontMetricsF fontMetrics, qreal maxWidth)
}
TextCalculatorAttached --> TextCalculator : uses
TextCalculator ..> canDisplayMinChars : calls
TextCalculatorAttached ..> canDisplayMinChars : calls
File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hey - I've left some high level feedback:
- The
OpacityMask'smaskSourcerectangle is only sized toellipsisMetrics.width/height, which likely means most of the text is fully masked out; consider matching the mask rectangle totitleContainer's full size and applying the gradient only on the trailing portion instead. - In
AppItemTitle.qml, the fade gradient is hard-coded with opaque white (#FFFFFFFF), which may not behave as expected if the text color or background changes; you might want to derive the mask color from the actual text color or use an alpha-only mask to avoid theme-dependent artifacts.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- The `OpacityMask`'s `maskSource` rectangle is only sized to `ellipsisMetrics.width/height`, which likely means most of the text is fully masked out; consider matching the mask rectangle to `titleContainer`'s full size and applying the gradient only on the trailing portion instead.
- In `AppItemTitle.qml`, the fade gradient is hard-coded with opaque white (`#FFFFFFFF`), which may not behave as expected if the text color or background changes; you might want to derive the mask color from the actual text color or use an alpha-only mask to avoid theme-dependent artifacts.Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
df01ad2 to
7cd90a9
Compare
1. Modified TextCalculator to track truncation status and ellipsis width 2. Added gradient fade effect for truncated text instead of ellipsis character 3. Changed minimum character count from 1 to 2 for better readability 4. Added new properties isTruncated and ellipsisWidth to TextCalculatorAttached 5. Implemented OpacityMask with gradient for smooth text fade-out Log: Improved task manager app title display with gradient fade effect for truncated text Influence: 1. Test app titles with varying lengths to ensure proper truncation 2. Verify gradient fade effect appears only when text is truncated 3. Check text alignment and positioning with the new fade effect 4. Test with both light and dark themes to ensure color compatibility 5. Verify minimum character count of 2 is respected in all cases 6. Test performance with multiple app items displaying truncated titles fix: 改进文本截断效果,添加渐变淡出 1. 修改TextCalculator以跟踪截断状态和省略号宽度 2. 为截断文本添加渐变淡出效果替代省略号字符 3. 将最小字符数从1改为2以提高可读性 4. 向TextCalculatorAttached添加isTruncated和ellipsisWidth属性 5. 实现带渐变的OpacityMask以实现平滑的文本淡出效果 Log: 改进任务管理器应用标题显示,为截断文本添加渐变淡出效果 Influence: 1. 测试不同长度的应用标题以确保正确截断 2. 验证渐变淡出效果仅在文本被截断时出现 3. 检查新淡出效果下的文本对齐和定位 4. 测试浅色和深色主题以确保颜色兼容性 5. 验证在所有情况下都遵守最小2个字符的限制 6. 测试多个应用项目显示截断标题时的性能表现
7cd90a9 to
f3e908c
Compare
deepin pr auto review这份代码 diff 主要是为了实现一个功能:在任务栏应用标题过长被截断时,增加一个渐隐的视觉效果,而不是生硬地切断。同时修改了文本截断计算的最小字符限制。 以下是对该代码的审查意见,包括语法逻辑、代码质量、性能和安全方面的建议: 1. 语法与逻辑审查
2. 代码质量
3. 性能
4. 安全性
修改建议汇总代码示例textcalculator.cpp 优化片段: void TextCalculatorAttached::updateElidedText()
{
if (!m_calculator) {
qCDebug(textCalculatorLog) << "No calculator available for elided text update";
m_elidedText.clear();
m_ellipsisWidth = 0.0;
m_isTruncated = false;
emit elidedTextChanged();
emit ellipsisWidthChanged();
emit isTruncatedChanged();
return;
}
// ... (获取 maxWidth 等前置代码)
const QLatin1String ellipsisChar("...");
QString newElidedText = fontMetrics.elidedText(m_text, Qt::ElideRight, maxWidth);
// 重置状态
bool newIsTruncated = false;
qreal newEllipsisWidth = 0.0;
if (!isValidElidedText(newElidedText)) {
newElidedText = {};
} else {
newIsTruncated = (m_text != newElidedText);
if (newIsTruncated) {
// 如果需要移除省略号以配合QML渐变
newElidedText.replace(ellipsisChar, "");
newEllipsisWidth = fontMetrics.horizontalAdvance(ellipsisChar);
}
}
// 批量更新状态并发射信号
if (m_elidedText != newElidedText) {
m_elidedText = newElidedText;
emit elidedTextChanged();
}
if (m_isTruncated != newIsTruncated) {
m_isTruncated = newIsTruncated;
emit isTruncatedChanged();
}
if (m_ellipsisWidth != newEllipsisWidth) {
m_ellipsisWidth = newEllipsisWidth;
emit ellipsisWidthChanged();
}
}AppItemTitle.qml 优化片段: layer.enabled: root.TextCalculator.isTruncated
layer.effect: OpacityMask {
maskSource: Rectangle {
width: root.TextCalculator.ellipsisWidth > 0 ? root.TextCalculator.ellipsisWidth : 0
height: titleText.height
// 使用纯色配合透明度,确保只影响Alpha通道
gradient: Gradient {
orientation: Gradient.Horizontal
GradientStop { position: 0.0; color: "#FFFFFFFF" } // 完全不透明(显示文字)
GradientStop { position: 1.0; color: "#00FFFFFF" } // 完全透明(隐藏文字)
}
}
}(注:Gradient 的 position 范围和具体颜色值需根据实际 UI 效果微调,上述代码仅示意逻辑) |
| } | ||
|
|
||
| if (m_isTruncated) { | ||
| m_ellipsisWidth = fontMetrics.horizontalAdvance(QString::fromUtf8("…")); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
m_ellipsisWidth = maxWidth - 当前需要正常显示的字符的长度,
显示的字符 = 正常显示的字符 + 需要渐变的长度(例如省略号的长度),
| newElidedText = {}; | ||
| } else { | ||
| m_isTruncated = (m_text != newElidedText); | ||
| emit isTruncatedChanged(); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这个加个判断来是否触发信号,
| qCDebug(textCalculatorLog) << "No calculator available for elided text update"; | ||
| m_elidedText.clear(); | ||
| m_ellipsisWidth = 0.0; | ||
| m_isTruncated = false; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
m_ellipsisWidth 不为0是不是就是m_isTruncated
|
例如,现在能正常显示三个字符,当前应用为五个字符,那应该是第四个汉字开始渐隐吧,而不是第三个就开始了,能够显示的文本是四个字符或者更多, |
Log: Improved taskbar application title display with smooth fade-out effect instead of ellipsis
Influence:
fix: 改进任务栏标题显示,实现平滑截断效果
Log: 改进任务栏应用程序标题显示,使用平滑淡出效果替代省略号
Influence:
PMS: BUG-350289
Summary by Sourcery
Improve dock taskbar application title display with smooth truncation and minimum visible characters.
New Features:
Bug Fixes:
Enhancements: