controlcenter: animation bug fix on flickables
This commit is contained in:
ATMDA
parent
28be7e8d33
commit
90bda07a90
2 changed files with 318 additions and 331 deletions
|
|
@ -104,6 +104,13 @@ ColumnLayout {
|
||||||
anchors.topMargin: Appearance.spacing.small
|
anchors.topMargin: Appearance.spacing.small
|
||||||
anchors.bottomMargin: Appearance.spacing.small
|
anchors.bottomMargin: Appearance.spacing.small
|
||||||
spacing: Appearance.spacing.small
|
spacing: Appearance.spacing.small
|
||||||
|
opacity: root.expanded ? 1.0 : 0.0
|
||||||
|
|
||||||
|
Behavior on opacity {
|
||||||
|
Anim {
|
||||||
|
easing.bezierCurve: Appearance.anim.curves.standard
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -200,84 +200,80 @@ RowLayout {
|
||||||
sidebarFlickable.collapseAllSections(colorVariantSection);
|
sidebarFlickable.collapseAllSections(colorVariantSection);
|
||||||
}
|
}
|
||||||
|
|
||||||
StyledListView {
|
ColumnLayout {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
implicitHeight: colorVariantSection.expanded ? Math.min(400, M3Variants.list.length * 60) : 0
|
|
||||||
|
|
||||||
model: M3Variants.list
|
|
||||||
spacing: Appearance.spacing.small / 2
|
spacing: Appearance.spacing.small / 2
|
||||||
clip: true
|
|
||||||
|
|
||||||
StyledScrollBar.vertical: StyledScrollBar {
|
Repeater {
|
||||||
flickable: parent
|
model: M3Variants.list
|
||||||
}
|
|
||||||
|
|
||||||
delegate: StyledRect {
|
delegate: StyledRect {
|
||||||
required property var modelData
|
required property var modelData
|
||||||
|
|
||||||
width: parent ? parent.width : 0
|
Layout.fillWidth: true
|
||||||
|
|
||||||
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, modelData.variant === Schemes.currentVariant ? Colours.tPalette.m3surfaceContainer.a : 0)
|
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, modelData.variant === Schemes.currentVariant ? Colours.tPalette.m3surfaceContainer.a : 0)
|
||||||
radius: Appearance.rounding.normal
|
radius: Appearance.rounding.normal
|
||||||
border.width: modelData.variant === Schemes.currentVariant ? 1 : 0
|
border.width: modelData.variant === Schemes.currentVariant ? 1 : 0
|
||||||
border.color: Colours.palette.m3primary
|
border.color: Colours.palette.m3primary
|
||||||
|
|
||||||
StateLayer {
|
StateLayer {
|
||||||
function onClicked(): void {
|
function onClicked(): void {
|
||||||
const variant = modelData.variant;
|
const variant = modelData.variant;
|
||||||
|
|
||||||
// Optimistic update - set immediately
|
// Optimistic update - set immediately
|
||||||
Schemes.currentVariant = variant;
|
Schemes.currentVariant = variant;
|
||||||
|
|
||||||
// Execute the command
|
// Execute the command
|
||||||
Quickshell.execDetached(["caelestia", "scheme", "set", "-v", variant]);
|
Quickshell.execDetached(["caelestia", "scheme", "set", "-v", variant]);
|
||||||
|
|
||||||
// Reload after a delay to confirm
|
// Reload after a delay to confirm
|
||||||
Qt.callLater(() => {
|
Qt.callLater(() => {
|
||||||
reloadTimer.restart();
|
reloadTimer.restart();
|
||||||
});
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Timer {
|
||||||
|
id: reloadTimer
|
||||||
|
interval: 300
|
||||||
|
onTriggered: {
|
||||||
|
Schemes.reload();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
RowLayout {
|
||||||
|
id: variantRow
|
||||||
|
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.margins: Appearance.padding.normal
|
||||||
|
|
||||||
|
spacing: Appearance.spacing.normal
|
||||||
|
|
||||||
|
MaterialIcon {
|
||||||
|
text: modelData.icon
|
||||||
|
font.pointSize: Appearance.font.size.large
|
||||||
|
fill: modelData.variant === Schemes.currentVariant ? 1 : 0
|
||||||
|
}
|
||||||
|
|
||||||
|
StyledText {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
text: modelData.name
|
||||||
|
font.weight: modelData.variant === Schemes.currentVariant ? 500 : 400
|
||||||
|
}
|
||||||
|
|
||||||
|
MaterialIcon {
|
||||||
|
visible: modelData.variant === Schemes.currentVariant
|
||||||
|
text: "check"
|
||||||
|
color: Colours.palette.m3primary
|
||||||
|
font.pointSize: Appearance.font.size.large
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
implicitHeight: variantRow.implicitHeight + Appearance.padding.normal * 2
|
||||||
}
|
}
|
||||||
|
|
||||||
Timer {
|
|
||||||
id: reloadTimer
|
|
||||||
interval: 300
|
|
||||||
onTriggered: {
|
|
||||||
Schemes.reload();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
RowLayout {
|
|
||||||
id: variantRow
|
|
||||||
|
|
||||||
anchors.left: parent.left
|
|
||||||
anchors.right: parent.right
|
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
|
||||||
anchors.margins: Appearance.padding.normal
|
|
||||||
|
|
||||||
spacing: Appearance.spacing.normal
|
|
||||||
|
|
||||||
MaterialIcon {
|
|
||||||
text: modelData.icon
|
|
||||||
font.pointSize: Appearance.font.size.large
|
|
||||||
fill: modelData.variant === Schemes.currentVariant ? 1 : 0
|
|
||||||
}
|
|
||||||
|
|
||||||
StyledText {
|
|
||||||
Layout.fillWidth: true
|
|
||||||
text: modelData.name
|
|
||||||
font.weight: modelData.variant === Schemes.currentVariant ? 500 : 400
|
|
||||||
}
|
|
||||||
|
|
||||||
MaterialIcon {
|
|
||||||
visible: modelData.variant === Schemes.currentVariant
|
|
||||||
text: "check"
|
|
||||||
color: Colours.palette.m3primary
|
|
||||||
font.pointSize: Appearance.font.size.large
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
implicitHeight: variantRow.implicitHeight + Appearance.padding.normal * 2
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -290,139 +286,135 @@ RowLayout {
|
||||||
sidebarFlickable.collapseAllSections(colorSchemeSection);
|
sidebarFlickable.collapseAllSections(colorSchemeSection);
|
||||||
}
|
}
|
||||||
|
|
||||||
StyledListView {
|
ColumnLayout {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
implicitHeight: colorSchemeSection.expanded ? Math.min(400, Schemes.list.length * 80) : 0
|
|
||||||
|
|
||||||
model: Schemes.list
|
|
||||||
spacing: Appearance.spacing.small / 2
|
spacing: Appearance.spacing.small / 2
|
||||||
clip: true
|
|
||||||
|
|
||||||
StyledScrollBar.vertical: StyledScrollBar {
|
Repeater {
|
||||||
flickable: parent
|
model: Schemes.list
|
||||||
}
|
|
||||||
|
|
||||||
delegate: StyledRect {
|
delegate: StyledRect {
|
||||||
required property var modelData
|
required property var modelData
|
||||||
|
|
||||||
width: parent ? parent.width : 0
|
Layout.fillWidth: true
|
||||||
|
|
||||||
readonly property string schemeKey: `${modelData.name} ${modelData.flavour}`
|
readonly property string schemeKey: `${modelData.name} ${modelData.flavour}`
|
||||||
readonly property bool isCurrent: schemeKey === Schemes.currentScheme
|
readonly property bool isCurrent: schemeKey === Schemes.currentScheme
|
||||||
|
|
||||||
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
|
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
|
||||||
radius: Appearance.rounding.normal
|
radius: Appearance.rounding.normal
|
||||||
border.width: isCurrent ? 1 : 0
|
border.width: isCurrent ? 1 : 0
|
||||||
border.color: Colours.palette.m3primary
|
border.color: Colours.palette.m3primary
|
||||||
|
|
||||||
StateLayer {
|
StateLayer {
|
||||||
function onClicked(): void {
|
function onClicked(): void {
|
||||||
const name = modelData.name;
|
const name = modelData.name;
|
||||||
const flavour = modelData.flavour;
|
const flavour = modelData.flavour;
|
||||||
const schemeKey = `${name} ${flavour}`;
|
const schemeKey = `${name} ${flavour}`;
|
||||||
|
|
||||||
// Optimistic update - set immediately
|
// Optimistic update - set immediately
|
||||||
Schemes.currentScheme = schemeKey;
|
Schemes.currentScheme = schemeKey;
|
||||||
|
|
||||||
// Execute the command
|
// Execute the command
|
||||||
Quickshell.execDetached(["caelestia", "scheme", "set", "-n", name, "-f", flavour]);
|
Quickshell.execDetached(["caelestia", "scheme", "set", "-n", name, "-f", flavour]);
|
||||||
|
|
||||||
// Reload after a delay to confirm
|
// Reload after a delay to confirm
|
||||||
Qt.callLater(() => {
|
Qt.callLater(() => {
|
||||||
reloadTimer.restart();
|
reloadTimer.restart();
|
||||||
});
|
});
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Timer {
|
|
||||||
id: reloadTimer
|
|
||||||
interval: 300
|
|
||||||
onTriggered: {
|
|
||||||
Schemes.reload();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
RowLayout {
|
|
||||||
id: schemeRow
|
|
||||||
|
|
||||||
anchors.fill: parent
|
|
||||||
anchors.margins: Appearance.padding.normal
|
|
||||||
|
|
||||||
spacing: Appearance.spacing.normal
|
|
||||||
|
|
||||||
StyledRect {
|
|
||||||
id: preview
|
|
||||||
|
|
||||||
Layout.alignment: Qt.AlignVCenter
|
|
||||||
|
|
||||||
border.width: 1
|
|
||||||
border.color: Qt.alpha(`#${modelData.colours?.outline}`, 0.5)
|
|
||||||
|
|
||||||
color: `#${modelData.colours?.surface}`
|
|
||||||
radius: Appearance.rounding.full
|
|
||||||
implicitWidth: iconPlaceholder.implicitWidth
|
|
||||||
implicitHeight: iconPlaceholder.implicitWidth
|
|
||||||
|
|
||||||
MaterialIcon {
|
|
||||||
id: iconPlaceholder
|
|
||||||
visible: false
|
|
||||||
text: "circle"
|
|
||||||
font.pointSize: Appearance.font.size.large
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
Item {
|
Timer {
|
||||||
anchors.top: parent.top
|
id: reloadTimer
|
||||||
anchors.bottom: parent.bottom
|
interval: 300
|
||||||
anchors.right: parent.right
|
onTriggered: {
|
||||||
|
Schemes.reload();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
implicitWidth: parent.implicitWidth / 2
|
RowLayout {
|
||||||
clip: true
|
id: schemeRow
|
||||||
|
|
||||||
StyledRect {
|
anchors.fill: parent
|
||||||
|
anchors.margins: Appearance.padding.normal
|
||||||
|
|
||||||
|
spacing: Appearance.spacing.normal
|
||||||
|
|
||||||
|
StyledRect {
|
||||||
|
id: preview
|
||||||
|
|
||||||
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
|
||||||
|
border.width: 1
|
||||||
|
border.color: Qt.alpha(`#${modelData.colours?.outline}`, 0.5)
|
||||||
|
|
||||||
|
color: `#${modelData.colours?.surface}`
|
||||||
|
radius: Appearance.rounding.full
|
||||||
|
implicitWidth: iconPlaceholder.implicitWidth
|
||||||
|
implicitHeight: iconPlaceholder.implicitWidth
|
||||||
|
|
||||||
|
MaterialIcon {
|
||||||
|
id: iconPlaceholder
|
||||||
|
visible: false
|
||||||
|
text: "circle"
|
||||||
|
font.pointSize: Appearance.font.size.large
|
||||||
|
}
|
||||||
|
|
||||||
|
Item {
|
||||||
anchors.top: parent.top
|
anchors.top: parent.top
|
||||||
anchors.bottom: parent.bottom
|
anchors.bottom: parent.bottom
|
||||||
anchors.right: parent.right
|
anchors.right: parent.right
|
||||||
|
|
||||||
implicitWidth: preview.implicitWidth
|
implicitWidth: parent.implicitWidth / 2
|
||||||
color: `#${modelData.colours?.primary}`
|
clip: true
|
||||||
radius: Appearance.rounding.full
|
|
||||||
|
StyledRect {
|
||||||
|
anchors.top: parent.top
|
||||||
|
anchors.bottom: parent.bottom
|
||||||
|
anchors.right: parent.right
|
||||||
|
|
||||||
|
implicitWidth: preview.implicitWidth
|
||||||
|
color: `#${modelData.colours?.primary}`
|
||||||
|
radius: Appearance.rounding.full
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Column {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
spacing: 0
|
||||||
|
|
||||||
|
StyledText {
|
||||||
|
text: modelData.flavour ?? ""
|
||||||
|
font.pointSize: Appearance.font.size.normal
|
||||||
|
}
|
||||||
|
|
||||||
|
StyledText {
|
||||||
|
text: modelData.name ?? ""
|
||||||
|
font.pointSize: Appearance.font.size.small
|
||||||
|
color: Colours.palette.m3outline
|
||||||
|
|
||||||
|
elide: Text.ElideRight
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Loader {
|
||||||
|
active: isCurrent
|
||||||
|
asynchronous: true
|
||||||
|
|
||||||
|
sourceComponent: MaterialIcon {
|
||||||
|
text: "check"
|
||||||
|
color: Colours.palette.m3onSurfaceVariant
|
||||||
|
font.pointSize: Appearance.font.size.large
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Column {
|
implicitHeight: schemeRow.implicitHeight + Appearance.padding.normal * 2
|
||||||
Layout.fillWidth: true
|
|
||||||
spacing: 0
|
|
||||||
|
|
||||||
StyledText {
|
|
||||||
text: modelData.flavour ?? ""
|
|
||||||
font.pointSize: Appearance.font.size.normal
|
|
||||||
}
|
|
||||||
|
|
||||||
StyledText {
|
|
||||||
text: modelData.name ?? ""
|
|
||||||
font.pointSize: Appearance.font.size.small
|
|
||||||
color: Colours.palette.m3outline
|
|
||||||
|
|
||||||
elide: Text.ElideRight
|
|
||||||
anchors.left: parent.left
|
|
||||||
anchors.right: parent.right
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Loader {
|
|
||||||
active: isCurrent
|
|
||||||
asynchronous: true
|
|
||||||
|
|
||||||
sourceComponent: MaterialIcon {
|
|
||||||
text: "check"
|
|
||||||
color: Colours.palette.m3onSurfaceVariant
|
|
||||||
font.pointSize: Appearance.font.size.large
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
implicitHeight: schemeRow.implicitHeight + Appearance.padding.normal * 2
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -548,68 +540,64 @@ RowLayout {
|
||||||
font.weight: 500
|
font.weight: 500
|
||||||
}
|
}
|
||||||
|
|
||||||
StyledListView {
|
ColumnLayout {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
implicitHeight: fontsSection.expanded ? Math.min(300, Qt.fontFamilies().length * 50) : 0
|
|
||||||
|
|
||||||
model: Qt.fontFamilies()
|
|
||||||
spacing: Appearance.spacing.small / 2
|
spacing: Appearance.spacing.small / 2
|
||||||
clip: true
|
|
||||||
|
|
||||||
StyledScrollBar.vertical: StyledScrollBar {
|
Repeater {
|
||||||
flickable: parent
|
model: Qt.fontFamilies()
|
||||||
}
|
|
||||||
|
|
||||||
delegate: StyledRect {
|
delegate: StyledRect {
|
||||||
required property string modelData
|
required property string modelData
|
||||||
|
|
||||||
width: parent ? parent.width : 0
|
Layout.fillWidth: true
|
||||||
|
|
||||||
readonly property bool isCurrent: modelData === rootPane.fontFamilyMaterial
|
readonly property bool isCurrent: modelData === rootPane.fontFamilyMaterial
|
||||||
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
|
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
|
||||||
radius: Appearance.rounding.normal
|
radius: Appearance.rounding.normal
|
||||||
border.width: isCurrent ? 1 : 0
|
border.width: isCurrent ? 1 : 0
|
||||||
border.color: Colours.palette.m3primary
|
border.color: Colours.palette.m3primary
|
||||||
|
|
||||||
StateLayer {
|
StateLayer {
|
||||||
function onClicked(): void {
|
function onClicked(): void {
|
||||||
rootPane.fontFamilyMaterial = modelData;
|
rootPane.fontFamilyMaterial = modelData;
|
||||||
rootPane.saveConfig();
|
rootPane.saveConfig();
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
RowLayout {
|
|
||||||
id: fontFamilyMaterialRow
|
|
||||||
|
|
||||||
anchors.left: parent.left
|
|
||||||
anchors.right: parent.right
|
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
|
||||||
anchors.margins: Appearance.padding.normal
|
|
||||||
|
|
||||||
spacing: Appearance.spacing.normal
|
|
||||||
|
|
||||||
StyledText {
|
|
||||||
text: modelData
|
|
||||||
font.pointSize: Appearance.font.size.normal
|
|
||||||
}
|
|
||||||
|
|
||||||
Item {
|
|
||||||
Layout.fillWidth: true
|
|
||||||
}
|
|
||||||
|
|
||||||
Loader {
|
|
||||||
active: isCurrent
|
|
||||||
asynchronous: true
|
|
||||||
|
|
||||||
sourceComponent: MaterialIcon {
|
|
||||||
text: "check"
|
|
||||||
color: Colours.palette.m3onSurfaceVariant
|
|
||||||
font.pointSize: Appearance.font.size.large
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
implicitHeight: fontFamilyMaterialRow.implicitHeight + Appearance.padding.normal * 2
|
RowLayout {
|
||||||
|
id: fontFamilyMaterialRow
|
||||||
|
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.margins: Appearance.padding.normal
|
||||||
|
|
||||||
|
spacing: Appearance.spacing.normal
|
||||||
|
|
||||||
|
StyledText {
|
||||||
|
text: modelData
|
||||||
|
font.pointSize: Appearance.font.size.normal
|
||||||
|
}
|
||||||
|
|
||||||
|
Item {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
}
|
||||||
|
|
||||||
|
Loader {
|
||||||
|
active: isCurrent
|
||||||
|
asynchronous: true
|
||||||
|
|
||||||
|
sourceComponent: MaterialIcon {
|
||||||
|
text: "check"
|
||||||
|
color: Colours.palette.m3onSurfaceVariant
|
||||||
|
font.pointSize: Appearance.font.size.large
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
implicitHeight: fontFamilyMaterialRow.implicitHeight + Appearance.padding.normal * 2
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -620,68 +608,64 @@ RowLayout {
|
||||||
font.weight: 500
|
font.weight: 500
|
||||||
}
|
}
|
||||||
|
|
||||||
StyledListView {
|
ColumnLayout {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
implicitHeight: fontsSection.expanded ? Math.min(300, Qt.fontFamilies().length * 50) : 0
|
|
||||||
|
|
||||||
model: Qt.fontFamilies()
|
|
||||||
spacing: Appearance.spacing.small / 2
|
spacing: Appearance.spacing.small / 2
|
||||||
clip: true
|
|
||||||
|
|
||||||
StyledScrollBar.vertical: StyledScrollBar {
|
Repeater {
|
||||||
flickable: parent
|
model: Qt.fontFamilies()
|
||||||
}
|
|
||||||
|
|
||||||
delegate: StyledRect {
|
delegate: StyledRect {
|
||||||
required property string modelData
|
required property string modelData
|
||||||
|
|
||||||
width: parent ? parent.width : 0
|
Layout.fillWidth: true
|
||||||
|
|
||||||
readonly property bool isCurrent: modelData === rootPane.fontFamilyMono
|
readonly property bool isCurrent: modelData === rootPane.fontFamilyMono
|
||||||
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
|
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
|
||||||
radius: Appearance.rounding.normal
|
radius: Appearance.rounding.normal
|
||||||
border.width: isCurrent ? 1 : 0
|
border.width: isCurrent ? 1 : 0
|
||||||
border.color: Colours.palette.m3primary
|
border.color: Colours.palette.m3primary
|
||||||
|
|
||||||
StateLayer {
|
StateLayer {
|
||||||
function onClicked(): void {
|
function onClicked(): void {
|
||||||
rootPane.fontFamilyMono = modelData;
|
rootPane.fontFamilyMono = modelData;
|
||||||
rootPane.saveConfig();
|
rootPane.saveConfig();
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
RowLayout {
|
|
||||||
id: fontFamilyMonoRow
|
|
||||||
|
|
||||||
anchors.left: parent.left
|
|
||||||
anchors.right: parent.right
|
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
|
||||||
anchors.margins: Appearance.padding.normal
|
|
||||||
|
|
||||||
spacing: Appearance.spacing.normal
|
|
||||||
|
|
||||||
StyledText {
|
|
||||||
text: modelData
|
|
||||||
font.pointSize: Appearance.font.size.normal
|
|
||||||
}
|
|
||||||
|
|
||||||
Item {
|
|
||||||
Layout.fillWidth: true
|
|
||||||
}
|
|
||||||
|
|
||||||
Loader {
|
|
||||||
active: isCurrent
|
|
||||||
asynchronous: true
|
|
||||||
|
|
||||||
sourceComponent: MaterialIcon {
|
|
||||||
text: "check"
|
|
||||||
color: Colours.palette.m3onSurfaceVariant
|
|
||||||
font.pointSize: Appearance.font.size.large
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
implicitHeight: fontFamilyMonoRow.implicitHeight + Appearance.padding.normal * 2
|
RowLayout {
|
||||||
|
id: fontFamilyMonoRow
|
||||||
|
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.margins: Appearance.padding.normal
|
||||||
|
|
||||||
|
spacing: Appearance.spacing.normal
|
||||||
|
|
||||||
|
StyledText {
|
||||||
|
text: modelData
|
||||||
|
font.pointSize: Appearance.font.size.normal
|
||||||
|
}
|
||||||
|
|
||||||
|
Item {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
}
|
||||||
|
|
||||||
|
Loader {
|
||||||
|
active: isCurrent
|
||||||
|
asynchronous: true
|
||||||
|
|
||||||
|
sourceComponent: MaterialIcon {
|
||||||
|
text: "check"
|
||||||
|
color: Colours.palette.m3onSurfaceVariant
|
||||||
|
font.pointSize: Appearance.font.size.large
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
implicitHeight: fontFamilyMonoRow.implicitHeight + Appearance.padding.normal * 2
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -692,68 +676,64 @@ RowLayout {
|
||||||
font.weight: 500
|
font.weight: 500
|
||||||
}
|
}
|
||||||
|
|
||||||
StyledListView {
|
ColumnLayout {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
implicitHeight: fontsSection.expanded ? Math.min(300, Qt.fontFamilies().length * 50) : 0
|
|
||||||
|
|
||||||
model: Qt.fontFamilies()
|
|
||||||
spacing: Appearance.spacing.small / 2
|
spacing: Appearance.spacing.small / 2
|
||||||
clip: true
|
|
||||||
|
|
||||||
StyledScrollBar.vertical: StyledScrollBar {
|
Repeater {
|
||||||
flickable: parent
|
model: Qt.fontFamilies()
|
||||||
}
|
|
||||||
|
|
||||||
delegate: StyledRect {
|
delegate: StyledRect {
|
||||||
required property string modelData
|
required property string modelData
|
||||||
|
|
||||||
width: parent ? parent.width : 0
|
Layout.fillWidth: true
|
||||||
|
|
||||||
readonly property bool isCurrent: modelData === rootPane.fontFamilySans
|
readonly property bool isCurrent: modelData === rootPane.fontFamilySans
|
||||||
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
|
color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0)
|
||||||
radius: Appearance.rounding.normal
|
radius: Appearance.rounding.normal
|
||||||
border.width: isCurrent ? 1 : 0
|
border.width: isCurrent ? 1 : 0
|
||||||
border.color: Colours.palette.m3primary
|
border.color: Colours.palette.m3primary
|
||||||
|
|
||||||
StateLayer {
|
StateLayer {
|
||||||
function onClicked(): void {
|
function onClicked(): void {
|
||||||
rootPane.fontFamilySans = modelData;
|
rootPane.fontFamilySans = modelData;
|
||||||
rootPane.saveConfig();
|
rootPane.saveConfig();
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
RowLayout {
|
|
||||||
id: fontFamilySansRow
|
|
||||||
|
|
||||||
anchors.left: parent.left
|
|
||||||
anchors.right: parent.right
|
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
|
||||||
anchors.margins: Appearance.padding.normal
|
|
||||||
|
|
||||||
spacing: Appearance.spacing.normal
|
|
||||||
|
|
||||||
StyledText {
|
|
||||||
text: modelData
|
|
||||||
font.pointSize: Appearance.font.size.normal
|
|
||||||
}
|
|
||||||
|
|
||||||
Item {
|
|
||||||
Layout.fillWidth: true
|
|
||||||
}
|
|
||||||
|
|
||||||
Loader {
|
|
||||||
active: isCurrent
|
|
||||||
asynchronous: true
|
|
||||||
|
|
||||||
sourceComponent: MaterialIcon {
|
|
||||||
text: "check"
|
|
||||||
color: Colours.palette.m3onSurfaceVariant
|
|
||||||
font.pointSize: Appearance.font.size.large
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
implicitHeight: fontFamilySansRow.implicitHeight + Appearance.padding.normal * 2
|
RowLayout {
|
||||||
|
id: fontFamilySansRow
|
||||||
|
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.margins: Appearance.padding.normal
|
||||||
|
|
||||||
|
spacing: Appearance.spacing.normal
|
||||||
|
|
||||||
|
StyledText {
|
||||||
|
text: modelData
|
||||||
|
font.pointSize: Appearance.font.size.normal
|
||||||
|
}
|
||||||
|
|
||||||
|
Item {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
}
|
||||||
|
|
||||||
|
Loader {
|
||||||
|
active: isCurrent
|
||||||
|
asynchronous: true
|
||||||
|
|
||||||
|
sourceComponent: MaterialIcon {
|
||||||
|
text: "check"
|
||||||
|
color: Colours.palette.m3onSurfaceVariant
|
||||||
|
font.pointSize: Appearance.font.size.large
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
implicitHeight: fontFamilySansRow.implicitHeight + Appearance.padding.normal * 2
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue