Skip to content

Commit cbfd53e

Browse files
committed
fix: improve notification close button hover detection
The close button in notifications was difficult to click because the hover detection area was too small. Changed the FocusScope to a Control component with hover tracking capability. Added hover state as a trigger condition for displaying the close button, making it easier for users to close notifications by expanding the interactive area. Log: Improved notification close button interaction by expanding hover detection area Influence: 1. Test hovering over notification area to verify close button appears 2. Verify close button functionality works correctly when clicked 3. Test with notifications containing actions to ensure strongInteractive mode still works 4. Check close button visibility in different notification states 5. Verify accessibility and keyboard navigation still functions properly fix: 改进通知关闭按钮悬停检测 通知中的关闭按钮难以点击,因为悬停检测区域太小。将 FocusScope 改为具有悬 停跟踪功能的 Control 组件。添加悬停状态作为显示关闭按钮的触发条件,通过 扩大交互区域使用户更容易关闭通知。 Log: 通过扩大悬停检测区域改进了通知关闭按钮的交互体验 Influence: 1. 测试悬停在通知区域时关闭按钮是否正常显示 2. 验证点击关闭按钮功能是否正常工作 3. 测试包含操作的通知,确保强交互模式仍然有效 4. 检查不同通知状态下关闭按钮的可见性 5. 验证辅助功能和键盘导航是否仍然正常工作
1 parent d93d7bd commit cbfd53e

File tree

1 file changed

+4
-4
lines changed

1 file changed

+4
-4
lines changed

panels/notification/plugin/NotifyItemContent.qml

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ NotifyItem {
1313
id: root
1414
implicitWidth: impl.implicitWidth
1515
implicitHeight: impl.implicitHeight
16-
property bool closeVisible: activeFocus
16+
property bool closeVisible: activeFocus || impl.hovered
1717
property int miniContentHeight: NotifyStyle.contentItem.miniHeight
1818
property bool enableDismissed: true
1919

@@ -47,8 +47,8 @@ NotifyItem {
4747
}
4848

4949
// placeHolder to receive MouseEvent
50-
FocusScope {
51-
focus: true
50+
Control {
51+
id: closePlaceHolder
5252
anchors {
5353
top: parent.top
5454
topMargin: -height / 2
@@ -60,7 +60,7 @@ NotifyItem {
6060

6161
Loader {
6262
focus: true
63-
active: !(root.strongInteractive && root.actions.length > 0) && (root.closeVisible || activeFocus)
63+
active: !(root.strongInteractive && root.actions.length > 0) && (root.closeVisible || closePlaceHolder.hovered || activeFocus)
6464
sourceComponent: SettingActionButton {
6565
id: closeBtn
6666
objectName: "closeNotify-" + root.appName

0 commit comments

Comments
 (0)