fix: 网卡切换chip列表溢出时显示水平滚动条
网卡数量过多或名称过长时,chip 列表溢出弹窗右边界被裁切且无滚动条。 增大 Flickable 高度(32->40px)容纳滚动条,并为 ScrollBar 添加自定义 contentItem 样式,确保深浅主题下均可见可交互。
This commit is contained in:
+15
-1
@@ -548,7 +548,9 @@ AppletItem {
|
|||||||
Flickable {
|
Flickable {
|
||||||
id: chipFlickable
|
id: chipFlickable
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.preferredHeight: 32
|
// 高度需容纳 chip(28px)+ 水平滚动条(~6px)+ 上下间距,
|
||||||
|
// 此前 32px 仅剩 4px 给滚动条,导致滚动条无法正常显示
|
||||||
|
Layout.preferredHeight: 40
|
||||||
visible: root.ready && root.networkInterfaces.length > 1
|
visible: root.ready && root.networkInterfaces.length > 1
|
||||||
contentWidth: Math.max(chipRow.width, width)
|
contentWidth: Math.max(chipRow.width, width)
|
||||||
contentHeight: chipRow.height
|
contentHeight: chipRow.height
|
||||||
@@ -604,8 +606,20 @@ AppletItem {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 自定义滚动条样式:默认 ScrollBar 在面板配色下可能不可见,
|
||||||
|
// 用 contentItem 显式绘制,颜色派生自 basePalette 适配深浅主题
|
||||||
ScrollBar.horizontal: ScrollBar {
|
ScrollBar.horizontal: ScrollBar {
|
||||||
|
id: chipScrollBar
|
||||||
policy: ScrollBar.AsNeeded
|
policy: ScrollBar.AsNeeded
|
||||||
|
interactive: true
|
||||||
|
|
||||||
|
contentItem: Rectangle {
|
||||||
|
implicitHeight: 4
|
||||||
|
radius: 2
|
||||||
|
// 按压时加深、悬停时中等、默认稍淡,保证滚动条在深浅主题下均可见
|
||||||
|
color: chipScrollBar.pressed ? root.secondaryText
|
||||||
|
: (chipScrollBar.hovered ? root.secondaryText : root.tertiaryText)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user