Commit 93bd7819 authored by Nathaniel Graham's avatar Nathaniel Graham

Improve header and metadata display

Summary:
- Moved the icon back onto the page, and removed it from the header
- Moved app metadata below the description, to let users focus on the icon, screenshots, and description
- Added blue lines between each section

Looks better on desktop and mobile now--IMHO of course!

This patch does not include any string changes, so it can go into 5.12.

Supports D9976, which changes the source switcher UI to use a combobox instead of links.

Test Plan:
Tested in KDE Neon (please pardon the fact that the before and after screenshots have different window sizes):

Krita, before:
{F5662756}

Krita, after
{F5664686}

Endless Sky, before:
{F5662755}

Endless Sky, after
{F5664687}

Blender, before:
{F5662758}

Blender, after
{F5664688}

Mobile UI, before:
{F5662945}

Mobile UI, after
{F5664689}

Reviewers: apol, abetts, colomar, #discover_software_store, #vdg, andreaska

Reviewed By: apol, colomar, #discover_software_store, andreaska

Subscribers: matheusm, andreaska, januz, romangg, plasma-devel

Tags: #plasma

Differential Revision: https://phabricator.kde.org/D9974
parent 9cbe6c48
......@@ -45,7 +45,7 @@ DiscoverPage {
}
}
Kirigami.OverlaySheet {
Kirigami.OverlaySheet {
id: originsOverlay
bottomPadding: Kirigami.Units.largeSpacing
topPadding: Kirigami.Units.largeSpacing
......@@ -105,13 +105,6 @@ DiscoverPage {
Item {
Layout.fillWidth: true
}
Kirigami.Icon {
Layout.preferredHeight: parent.implicitHeight
Layout.preferredWidth: Layout.preferredHeight
source: appInfo.application.icon
Layout.alignment: Qt.AlignVCenter
}
Kirigami.Heading {
level: 3
Layout.maximumWidth: parent.width/2
......@@ -146,16 +139,106 @@ DiscoverPage {
}
}
// Icon, name, caption, screenshots, description and reviews
ColumnLayout {
spacing: 0
Kirigami.Heading {
text: appInfo.application.comment
level: 4
RowLayout {
Kirigami.Icon {
Layout.preferredHeight: 64
Layout.preferredWidth: 64
source: appInfo.application.icon
anchors.margins: 20
}
ColumnLayout {
spacing: 0
Kirigami.Heading {
level: 3
text: appInfo.application.name
maximumLineCount: 1
elide: Text.ElideRight
Layout.fillWidth: true
horizontalAlignment: Text.AlignBottom
}
Kirigami.Heading {
level: 5
text: appInfo.application.comment
maximumLineCount: 1
elide: Text.ElideRight
Layout.fillWidth: true
Layout.alignment: Qt.AlignTop
}
}
}
Rectangle {
color: Kirigami.Theme.linkColor
Layout.fillWidth: true
height: 1
anchors.bottomMargin: Kirigami.Units.largeSpacing
}
ApplicationScreenshots {
Layout.topMargin: Kirigami.Units.largeSpacing
Layout.fillWidth: true
resource: appInfo.application
page: appInfo
}
Item {
Layout.fillWidth: true
elide: Text.ElideRight
bottomPadding: Kirigami.Units.largeSpacing
height: 5
}
QQC2.Label {
Layout.fillWidth: true
horizontalAlignment: Text.AlignJustify
wrapMode: Text.WordWrap
text: appInfo.application.longDescription + originsOverlay.sentence
onLinkActivated: {
var idx = parseInt(link, 10)
var res = originsOverlay.model.resourceAt(idx)
window.stack.pop()
Navigation.openApplication(res)
}
}
LinkButton {
id: addonsButton
text: i18n("Addons")
visible: addonsView.containsAddons
onClicked: addonsView.sheetOpen = true
}
LinkButton {
text: i18n("Review")
onClicked: reviewsSheet.openReviewDialog()
visible: !commentsButton.visible && reviewsModel.backend && reviewsModel.backend.isResourceSupported(appInfo.application)
}
LinkButton {
id: commentsButton
readonly property QtObject rating: appInfo.application.rating
visible: rating && rating.ratingCount>0 && reviewsModel.count
text: i18n("Show reviews (%1)...", rating ? reviewsModel.count : 0)
onClicked: {
reviewsSheet.open()
}
}
Item {
height: addonsButton.height
width: 5
}
// Details/metadata
Rectangle {
color: Kirigami.Theme.linkColor
Layout.fillWidth: true
height: 1
anchors.bottomMargin: Kirigami.Units.largeSpacing
}
Item {
Layout.fillWidth: true
height: 5
}
GridLayout {
rowSpacing: 0
columns: 2
......@@ -244,61 +327,6 @@ DiscoverPage {
horizontalAlignment: Text.AlignLeft
}
}
ApplicationScreenshots {
Layout.topMargin: Kirigami.Units.largeSpacing
Layout.fillWidth: true
resource: appInfo.application
page: appInfo
}
Kirigami.Heading {
level: 3
Layout.topMargin: Kirigami.Units.largeSpacing
text: i18n("Description")
Layout.fillWidth: true
visible: appInfo.application.longDescription.length > 0
}
QQC2.Label {
Layout.fillWidth: true
horizontalAlignment: Text.AlignJustify
wrapMode: Text.WordWrap
text: appInfo.application.longDescription + originsOverlay.sentence
onLinkActivated: {
var idx = parseInt(link, 10)
var res = originsOverlay.model.resourceAt(idx)
window.stack.pop()
Navigation.openApplication(res)
}
}
LinkButton {
id: addonsButton
text: i18n("Addons")
visible: addonsView.containsAddons
onClicked: addonsView.sheetOpen = true
}
LinkButton {
text: i18n("Review")
onClicked: reviewsSheet.openReviewDialog()
visible: !commentsButton.visible && reviewsModel.backend && reviewsModel.backend.isResourceSupported(appInfo.application)
}
LinkButton {
id: commentsButton
readonly property QtObject rating: appInfo.application.rating
visible: rating && rating.ratingCount>0 && reviewsModel.count
text: i18n("Show reviews (%1)...", rating ? reviewsModel.count : 0)
onClicked: {
reviewsSheet.open()
}
}
Item {
height: addonsButton.height
width: 5
}
}
readonly property var addons: AddonsView {
......
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