Commit fbb72697 authored by David Redondo's avatar David Redondo 🏎
Browse files

Center the Comparison sheet and move slider into the header

Centers the Comparison sheet in the available space in the window. If not all
icons fit into one row, the maximum amount of icons possible is shown in a row
and the sheet centered in the window regardless.
The slider is a perfect fit for the header.
parent 496df987
......@@ -6,13 +6,6 @@ import org.kde.kirigami 2.8 as Kirigami
Kirigami.OverlaySheet {
property int comparisonSize
background: Rectangle {
id:background
Kirigami.Theme.colorSet: Kirigami.Theme.View
color: Kirigami.Theme.backgroundColor
anchors.fill: parent
}
onSheetOpenChanged: {
if (sheetOpen) {
comparisonSize = iconSize;
......@@ -20,64 +13,70 @@ Kirigami.OverlaySheet {
}
}
ColumnLayout {
RowLayout {
Layout.alignment: Qt.AlignHCenter
QQC2.Slider {
Layout.preferredWidth: comparisonGrid.width * 0.75
id: comparisonSlider
to: 6.0
stepSize: 1.0
snapMode: QQC2.Slider.SnapAlways
onValueChanged: {
comparisonTimer.restart()
}
Timer {
id: comparisonTimer
running: false
repeat: false
interval: 200
onTriggered: comparisonSize = indexToSize(comparisonSlider.value)
}
header: RowLayout {
Item {
Layout.fillWidth:true
}
QQC2.Slider {
Layout.preferredWidth: comparisonGrid.width * 0.75
id: comparisonSlider
to: 6.0
stepSize: 1.0
snapMode: QQC2.Slider.SnapAlways
onValueChanged: {
comparisonTimer.restart()
}
QQC2.Label {
text: indexToSize(comparisonSlider.value)
Timer {
id: comparisonTimer
running: false
repeat: false
interval: 200
onTriggered: comparisonSize = indexToSize(comparisonSlider.value)
}
}
GridView {
Layout.fillWidth: true
Layout.preferredHeight: contentHeight
id: comparisonGrid
cellWidth: 128
cellHeight: 128 + 2 * Kirigami.Units.gridUnit + Kirigami.Units.largeSpacing
model: sheetOpen ? iconModel.inOtherThemes(preview.iconName, comparisonSize) : []
delegate: ColumnLayout {
id: iconColumn
width: comparisonGrid.cellWidth
height: comparisonGrid.cellHeight
spacing: Kirigami.Units.largeSpacing
Item {
id: wrapper
Layout.preferredWidth: 128
Layout.preferredHeight: 128
Kirigami.Icon {
property bool hasIcon : modelData.iconPath
anchors.centerIn: parent
width: comparisonSize
height: width
source: hasIcon ? modelData.iconPath : "paint-none"
color: hasIcon ? "" : Kirigami.Theme.disabledTextColor
isMask: !hasIcon
}
}
QQC2.Label {
id: themeName
text: modelData.themeName
horizontalAlignment: Text.AlignHCenter
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
QQC2.Label {
Layout.alignment: Qt.AlignHCenter
text: indexToSize(comparisonSlider.value)
}
Item {
Layout.fillWidth:true
}
}
contentItem: GridView {
id: comparisonGrid
cellWidth: 128
cellHeight: 128 + 2 * Kirigami.Units.gridUnit + Kirigami.Units.largeSpacing
implicitWidth: {
const availableWidth = cuttlefish.width - leftPadding - rightPadding;
return availableWidth < comparisonGrid.count * cellWidth ? availableWidth - availableWidth % cellWidth : comparisonGrid.count * cellWidth
}
model: sheetOpen ? iconModel.inOtherThemes(preview.iconName, comparisonSize) : []
delegate: ColumnLayout {
id: iconColumn
width: comparisonGrid.cellWidth
height: comparisonGrid.cellHeight
spacing: Kirigami.Units.largeSpacing
Item {
id: wrapper
Layout.preferredWidth: 128
Layout.preferredHeight: 128
Kirigami.Icon {
property bool hasIcon : modelData.iconPath
anchors.centerIn: parent
width: comparisonSize
height: width
source: hasIcon ? modelData.iconPath : "paint-none"
color: hasIcon ? "" : Kirigami.Theme.disabledTextColor
isMask: !hasIcon
}
}
QQC2.Label {
id: themeName
text: modelData.themeName
horizontalAlignment: Text.AlignHCenter
Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom
}
}
}
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment