Skip to content

Commit

Permalink
Make some of the views show properly on tiny screens
Browse files Browse the repository at this point in the history
Closes #144
  • Loading branch information
MartinBriza committed Oct 1, 2023
1 parent c43a413 commit f29f9dd
Show file tree
Hide file tree
Showing 4 changed files with 111 additions and 78 deletions.
5 changes: 4 additions & 1 deletion modules/Lith/Style/Button.qml
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import Lith.Style
T.Button {
id: control

property real minimumWidth: text.length > 0 ? 100 : 0
property real minimumWidth: text.length > 0 ? 80 : 0
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding,
minimumWidth)
Expand Down Expand Up @@ -51,6 +51,9 @@ T.Button {
anchors.verticalCenter: parent.verticalCenter
width: parent.width - x
horizontalAlignment: Label.AlignHCenter
wrapMode: Label.WrapAtWordBoundaryOrAnywhere
elide: Label.ElideRight
maximumLineCount: 2

text: control.text
font: control.font
Expand Down
25 changes: 12 additions & 13 deletions modules/Lith/UI/SettingsFields/Header.qml
Original file line number Diff line number Diff line change
Expand Up @@ -8,21 +8,20 @@ Item {
property bool standalone: false
property alias text: label.text
property alias font: label.font
property alias labelItem: label

Layout.fillWidth: true
implicitWidth: row.implicitWidth
implicitHeight: row.implicitHeight
implicitWidth: label.implicitWidth
implicitHeight: label.implicitHeight

RowLayout {
id: row
width: parent.width
Label {
id: label
Layout.topMargin: font.pixelSize
Layout.bottomMargin: root.standalone ? font.pixelSize : 0.33 * font.pixelSize
Layout.alignment: Qt.AlignHCenter
font.bold: true
font.capitalization: Font.AllUppercase
}
Label {
id: label

x: (root.width - width) / 2

topPadding: font.pixelSize
bottomPadding: root.standalone ? font.pixelSize : 0.33 * font.pixelSize
font.bold: true
font.capitalization: Font.AllUppercase
}
}
17 changes: 14 additions & 3 deletions modules/Lith/UI/SettingsHotlistFormatEditor.qml
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ Dialog {
id: root
modal: true
anchors.centerIn: Overlay.overlay
width: 400
width: Math.min(400, parent.width)
implicitHeight: Math.min(header.height + mainItem.implicitHeight + footer.height, (mainView ? mainView.height : 1000))
closePolicy: autocomplete.visible ? Popup.CloseOnPressOutside : (Popup.CloseOnEscape | Popup.CloseOnPressOutside)
onVisibleChanged: {
Expand All @@ -30,11 +30,18 @@ Dialog {
}

header: Fields.Header {
id: headerField
width: parent.width
standalone: true
text: qsTr("Hotlist format editor")

labelItem.x: Math.max(((headerField.width - labelItem.width) / 2), (helpButton.x + helpButton.width))
labelItem.width: Math.min(labelItem.implicitWidth, headerField.width - helpButton.width)
labelItem.wrapMode: Label.WrapAtWordBoundaryOrAnywhere
labelItem.maximumLineCount: 2

Button {
id: helpButton
text: help.visible ? qsTr("Back") : qsTr("Help")
anchors.top: parent.top
anchors.left: parent.left
Expand Down Expand Up @@ -261,20 +268,24 @@ Dialog {
}

Fields.Base {
id: presetFieldBase
summary: qsTr("Use a preset")
details: qsTr("Recommended")
rowComponent: ColumnLayout {
id: presetLayout
Layout.preferredWidth: presetFieldBase.width / 2

Button {
text: qsTr("Default")
onClicked: formatSplitter.fromStringList(Lith.settings.hotlistDefaultFormat)
Layout.preferredWidth: 180
Layout.fillWidth: true
Layout.maximumWidth: presetFieldBase.width / 2
}
Button {
text: qsTr("Buffer Number")
onClicked: formatSplitter.fromStringList(["%1", "number"])
Layout.preferredWidth: 180
Layout.fillWidth: true
Layout.maximumWidth: presetFieldBase.width / 2
}
}
}
Expand Down
142 changes: 81 additions & 61 deletions modules/Lith/UI/SettingsNetwork.qml
Original file line number Diff line number Diff line change
Expand Up @@ -312,75 +312,95 @@ ScrollView {
color: index % 2 ? LithPalette.regular.alternateBase : LithPalette.regular.base
border.color: LithPalette.regular.light
border.width: 1
RowLayout {
GridLayout {
id: recordingLayout
y: 6
x: 6
width: parent.width - x * 2
height: parent.height - y * 2
spacing: 0
Label {
text: modelData.number
font.weight: 99
Layout.minimumWidth: font.pixelSize * 3
Layout.maximumWidth: Layout.minimumWidth
horizontalAlignment: Label.AlignHCenter
columnSpacing: 0
columns: {
const totalWidth = infoLayout.implicitWidth + actionsLayout.implicitWidth
if (totalWidth > recordingLayout.width)
return 1
else
return 2
}
Label {
visible: beingRecorded
text: qsTr("This slot is currently being overwritten.")
color: LithPalette.disabled.text
Layout.minimumWidth: font.pixelSize * 15
Layout.maximumWidth: Layout.minimumWidth
wrapMode: Label.WrapAtWordBoundaryOrAnywhere
}
Label {
visible: !beingRecorded
text: Qt.formatDateTime(modelData.createdAt)
Layout.minimumWidth: font.pixelSize * 9
Layout.maximumWidth: Layout.minimumWidth
horizontalAlignment: Label.AlignHCenter
}
Label {
visible: !beingRecorded
text: "%1 KiB".arg(Number(modelData.size / 1024.0).toLocaleString(Qt.locale(), "f", 0))
Layout.minimumWidth: font.pixelSize * 6
Layout.maximumWidth: Layout.minimumWidth
horizontalAlignment: Label.AlignHCenter
}
Label {
text: beingRecorded ? Lith.networkProxy.currentReplayVersion : modelData.version
Layout.minimumWidth: font.pixelSize * 3
Layout.maximumWidth: Layout.minimumWidth
horizontalAlignment: Label.AlignHCenter
}
Item {
Layout.fillWidth: true
}
Button {
id: saveToDocumentsButton
visible: !beingRecorded
font.pointSize: Lith.settings.baseFontSize * 0.875
horizontalPadding: 8
verticalPadding: 2
text: "Save to\nDocuments"
onClicked: {
var result = modelData.store()
recordingResultPopupLabel.text = result
RowLayout {
id: infoLayout
Label {
id: numberLabel
text: modelData.number
font.weight: 99
Layout.minimumWidth: font.pixelSize * 3
Layout.maximumWidth: Layout.minimumWidth
horizontalAlignment: Label.AlignHCenter
}
Label {
id: overWrittenLabel
visible: beingRecorded
text: qsTr("This slot is currently being overwritten.")
color: LithPalette.disabled.text
Layout.minimumWidth: font.pixelSize * 15
Layout.maximumWidth: Layout.minimumWidth
wrapMode: Label.WrapAtWordBoundaryOrAnywhere
}
Label {
id: createdAtLabel
visible: !beingRecorded
text: Qt.formatDateTime(modelData.createdAt)
Layout.minimumWidth: font.pixelSize * 9
Layout.maximumWidth: Layout.minimumWidth
horizontalAlignment: Label.AlignHCenter
}
Label {
id: sizeLabel
visible: !beingRecorded
text: "%1 KiB".arg(Number(modelData.size / 1024.0).toLocaleString(Qt.locale(), "f", 0))
Layout.minimumWidth: font.pixelSize * 6
Layout.maximumWidth: Layout.minimumWidth
horizontalAlignment: Label.AlignHCenter
}
Label {
id: versionLabel
opacity: (x + width + infoLayout.spacing) < infoLayout.width ? 1.0 : 0
text: beingRecorded ? Lith.networkProxy.currentReplayVersion : modelData.version
Layout.minimumWidth: font.pixelSize * 3
Layout.maximumWidth: Layout.minimumWidth
horizontalAlignment: Label.AlignHCenter
}
Item {
Layout.fillWidth: true
}
}
Button {
id: deleteRecordingButton
visible: !beingRecorded
Layout.leftMargin: 4
Layout.preferredHeight: Math.max(deleteRecordingButton.implicitHeight, saveToDocumentsButton.implicitHeight)
font.pointSize: Lith.settings.baseFontSize * 0.875
horizontalPadding: 8
verticalPadding: 2
text: "Delete"
onClicked: {
var result = modelData.erase()
recordingResultPopupLabel.text = result
RowLayout {
id: actionsLayout
Layout.alignment: Qt.AlignHCenter
Button {
id: saveToDocumentsButton
visible: !beingRecorded
font.pointSize: Lith.settings.baseFontSize * 0.875
horizontalPadding: 8
verticalPadding: 2
text: "Save to\nDocuments"
onClicked: {
var result = modelData.store()
recordingResultPopupLabel.text = result
}
}
Button {
id: deleteRecordingButton
visible: !beingRecorded
Layout.leftMargin: 4
Layout.preferredHeight: Math.max(deleteRecordingButton.implicitHeight, saveToDocumentsButton.implicitHeight)
font.pointSize: Lith.settings.baseFontSize * 0.875
horizontalPadding: 8
verticalPadding: 2
text: "Delete"
onClicked: {
var result = modelData.erase()
recordingResultPopupLabel.text = result
}
}
}
}
Expand Down

0 comments on commit f29f9dd

Please sign in to comment.