Fix Settings Buttons alignements and width

When we use languages with long text translation, the width is > width
screen and the alignment is bad with multiple line.
This commit is contained in:
Florian RICHER 2025-09-09 12:52:55 +00:00
parent 50d4a77471
commit 9cd44c8db8
No known key found for this signature in database
GPG key ID: C73D37CBED7BFC77
3 changed files with 53 additions and 66 deletions

View file

@ -65,6 +65,7 @@ ecm_target_qml_sources(org.kde.plasma.mobile.homescreen.folio SOURCES
ecm_target_qml_sources(org.kde.plasma.mobile.homescreen.folio SOURCES ecm_target_qml_sources(org.kde.plasma.mobile.homescreen.folio SOURCES
qml/settings/AppletListViewer.qml qml/settings/AppletListViewer.qml
qml/settings/SettingsButton.qml
qml/settings/SettingsComponent.qml qml/settings/SettingsComponent.qml
qml/settings/SettingsWindow.qml qml/settings/SettingsWindow.qml
PATH settings PATH settings

View file

@ -0,0 +1,42 @@
// SPDX-FileCopyrightText: 2025 Florian Richer <florian.richer@protonmail.com>
// SPDX-License-Identifier: LGPL-2.0-or-later
import QtQuick
import QtQuick.Layouts
import QtQuick.Controls as QQC2
import org.kde.plasma.components as PC3
import org.kde.kirigami as Kirigami
PC3.ToolButton {
id: root
opacity: 0.9
implicitHeight: Kirigami.Units.gridUnit * 4
implicitWidth: Kirigami.Units.gridUnit * 5
property string iconName
property string textLabel
contentItem: ColumnLayout {
spacing: Kirigami.Units.largeSpacing
uniformCellSizes: true
Kirigami.Icon {
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
implicitWidth: Kirigami.Units.iconSizes.smallMedium
implicitHeight: Kirigami.Units.iconSizes.smallMedium
Layout.fillHeight: true
source: iconName
}
QQC2.Label {
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignTop
text: textLabel
font.bold: true
Layout.fillWidth: true
Layout.fillHeight: true
wrapMode: Text.WordWrap
}
}
}

View file

@ -59,59 +59,22 @@ Item {
GridLayout { GridLayout {
id: settingsOptions id: settingsOptions
flow: folio.HomeScreenState.favouritesBarLocation === Folio.HomeScreenState.Bottom ? GridLayout.LeftToRight : GridLayout.TopToBottom flow: folio.HomeScreenState.favouritesBarLocation === Folio.HomeScreenState.Bottom ? GridLayout.LeftToRight : GridLayout.TopToBottom
uniformCellWidths: true
anchors.centerIn: parent anchors.centerIn: parent
PC3.ToolButton { SettingsButton {
opacity: 0.9 iconName: 'edit-image'
implicitHeight: Kirigami.Units.gridUnit * 4 textLabel: i18n("Wallpapers")
implicitWidth: Kirigami.Units.gridUnit * 5
contentItem: ColumnLayout {
spacing: Kirigami.Units.largeSpacing
Kirigami.Icon {
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
implicitWidth: Kirigami.Units.iconSizes.smallMedium
implicitHeight: Kirigami.Units.iconSizes.smallMedium
source: 'edit-image'
}
QQC2.Label {
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
text: i18n("Wallpapers")
font.bold: true
}
}
onClicked: { onClicked: {
homeScreen.wallpaperSelectorTriggered(); homeScreen.wallpaperSelectorTriggered();
folio.HomeScreenState.closeSettingsView(); folio.HomeScreenState.closeSettingsView();
} }
} }
PC3.ToolButton { SettingsButton {
opacity: 0.9 iconName: 'settings-configure'
implicitHeight: Kirigami.Units.gridUnit * 4 textLabel: i18n("Settings")
implicitWidth: Kirigami.Units.gridUnit * 5
contentItem: ColumnLayout {
spacing: Kirigami.Units.largeSpacing
Kirigami.Icon {
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
implicitWidth: Kirigami.Units.iconSizes.smallMedium
implicitHeight: Kirigami.Units.iconSizes.smallMedium
source: 'settings-configure'
}
QQC2.Label {
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
text: i18n("Settings")
font.bold: true
}
}
onClicked: { onClicked: {
// ensure that if the window is already opened, it gets raised to the top // ensure that if the window is already opened, it gets raised to the top
settingsWindow.hide(); settingsWindow.hide();
@ -119,28 +82,9 @@ Item {
} }
} }
PC3.ToolButton { SettingsButton {
opacity: 0.9 iconName: 'widget-alternatives'
implicitHeight: Kirigami.Units.gridUnit * 4 textLabel: i18n("Widgets")
implicitWidth: Kirigami.Units.gridUnit * 5
contentItem: ColumnLayout {
spacing: Kirigami.Units.largeSpacing
Kirigami.Icon {
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
implicitWidth: Kirigami.Units.iconSizes.smallMedium
implicitHeight: Kirigami.Units.iconSizes.smallMedium
source: 'widget-alternatives'
}
QQC2.Label {
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
text: i18n("Widgets")
font.bold: true
}
}
onClicked: { onClicked: {
appletListViewerLoader.active = true; appletListViewerLoader.active = true;
} }