Introduce property to switch between mobile and desktop view

This commit is contained in:
Bart De Vries 2024-01-11 21:49:23 +01:00
parent 811a41ec0f
commit dc48e580ab
6 changed files with 21 additions and 20 deletions

View File

@ -234,7 +234,7 @@ Kirigami.ScrollablePage {
Layout.fillHeight: true
readOnly: true
selectByMouse: !Kirigami.Settings.isMobile
selectByMouse: !kastsMainWindow.isMobile
text: page.entry.content
baseUrl: page.entry.baseUrl
textFormat: Text.RichText

View File

@ -18,7 +18,7 @@ Kirigami.InlineMessage {
bottom: parent.bottom
right: parent.right
left: parent.left
margins: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing : Kirigami.Units.gridUnit * 4
margins: kastsMainWindow.isMobile ? Kirigami.Units.largeSpacing : Kirigami.Units.gridUnit * 4
bottomMargin: bottomMessageSpacing
}
type: Kirigami.MessageType.Error

View File

@ -246,7 +246,7 @@ Kirigami.ScrollablePage {
id: feedUrl
Layout.alignment: Qt.AlignTop
readOnly: true
selectByMouse: !Kirigami.Settings.isMobile
selectByMouse: !kastsMainWindow.isMobile
textFormat:TextEdit.RichText
text: "<a href='%1'>%1</a>".arg(feed.url)
wrapMode: TextEdit.Wrap
@ -286,7 +286,7 @@ Kirigami.ScrollablePage {
TextEdit {
readOnly: true
Layout.alignment: Qt.AlignTop
selectByMouse: !Kirigami.Settings.isMobile
selectByMouse: !kastsMainWindow.isMobile
textFormat:TextEdit.RichText
text: "<a href='%1'>%1</a>".arg(feed.link)
onLinkActivated: (link) => {
@ -304,7 +304,7 @@ Kirigami.ScrollablePage {
height: visible ? implicitHeight : 0
readOnly: true
selectByMouse: !Kirigami.Settings.isMobile
selectByMouse: !kastsMainWindow.isMobile
textFormat:TextEdit.RichText
text: isSubscribed ? i18n("Subscribed since: %1", feed.subscribed.toLocaleString(Qt.locale(), Locale.ShortFormat)) : ""
wrapMode: Text.WordWrap
@ -317,7 +317,7 @@ Kirigami.ScrollablePage {
height: visible ? implicitHeight : 0
readOnly: true
selectByMouse: !Kirigami.Settings.isMobile
selectByMouse: !kastsMainWindow.isMobile
textFormat:TextEdit.RichText
text: isSubscribed ? i18n("Last updated: %1", feed.lastUpdated.toLocaleString(Qt.locale(), Locale.ShortFormat)) : ""
wrapMode: Text.WordWrap
@ -330,7 +330,7 @@ Kirigami.ScrollablePage {
height: visible ? implicitHeight : 0
readOnly: true
selectByMouse: !Kirigami.Settings.isMobile
selectByMouse: !kastsMainWindow.isMobile
textFormat:TextEdit.RichText
text: i18np("1 Episode", "%1 Episodes", feed.entryCount) + ", " + i18np("1 Unplayed", "%1 Unplayed", feed.unreadEntryCount)
wrapMode: Text.WordWrap

View File

@ -37,7 +37,7 @@ Kirigami.ScrollablePage {
property list<Kirigami.Action> pageActions: [
Kirigami.Action {
visible: Kirigami.Settings.isMobile
visible: kastsMainWindow.isMobile
text: i18nc("@action:intoolbar Open the podcast discover page", "Discover")
icon.name: "search"
onTriggered: {
@ -246,7 +246,7 @@ Kirigami.ScrollablePage {
// binding loop, we calculate the number of columns and card width based
// on the total width of the page itself rather than the width left for
// the GridView, and then subtract some space
property int availableWidth: subscriptionPage.width - !Kirigami.Settings.isMobile * Kirigami.Units.gridUnit * 1.3
property int availableWidth: subscriptionPage.width - !kastsMainWindow.isMobile * Kirigami.Units.gridUnit * 1.3
// TODO: get proper width for scrollbar rather than hardcoding it
property int columns: Math.max(1, Math.floor(availableWidth / (minimumCardSize + 2 * cardMargin)))

View File

@ -24,8 +24,9 @@ Kirigami.ApplicationWindow {
id: kastsMainWindow
title: i18n("Kasts")
width: Kirigami.Settings.isMobile ? 360 : 800
height: Kirigami.Settings.isMobile ? 660 : 600
property bool isMobile: Kirigami.Settings.isMobile
width: isMobile ? 360 : 800
height: isMobile ? 660 : 600
pageStack.clip: true
pageStack.popHiddenPages: true
@ -40,7 +41,7 @@ Kirigami.ApplicationWindow {
property var miniplayerSize: Kirigami.Units.gridUnit * 3 + Kirigami.Units.gridUnit / 6
property int bottomMessageSpacing: {
if (Kirigami.Settings.isMobile) {
if (isMobile) {
return Kirigami.Units.largeSpacing + ( AudioManager.entry ? ( footerLoader.item.contentY == 0 ? miniplayerSize : 0 ) : 0 )
} else {
return Kirigami.Units.largeSpacing;
@ -95,7 +96,7 @@ Kirigami.ApplicationWindow {
}
function saveWindowLayout() {
if (Kirigami.Settings.isMobile) {
if (isMobile) {
settings.mobileWidth = kastsMainWindow.width;
settings.mobileHeight = kastsMainWindow.height;
} else {
@ -105,7 +106,7 @@ Kirigami.ApplicationWindow {
}
function restoreWindowLayout() {
if (Kirigami.Settings.isMobile) {
if (isMobile) {
if (settings.mobileWidth) kastsMainWindow.width = settings.mobileWidth;
if (settings.mobileHeight) kastsMainWindow.height = settings.mobileHeight;
} else {
@ -137,7 +138,7 @@ Kirigami.ApplicationWindow {
}
}
property bool showGlobalDrawer: !Kirigami.Settings.isMobile || kastsMainWindow.isWidescreen
property bool showGlobalDrawer: !isMobile || kastsMainWindow.isWidescreen
globalDrawer: showGlobalDrawer ? myGlobalDrawer : null
@ -164,7 +165,7 @@ Kirigami.ApplicationWindow {
header: Loader {
id: headerLoader
active: !Kirigami.Settings.isMobile
active: !isMobile
visible: active
sourceComponent: HeaderBar { focus: true }
@ -172,13 +173,13 @@ Kirigami.ApplicationWindow {
// create space at the bottom to show miniplayer without it hiding stuff
// underneath
pageStack.anchors.bottomMargin: (AudioManager.entry && Kirigami.Settings.isMobile) ? miniplayerSize + 1 : 0
pageStack.anchors.bottomMargin: (AudioManager.entry && isMobile) ? miniplayerSize + 1 : 0
Loader {
id: footerLoader
anchors.fill: parent
active: AudioManager.entry && Kirigami.Settings.isMobile
active: AudioManager.entry && isMobile
visible: active
z: (!item || item.contentY === 0) ? -1 : 999
sourceComponent: FooterBar {
@ -206,7 +207,7 @@ Kirigami.ApplicationWindow {
id: bottomToolbarLoader
visible: active
height: visible ? implicitHeight : 0
active: Kirigami.Settings.isMobile && !kastsMainWindow.isWidescreen
active: isMobile && !kastsMainWindow.isWidescreen
sourceComponent: BottomToolbar {
transparentBackground: footerLoader.active
opacity: (!footerLoader.item || footerLoader.item.contentY === 0) ? 1 : 0

View File

@ -29,7 +29,7 @@ Rectangle {
bottom: parent.bottom
left: parent.left
right: parent.right
margins: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing : Kirigami.Units.gridUnit * 4
margins: kastsMainWindow.isMobile ? Kirigami.Units.largeSpacing : Kirigami.Units.gridUnit * 4
bottomMargin: bottomMessageSpacing + ( errorNotification.visible ? errorNotification.height + Kirigami.Units.largeSpacing : 0 )
}