Skip to content

fix(ui): optimize TipsSlider layout margins to prevent text clipping #3150

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.

Sign up for GitHub

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

Open
add-uos wants to merge 1 commit into
base: master
Choose a base branch
from
Open

fix(ui): optimize TipsSlider layout margins to prevent text clipping #3150

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions src/plugin-keyboard/qml/Common.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,8 +55,8 @@ DccObject {

property real leftTextWidth: 10
property real rightTextWidth: 10
property real dynamicLeftMargin: Math.max(10, leftTextWidth / 2)
property real dynamicRightMargin: Math.max(10, rightTextWidth / 2)
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 90
Layout.alignment: Qt.AlignCenter
Expand Down Expand Up @@ -167,8 +167,8 @@ DccObject {
// 动态计算左右边距
property real leftTextWidth: 0
property real rightTextWidth: 0
property real dynamicLeftMargin: Math.max(10, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(10, rightTextWidth / 2 + 5)
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 90
Layout.alignment: Qt.AlignCenter
Expand Down
62 changes: 54 additions & 8 deletions src/plugin-mouse/qml/Common.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,13 +42,36 @@ DccObject {
D.TipsSlider {
id: scrollSlider
readonly property var tips: [("1"), ("2"), ("3"), ("4"), ("5"), ("6"), ("7"), ("8"), ("9"), ("10")]

property real leftTextWidth: 0
property real rightTextWidth: 0
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 90
Layout.alignment: Qt.AlignCenter
Layout.leftMargin: 10
Layout.rightMargin: 10
Layout.topMargin: 2
Layout.leftMargin: dynamicLeftMargin
Layout.rightMargin: dynamicRightMargin
Layout.topMargin: 10
Layout.bottomMargin: 10
Layout.fillWidth: true
slider.height: 30

TextMetrics {
id: scrollLeftTextMetrics
font: scrollSlider.slider.font
text: scrollSlider.tips[0]
Component.onCompleted: {
scrollSlider.leftTextWidth = width
}
}
TextMetrics {
id: scrollRightTextMetrics
font: scrollSlider.slider.font
text: scrollSlider.tips[scrollSlider.tips.length - 1]
Component.onCompleted: {
scrollSlider.rightTextWidth = width
}
}
tickDirection: D.TipsSlider.TickDirection.Back
slider.handleType: Slider.HandleType.ArrowBottom
slider.value: dccData.scrollSpeed
Expand Down Expand Up @@ -131,13 +154,36 @@ DccObject {
D.TipsSlider {
id: doubleClickSlider
readonly property var tips: [qsTr("Slow"), (""), (""), (""), (""), (""), qsTr("Fast")]

property real leftTextWidth: 0
property real rightTextWidth: 0
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 90
Layout.alignment: Qt.AlignCenter
Layout.leftMargin: 10
Layout.rightMargin: 10
Layout.topMargin: 2
Layout.leftMargin: dynamicLeftMargin
Layout.rightMargin: dynamicRightMargin
Layout.topMargin: 10
Layout.bottomMargin: 10
Layout.fillWidth: true
slider.height: 30

TextMetrics {
id: doubleClickLeftTextMetrics
font: doubleClickSlider.slider.font
text: doubleClickSlider.tips[0]
Component.onCompleted: {
doubleClickSlider.leftTextWidth = width
}
}
TextMetrics {
id: doubleClickRightTextMetrics
font: doubleClickSlider.slider.font
text: doubleClickSlider.tips[doubleClickSlider.tips.length - 1]
Component.onCompleted: {
doubleClickSlider.rightTextWidth = width
}
}
tickDirection: D.TipsSlider.TickDirection.Back
slider.handleType: Slider.HandleType.ArrowBottom
slider.value: dccData.doubleSpeed
Expand Down
29 changes: 28 additions & 1 deletion src/plugin-mouse/qml/MousePage.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,10 +33,36 @@ DccObject {
D.TipsSlider {
id: scrollSlider
readonly property var tips: [qsTr("Slow"), (""), (""), (""), (""), (""), qsTr("Fast")]

property real leftTextWidth: 0
property real rightTextWidth: 0
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 100
Layout.alignment: Qt.AlignCenter
Layout.margins: 10
Layout.leftMargin: dynamicLeftMargin
Layout.rightMargin: dynamicRightMargin
Layout.topMargin: 10
Layout.bottomMargin: 10
Layout.fillWidth: true

TextMetrics {
id: scrollLeftTextMetrics
font: scrollSlider.slider.font
text: scrollSlider.tips[0]
Component.onCompleted: {
scrollSlider.leftTextWidth = width
}
}
TextMetrics {
id: scrollRightTextMetrics
font: scrollSlider.slider.font
text: scrollSlider.tips[scrollSlider.tips.length - 1]
Component.onCompleted: {
scrollSlider.rightTextWidth = width
}
}
tickDirection: D.TipsSlider.TickDirection.Back
slider.handleType: Slider.HandleType.ArrowBottom
slider.value: dccData.mouseMoveSpeed
Expand Down Expand Up @@ -262,3 +288,4 @@ DccObject {
}
}
}

29 changes: 27 additions & 2 deletions src/plugin-mouse/qml/Touchpad.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
// SPDX-FileCopyrightText: 2024 - 2027 UnionTech Software Technology Co., Ltd.
// SPDX-FileCopyrightText: 2024 - 2026 UnionTech Software Technology Co., Ltd.
// SPDX-License-Identifier: GPL-3.0-or-later
import QtQuick 2.0
import QtQuick.Controls 2.0
Expand Down Expand Up @@ -94,10 +94,35 @@ DccObject {

readonly property var tips: [qsTr("Slow"), (""), (""), (""), (""), (""), qsTr("Fast")]

property real leftTextWidth: 0
property real rightTextWidth: 0
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 90
Layout.alignment: Qt.AlignCenter
Layout.margins: 10
Layout.leftMargin: dynamicLeftMargin
Layout.rightMargin: dynamicRightMargin
Layout.topMargin: 10
Layout.bottomMargin: 10
Layout.fillWidth: true

TextMetrics {
id: scrollLeftTextMetrics
font: scrollSlider.slider.font
text: scrollSlider.tips[0]
Component.onCompleted: {
scrollSlider.leftTextWidth = width
}
}
TextMetrics {
id: scrollRightTextMetrics
font: scrollSlider.slider.font
text: scrollSlider.tips[scrollSlider.tips.length - 1]
Component.onCompleted: {
scrollSlider.rightTextWidth = width
}
}
tickDirection: D.TipsSlider.TickDirection.Back
slider.handleType: Slider.HandleType.ArrowBottom
slider.value: dccData.tpadMoveSpeed
Expand Down
30 changes: 28 additions & 2 deletions src/plugin-personalization/qml/FontSizePage.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
// SPDX-FileCopyrightText: 2024 - 2027 UnionTech Software Technology Co., Ltd.
// SPDX-FileCopyrightText: 2024 - 2026 UnionTech Software Technology Co., Ltd.
// SPDX-License-Identifier: GPL-3.0-or-later
import QtQuick 2.15
import QtQuick.Window 2.15
Expand Down Expand Up @@ -28,10 +28,36 @@ DccObject {
D.TipsSlider {
id: fontSizeSlider
readonly property var fontSizeModel: [11, 12, 13, 14, 15, 16, 18, 20]

property real leftTextWidth: 0
property real rightTextWidth: 0
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 90
Layout.alignment: Qt.AlignCenter
Layout.margins: 10
Layout.leftMargin: dynamicLeftMargin
Layout.rightMargin: dynamicRightMargin
Layout.topMargin: 10
Layout.bottomMargin: 10
Layout.fillWidth: true

TextMetrics {
id: fontSizeLeftTextMetrics
font: fontSizeSlider.slider.font
text: String(fontSizeSlider.fontSizeModel[0])
Component.onCompleted: {
fontSizeSlider.leftTextWidth = width
}
}
TextMetrics {
id: fontSizeRightTextMetrics
font: fontSizeSlider.slider.font
text: String(fontSizeSlider.fontSizeModel[fontSizeSlider.fontSizeModel.length - 1])
Component.onCompleted: {
fontSizeSlider.rightTextWidth = width
}
}
tickDirection: D.TipsSlider.TickDirection.Back
slider.handleType: Slider.HandleType.ArrowBottom
slider.from: 0
Expand Down
84 changes: 78 additions & 6 deletions src/plugin-power/qml/BatteryPage.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,10 +54,34 @@ DccObject {
CustomTipsSlider {
id: offMonitorSlider
dataMap: dccData.model.batteryScreenBlackDelayModel
Layout.preferredHeight: 80

property real leftTextWidth: 0
property real rightTextWidth: 0
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 90
Layout.alignment: Qt.AlignCenter
Layout.margins: 10
Layout.leftMargin: dynamicLeftMargin
Layout.rightMargin: dynamicRightMargin
Layout.topMargin: 10
Layout.bottomMargin: 10
Layout.fillWidth: true

TextMetrics {
font: offMonitorSlider.slider.font
text: offMonitorSlider.dataMap[0].text
Component.onCompleted: {
offMonitorSlider.leftTextWidth = width
}
}
TextMetrics {
font: offMonitorSlider.slider.font
text: offMonitorSlider.dataMap[offMonitorSlider.dataMap.length - 1].text
Component.onCompleted: {
offMonitorSlider.rightTextWidth = width
}
}
slider.value: dccData.indexByValueOnMap(dataMap, dccData.model.screenBlackDelayOnBattery)
slider.onValueChanged: {
dccData.worker.setScreenBlackDelayOnBattery(dataMap[slider.value].value)
Expand Down Expand Up @@ -104,10 +128,34 @@ DccObject {
CustomTipsSlider {
id: lockScreenSlider
dataMap: dccData.model.batteryLockDelayModel
Layout.preferredHeight: 80

property real leftTextWidth: 0
property real rightTextWidth: 0
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 90
Layout.alignment: Qt.AlignCenter
Layout.margins: 10
Layout.leftMargin: dynamicLeftMargin
Layout.rightMargin: dynamicRightMargin
Layout.topMargin: 10
Layout.bottomMargin: 10
Layout.fillWidth: true

TextMetrics {
font: lockScreenSlider.slider.font
text: lockScreenSlider.dataMap[0].text
Component.onCompleted: {
lockScreenSlider.leftTextWidth = width
}
}
TextMetrics {
font: lockScreenSlider.slider.font
text: lockScreenSlider.dataMap[lockScreenSlider.dataMap.length - 1].text
Component.onCompleted: {
lockScreenSlider.rightTextWidth = width
}
}
slider.value: dccData.indexByValueOnMap(dataMap, dccData.model.batteryLockScreenDelay)
slider.onValueChanged: {
dccData.worker.setLockScreenDelayOnBattery(dataMap[slider.value].value)
Expand Down Expand Up @@ -154,10 +202,34 @@ DccObject {
CustomTipsSlider {
id: suspendsSlider
dataMap: dccData.model.batterySleepDelayModel
Layout.preferredHeight: 80

property real leftTextWidth: 0
property real rightTextWidth: 0
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 90
Layout.alignment: Qt.AlignCenter
Layout.margins: 10
Layout.leftMargin: dynamicLeftMargin
Layout.rightMargin: dynamicRightMargin
Layout.topMargin: 10
Layout.bottomMargin: 10
Layout.fillWidth: true

TextMetrics {
font: suspendsSlider.slider.font
text: suspendsSlider.dataMap[0].text
Component.onCompleted: {
suspendsSlider.leftTextWidth = width
}
}
TextMetrics {
font: suspendsSlider.slider.font
text: suspendsSlider.dataMap[suspendsSlider.dataMap.length - 1].text
Component.onCompleted: {
suspendsSlider.rightTextWidth = width
}
}
slider.value: dccData.indexByValueOnMap(dataMap, dccData.model.sleepDelayOnBattery)
slider.onValueChanged: {
dccData.worker.setSleepDelayOnBattery(dataMap[slider.value].value)
Expand Down
2 changes: 1 addition & 1 deletion src/plugin-power/qml/CustomTipsSlider.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
// SPDX-FileCopyrightText: 2024 - 2027 UnionTech Software Technology Co., Ltd.
// SPDX-FileCopyrightText: 2024 - 2026 UnionTech Software Technology Co., Ltd.
// SPDX-License-Identifier: GPL-3.0-or-later

import QtQuick 2.15
Expand Down
31 changes: 29 additions & 2 deletions src/plugin-power/qml/GeneralPage.qml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -113,10 +113,37 @@ DccObject {
D.TipsSlider {
id: scrollSlider
readonly property var tips: [("10%"), ("20%"), ("30%"), ("40%")]
Layout.preferredHeight: 80

property real leftTextWidth: 0
property real rightTextWidth: 0
property real dynamicLeftMargin: Math.max(16, leftTextWidth / 2 + 5)
property real dynamicRightMargin: Math.max(16, rightTextWidth / 2 + 5)

Layout.preferredHeight: 90
Layout.alignment: Qt.AlignCenter
Layout.margins: 10
Layout.leftMargin: dynamicLeftMargin
Layout.rightMargin: dynamicRightMargin
Layout.topMargin: 10
Layout.bottomMargin: 10
Layout.fillWidth: true

TextMetrics {
id: scrollLeftTextMetrics
font: scrollSlider.slider.font
text: scrollSlider.tips[0]
Component.onCompleted: {
scrollSlider.leftTextWidth = width
}
}
TextMetrics {
id: scrollRightTextMetrics
font: scrollSlider.slider.font
text: scrollSlider.tips[scrollSlider.tips.length - 1]
Component.onCompleted: {
scrollSlider.rightTextWidth = width
}
}

slider.handleType: Slider.HandleType.ArrowBottom
slider.from: 10
slider.to: ticks.length * 10
Expand Down
Loading
Loading