Merge pull request #946 from maltee1/mobile_usersettings

Make UserSettingsPage fit on a phone screen
This commit is contained in:
DeepBlueV7.X 2022-02-21 00:25:06 +00:00 committed by GitHub
commit 8727b696fc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 20 additions and 29 deletions

View File

@ -25,45 +25,30 @@ Rectangle {
palette: Nheko.colors
ScrollBar.horizontal.visible: false
anchors.fill: parent
anchors.margins: Nheko.paddingLarge
anchors.topMargin: (collapsed? backButton.height : 0)+Nheko.paddingLarge
leftPadding: collapsed? Nheko.paddingMedium : Nheko.paddingLarge
bottomPadding: Nheko.paddingLarge
contentWidth: availableWidth
Timer {
id: deadTimer
interval: 500
}
Connections {
target: scroll.contentItem
function onContentYChanged() { deadTimer.restart(); }
}
GridLayout {
ColumnLayout {
id: grid
columns: userSettingsDialog.collapsed ? 1 : 2
rowSpacing: Nheko.paddingMedium
columnSpacing: Nheko.paddingMedium
spacing: Nheko.paddingMedium
anchors.fill: parent
anchors.leftMargin: userSettingsDialog.collapsed ? Nheko.paddingLarge : (userSettingsDialog.width-userSettingsDialog.collapsePoint) * 0.4
anchors.leftMargin: userSettingsDialog.collapsed ? 0 : (userSettingsDialog.width-userSettingsDialog.collapsePoint) * 0.4 + Nheko.paddingLarge
anchors.rightMargin: anchors.leftMargin
Repeater {
model: UserSettingsModel
Layout.fillWidth:true
delegate: Item {
delegate: GridLayout {
columns: collapsed? 1 : 2
rows: collapsed? 2: 1
required property var model
id: r
Component.onCompleted: {
while (children.length) {
children[0].parent = grid;
}
}
Label {
Layout.alignment: Qt.AlignLeft
Layout.fillWidth: true
@ -72,7 +57,7 @@ Rectangle {
//Layout.column: 0
Layout.columnSpan: (model.type == UserSettingsModel.SectionTitle && !userSettingsDialog.collapsed) ? 2 : 1
//Layout.row: model.index
Layout.minimumWidth: implicitWidth
//Layout.minimumWidth: implicitWidth
Layout.leftMargin: model.type == UserSettingsModel.SectionTitle ? 0 : Nheko.paddingMedium
Layout.topMargin: model.type == UserSettingsModel.SectionTitle ? Nheko.paddingLarge : 0
font.pointSize: 1.1 * fontMetrics.font.pointSize
@ -84,6 +69,7 @@ Rectangle {
ToolTip.visible: hovered.hovered && model.description
ToolTip.text: model.description ?? ""
ToolTip.delay: Nheko.tooltipDelay
wrapMode: Text.Wrap
}
DelegateChooser {
@ -95,6 +81,7 @@ Rectangle {
Layout.columnSpan: (model.type == UserSettingsModel.SectionTitle && !userSettingsDialog.collapsed) ? 2 : 1
Layout.preferredHeight: child.height
Layout.preferredWidth: Math.min(child.implicitWidth, child.width || 1000)
Layout.maximumWidth: model.type == UserSettingsModel.SectionTitle ? Number.POSITIVE_INFINITY : 400
Layout.fillWidth: model.type == UserSettingsModel.SectionTitle || model.type == UserSettingsModel.Options || model.type == UserSettingsModel.Number
Layout.rightMargin: model.type == UserSettingsModel.SectionTitle ? 0 : Nheko.paddingMedium
@ -113,8 +100,9 @@ Rectangle {
width: Math.min(parent.width, implicitWidth)
model: r.model.values
currentIndex: r.model.value
enabled: !deadTimer.running
onCurrentIndexChanged: r.model.value = currentIndex
WheelHandler{} // suppress scrolling changing values
}
}
DelegateChoice {
@ -123,13 +111,14 @@ Rectangle {
SpinBox {
anchors.right: parent.right
width: Math.min(parent.width, implicitWidth)
enabled: !deadTimer.running && model.enabled
from: model.valueLowerBound
to: model.valueUpperBound
stepSize: model.valueStep
value: model.value
onValueChanged: model.value = value
editable: true
WheelHandler{} // suppress scrolling changing values
}
}
DelegateChoice {
@ -143,7 +132,6 @@ Rectangle {
anchors.right: parent.right
width: Math.min(parent.width, implicitWidth)
enabled: !deadTimer.running && model.enabled
from: model.valueLowerBound * div
to: model.valueUpperBound * div
stepSize: model.valueStep * div
@ -165,6 +153,8 @@ Rectangle {
valueFromText: function(text, locale) {
return Number.fromLocaleString(locale, text) * spinbox.div
}
WheelHandler{} // suppress scrolling changing values
}
}
DelegateChoice {
@ -237,6 +227,7 @@ Rectangle {
}
ImageButton {
id: backButton
anchors.top: parent.top
anchors.left: parent.left
anchors.margins: Nheko.paddingMedium