medvedych/harbour-tooter
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

improved notifications UI

Browse source 
notifications (mentions, favs, reblogs) are distinguished by different looks (initial commits)
This commit is contained in:
molan-git 2020-06-06 23:17:27 +02:00
parent 5f4dae2a2d
commit 9fb1efc189
2 changed files with 42 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
qml/pages/ConversationPage.qml
View file

@ -17,7 +17,7 @@ Page {
property ListModel suggestedModel
property string toot_id: ""
property string toot_url: ""
property int tootMaxChar: 500;
property int tootMaxChar: 500
property ListModel mdl
allowedOrientations: Orientation.All
@ -66,7 +66,7 @@ Page {
}
SilicaListView {
id: conversationList
id: myList
header: PageHeader {
title: headerTitle // pageTitle pushed from MainPage.qml or VisualContainer.qml
}

43
qml/pages/components/VisualContainer.qml
View file

@ -10,8 +10,9 @@ BackgroundItem {
signal navigateTo(string link)
width: parent.width
height: mnu.height + miniHeader.height + (typeof attachments !== "undefined" && attachments.count ? media.height + Theme.paddingLarge + Theme.paddingMedium: Theme.paddingLarge) + lblContent.height + Theme.paddingLarge + (miniStatus.visible ? miniStatus.height : 0)
height: if (myList.type === "notifications" && ( model.type === "favourite" || model.type === "reblog" )) {
mnu.height + miniHeader.height + Theme.paddingLarge + lblContent.height + Theme.paddingLarge + (miniStatus.visible ? miniStatus.height : 0)
} else mnu.height + miniHeader.height + (typeof attachments !== "undefined" && attachments.count ? media.height + Theme.paddingLarge + Theme.paddingMedium: Theme.paddingLarge) + lblContent.height + Theme.paddingLarge + (miniStatus.visible ? miniStatus.height : 0)
Rectangle {
id: bgDirect
x: 0
@ -37,6 +38,20 @@ BackgroundItem {
}
} */
Rectangle {
id: bgDelegate
x: 0
y: 0
visible: myList.type === "notifications" && ( model.type === "favourite" || model.type === "reblog" )
width: parent.width
height: parent.height
opacity: 0.5
gradient: Gradient {
GradientStop { position: -0.5; color: "transparent" }
GradientStop { position: 0.4; color: Theme.highlightDimmerColor }
}
}
MiniStatus {
id: miniStatus
anchors {
@ -83,6 +98,13 @@ BackgroundItem {
}
}
Rectangle {
visible: myList.type === "notifications" && ( model.type === "favourite" || model.type === "reblog" )
opacity: 0.5
color: Theme.highlightDimmerColor
anchors.fill: avatar
}
Image {
id: iconTR
visible: typeof status_reblogged !== "undefined" && status_reblogged
@ -109,6 +131,7 @@ BackgroundItem {
}
Image {
id: reblogAvatar
asynchronous: true
smooth: true
opacity: status === Image.Ready ? 1.0 : 0.0
@ -118,6 +141,13 @@ BackgroundItem {
width: Theme.iconSizeSmall
height: width
}
Rectangle {
visible: myList.type === "notifications" && ( model.type === "favourite" || model.type === "reblog" )
opacity: 0.5
color: Theme.highlightDimmerColor
anchors.fill: reblogAvatar
}
}
}
@ -136,9 +166,13 @@ BackgroundItem {
text: content.replace(new RegExp("<a ", 'g'), '<a style="text-decoration: none; color:'+(pressed ? Theme.secondaryColor : Theme.highlightColor)+'" ')
textFormat: Text.RichText
font.pixelSize: Theme.fontSizeSmall
linkColor: Theme.highlightColor
linkColor: if (myList.type === "notifications" && ( model.type === "favourite" || model.type === "reblog" )) {
Theme.secondaryHighlightColor
} else Theme.highlightColor
wrapMode: Text.Wrap
color: (pressed ? Theme.highlightColor : (!highlight ? Theme.primaryColor : Theme.secondaryColor))
color: if (myList.type === "notifications" && ( model.type === "favourite" || model.type === "reblog" )) {
(pressed ? Theme.secondaryHighlightColor : (!highlight ? Theme.secondaryColor : Theme.secondaryHighlightColor))
} else (pressed ? Theme.highlightColor : (!highlight ? Theme.primaryColor : Theme.secondaryColor))
height: if (model.type === "follow") {
Theme.paddingLarge
} else content.length ? (contentWarningLabel.paintedHeight > paintedHeight ? contentWarningLabel.paintedHeight : paintedHeight) : 0
@ -213,6 +247,7 @@ BackgroundItem {
MediaBlock {
id: media
visible: myList.type !== "notifications" && ( model.type !== "favourite" || model.type !== "reblog" )
model: typeof attachments !== "undefined" ? attachments : Qt.createQmlObject('import QtQuick 2.0; ListModel { }', Qt.application, 'InternalQmlObject');
height: Theme.iconSizeExtraLarge * 2
anchors {