1
0
mirror of https://github.com/AvengeMedia/DankMaterialShell.git synced 2026-01-25 14:02:53 -05:00

misc: fix some various scaling issues with fonts

fixes #1268
This commit is contained in:
bbedward
2026-01-24 22:26:59 -05:00
parent 80025804ab
commit 5f16624000
5 changed files with 197 additions and 102 deletions

View File

@@ -750,7 +750,7 @@ Rectangle {
Rectangle {
id: categoryRow
width: parent.width
height: 40
height: Math.max(Theme.iconSize, Theme.fontSizeMedium) + Theme.spacingS * 2
radius: Theme.cornerRadius
visible: categoryDelegate.modelData.separator !== true
@@ -847,7 +847,7 @@ Rectangle {
readonly property bool isHighlighted: root.keyboardHighlightIndex === modelData.tabIndex
width: childrenColumn.width
height: 36
height: Math.max(Theme.iconSize - 4, Theme.fontSizeSmall + 1) + Theme.spacingS * 2
radius: Theme.cornerRadius
visible: root.isItemVisible(modelData)
color: {

View File

@@ -314,25 +314,39 @@ DankPopout {
height: Theme.spacingXS
}
StackLayout {
Item {
id: pages
width: parent.width
height: implicitHeight
implicitHeight: {
if (currentIndex === 0)
if (root.currentTabIndex === 0)
return overviewLoader.item?.implicitHeight ?? 410;
if (currentIndex === 1)
if (root.currentTabIndex === 1)
return mediaLoader.item?.implicitHeight ?? 410;
if (currentIndex === 2)
if (root.currentTabIndex === 2)
return wallpaperLoader.item?.implicitHeight ?? 410;
if (SettingsData.weatherEnabled && currentIndex === 3)
if (SettingsData.weatherEnabled && root.currentTabIndex === 3)
return weatherLoader.item?.implicitHeight ?? 410;
return 410;
}
currentIndex: root.currentTabIndex
readonly property var currentItem: {
if (root.currentTabIndex === 0)
return overviewLoader.item;
if (root.currentTabIndex === 1)
return mediaLoader.item;
if (root.currentTabIndex === 2)
return wallpaperLoader.item;
if (root.currentTabIndex === 3)
return weatherLoader.item;
return null;
}
Loader {
id: overviewLoader
anchors.fill: parent
active: root.currentTabIndex === 0
visible: active
sourceComponent: Component {
OverviewTab {
onCloseDash: root.dashVisible = false
@@ -350,7 +364,9 @@ DankPopout {
Loader {
id: mediaLoader
anchors.fill: parent
active: root.currentTabIndex === 1
visible: active
sourceComponent: Component {
MediaPlayerTab {
targetScreen: root.screen
@@ -379,7 +395,9 @@ DankPopout {
Loader {
id: wallpaperLoader
anchors.fill: parent
active: root.currentTabIndex === 2
visible: active
sourceComponent: Component {
WallpaperTab {
active: true
@@ -393,7 +411,9 @@ DankPopout {
Loader {
id: weatherLoader
anchors.fill: parent
active: SettingsData.weatherEnabled && root.currentTabIndex === 3
visible: active
sourceComponent: Component {
WeatherTab {}
}

View File

@@ -129,7 +129,7 @@ Item {
}
implicitWidth: 700
implicitHeight: 410
implicitHeight: playerContent.height + playerContent.anchors.topMargin * 2
Connections {
target: activePlayer
@@ -327,6 +327,7 @@ Item {
clip: false
visible: !_noneAvailable && (!showNoPlayerNow)
ColumnLayout {
id: playerContent
width: 484
height: 370
spacing: Theme.spacingXS

View File

@@ -12,7 +12,7 @@ Item {
LayoutMirroring.childrenInherit: true
implicitWidth: 700
implicitHeight: 410
implicitHeight: root.available ? mainColumn.implicitHeight : unavailableColumn.implicitHeight + Theme.spacingXL * 2
property bool syncing: false
function syncFrom(type) {
@@ -52,6 +52,7 @@ Item {
property bool available: WeatherService.weather.available
Column {
id: unavailableColumn
anchors.centerIn: parent
spacing: Theme.spacingL
visible: !root.available
@@ -141,6 +142,7 @@ Item {
}
Column {
id: mainColumn
anchors.fill: parent
visible: root.available
spacing: Theme.spacingXS
@@ -164,7 +166,7 @@ Item {
anchors.horizontalCenter: parent.horizontalCenter
// anchors.verticalCenter: parent.verticalCenter
width: weatherIcon.width + tempColumn.width + sunriseColumn.width + Theme.spacingM * 2
height: 70
height: Math.max(weatherIcon.height, tempColumn.height, sunriseColumn.height)
DankIcon {
id: weatherIcon
@@ -325,7 +327,7 @@ Item {
Item {
id: dateStepper
anchors.horizontalCenter: parent.horizontalCenter
height: 60
height: dateStepperInner.height + Theme.spacingM * 2
width: dateStepperInner.width
property var currentDate: new Date()
@@ -354,10 +356,11 @@ Item {
Item {
id: dateStepperInner
anchors.fill: parent
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
readonly property var space: Theme.spacingXS
width: yearStepper.width + monthStepper.width + dayStepper.width + hourStepper.width + minuteStepper.width + (suffix.visible ? suffix.width : 0) + 10.5 * space + 2 * dateStepperInnerPadding.width
height: Math.max(yearStepper.height, monthStepper.height, dayStepper.height, hourStepper.height, minuteStepper.height)
Item {
id: dateStepperInnerPadding
@@ -444,20 +447,15 @@ Item {
text: ":"
}
}
Rectangle {
StyledText {
id: suffix
visible: !SettingsData.use24HourClock
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenter: minuteStepper.verticalCenter
anchors.left: minuteStepper.right
anchors.leftMargin: 2 * parent.space
StyledText {
isMonospace: true
anchors.horizontalCenter: parent.horizontalCenter
text: dateStepper.splitDate[5] ?? ""
font.pixelSize: Theme.fontSizeSmall
x: -Theme.fontSizeSmall / 2
y: -Theme.fontSizeSmall / 2
}
isMonospace: true
text: dateStepper.splitDate[5] ?? ""
font.pixelSize: Theme.fontSizeSmall
}
DankActionButton {
id: dateResetButton
@@ -898,7 +896,7 @@ Item {
Row {
width: parent.width
height: 32
height: Math.max(hourlyHeader.height, denseButton.height) + Theme.spacingS
spacing: Theme.spacingS
StyledText {
@@ -928,7 +926,7 @@ Item {
Item {
width: parent.width
height: 100 + Theme.spacingXS
height: (hourlyLoader.item?.cardHeight ?? (Theme.fontSizeLarge * 6)) + Theme.spacingXS
Loader {
id: hourlyLoader
@@ -962,7 +960,7 @@ Item {
contentHeight: cardHeight
contentWidth: cardWidth
property var cardHeight: 100
property var cardHeight: Theme.fontSizeLarge * 6
property var cardWidth: ((hourlyList.width + hourlyList.spacing) / hourlyList.visibleCount) - hourlyList.spacing
property int initialIndex: (new Date()).getHours()
property bool dense: !SessionData.weatherHourlyDetailed
@@ -1038,7 +1036,7 @@ Item {
Row {
width: parent.width
height: 32
height: dailyHeader.height + Theme.spacingS
spacing: Theme.spacingS
StyledText {
@@ -1060,7 +1058,7 @@ Item {
Item {
width: parent.width
height: 100 + Theme.spacingXS
height: (dailyLoader.item?.cardHeight ?? (Theme.fontSizeLarge * 6)) + Theme.spacingXS
Loader {
id: dailyLoader
@@ -1094,7 +1092,7 @@ Item {
contentHeight: cardHeight
contentWidth: cardWidth
property var cardHeight: 100
property var cardHeight: Theme.fontSizeLarge * 6
property var cardWidth: ((dailyList.width + dailyList.spacing) / dailyList.visibleCount) - dailyList.spacing
property int initialIndex: 0
property bool dense: false

View File

@@ -373,81 +373,42 @@ Column {
}
}
DankActionButton {
id: musicMenuButton
visible: modelData.id === "music"
buttonSize: 32
iconName: "more_vert"
iconSize: 18
iconColor: Theme.outline
onClicked: {
musicContextMenu.widgetData = modelData;
musicContextMenu.sectionId = root.sectionId;
musicContextMenu.widgetIndex = index;
var buttonPos = musicMenuButton.mapToItem(root, 0, 0);
var popupWidth = musicContextMenu.width;
var popupHeight = musicContextMenu.height;
var xPos = buttonPos.x - popupWidth - Theme.spacingS;
if (xPos < 0)
xPos = buttonPos.x + musicMenuButton.width + Theme.spacingS;
var yPos = buttonPos.y - popupHeight / 2 + musicMenuButton.height / 2;
if (yPos < 0) {
yPos = Theme.spacingS;
} else if (yPos + popupHeight > root.height) {
yPos = root.height - popupHeight - Theme.spacingS;
}
musicContextMenu.x = xPos;
musicContextMenu.y = yPos;
musicContextMenu.open();
}
}
Row {
spacing: Theme.spacingXS
visible: modelData.id === "clock" || modelData.id === "music" || modelData.id === "focusedWindow" || modelData.id === "runningApps" || modelData.id === "keyboard_layout_name"
DankActionButton {
id: smallSizeButton
buttonSize: 28
visible: modelData.id === "music"
iconName: "photo_size_select_small"
iconSize: 16
iconColor: (modelData.mediaSize !== undefined ? modelData.mediaSize : SettingsData.mediaSize) === 0 ? Theme.primary : Theme.outline
onClicked: {
root.compactModeChanged("music", 0);
}
onEntered: {
sharedTooltip.show("Small", smallSizeButton, 0, 0, "bottom");
}
onExited: {
sharedTooltip.hide();
}
}
DankActionButton {
id: mediumSizeButton
buttonSize: 28
visible: modelData.id === "music"
iconName: "photo_size_select_actual"
iconSize: 16
iconColor: (modelData.mediaSize !== undefined ? modelData.mediaSize : SettingsData.mediaSize) === 1 ? Theme.primary : Theme.outline
onClicked: {
root.compactModeChanged("music", 1);
}
onEntered: {
sharedTooltip.show("Medium", mediumSizeButton, 0, 0, "bottom");
}
onExited: {
sharedTooltip.hide();
}
}
DankActionButton {
id: largeSizeButton
buttonSize: 28
visible: modelData.id === "music"
iconName: "photo_size_select_large"
iconSize: 16
iconColor: (modelData.mediaSize !== undefined ? modelData.mediaSize : SettingsData.mediaSize) === 2 ? Theme.primary : Theme.outline
onClicked: {
root.compactModeChanged("music", 2);
}
onEntered: {
sharedTooltip.show("Large", largeSizeButton, 0, 0, "bottom");
}
onExited: {
sharedTooltip.hide();
}
}
DankActionButton {
id: largerSizeButton
buttonSize: 28
visible: modelData.id === "music"
iconName: "fit_screen"
iconSize: 16
iconColor: (modelData.mediaSize !== undefined ? modelData.mediaSize : SettingsData.mediaSize) === 3 ? Theme.primary : Theme.outline
onClicked: {
root.compactModeChanged("music", 3);
}
onEntered: {
sharedTooltip.show("Largest", largerSizeButton, 0, 0, "bottom");
}
onExited: {
sharedTooltip.hide();
}
}
visible: modelData.id === "clock" || modelData.id === "focusedWindow" || modelData.id === "runningApps" || modelData.id === "keyboard_layout_name"
DankActionButton {
id: compactModeButton
@@ -1308,4 +1269,119 @@ Column {
}
}
}
Popup {
id: musicContextMenu
property var widgetData: null
property string sectionId: ""
property int widgetIndex: -1
width: 180
height: musicMenuColumn.implicitHeight + Theme.spacingS * 2
padding: 0
modal: true
focus: true
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
background: Rectangle {
color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
radius: Theme.cornerRadius
border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
border.width: 0
}
contentItem: Item {
Column {
id: musicMenuColumn
anchors.fill: parent
anchors.margins: Theme.spacingS
spacing: 2
Repeater {
model: [
{
icon: "photo_size_select_small",
label: I18n.tr("Small"),
sizeValue: 0
},
{
icon: "photo_size_select_actual",
label: I18n.tr("Medium"),
sizeValue: 1
},
{
icon: "photo_size_select_large",
label: I18n.tr("Large"),
sizeValue: 2
},
{
icon: "fit_screen",
label: I18n.tr("Largest"),
sizeValue: 3
}
]
delegate: Rectangle {
required property var modelData
required property int index
function isSelected() {
var wd = musicContextMenu.widgetData;
var currentSize = wd?.mediaSize ?? SettingsData.mediaSize;
return currentSize === modelData.sizeValue;
}
width: musicMenuColumn.width
height: Math.max(18, Theme.fontSizeSmall) + Theme.spacingM * 2
radius: Theme.cornerRadius
color: musicOptionArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
Row {
anchors.left: parent.left
anchors.leftMargin: Theme.spacingS
anchors.verticalCenter: parent.verticalCenter
spacing: Theme.spacingS
DankIcon {
name: modelData.icon
size: 18
color: isSelected() ? Theme.primary : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
StyledText {
text: modelData.label
font.pixelSize: Theme.fontSizeSmall
font.weight: isSelected() ? Font.Medium : Font.Normal
color: isSelected() ? Theme.primary : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
}
DankIcon {
anchors.right: parent.right
anchors.rightMargin: Theme.spacingS
anchors.verticalCenter: parent.verticalCenter
name: "check"
size: 16
color: Theme.primary
visible: isSelected()
}
MouseArea {
id: musicOptionArea
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: {
root.compactModeChanged("music", modelData.sizeValue);
musicContextMenu.close();
}
}
}
}
}
}
}
}