Make some space for lazy-loaded elements, part 1

This commit is contained in:
Sebastian J. Wolf 2020-10-11 22:02:30 +02:00
parent 5a12735afc
commit 67669cf63f
2 changed files with 53 additions and 46 deletions

View file

@ -81,7 +81,7 @@ Item {
Connections { Connections {
target: tdLibWrapper target: tdLibWrapper
onFileUpdated: { onFileUpdated: {
if (fileId === photoData.id) { if (typeof photoData !== "undefined" && fileId === photoData.id) {
console.log("File updated, completed? " + fileInformation.local.is_downloading_completed); console.log("File updated, completed? " + fileInformation.local.is_downloading_completed);
if (fileInformation.local.is_downloading_completed) { if (fileInformation.local.is_downloading_completed) {
photoData = fileInformation; photoData = fileInformation;

View file

@ -446,6 +446,10 @@ Page {
property variant myMessage: display property variant myMessage: display
property variant userInformation: tdLibWrapper.getUserInformation(display.sender_user_id) property variant userInformation: tdLibWrapper.getUserInformation(display.sender_user_id)
property bool isOwnMessage: chatPage.myUserId === display.sender_user_id
property bool isForwarded: typeof display.forward_info !== "undefined"
property bool containsImage: display.content['@type'] === "messagePhoto"
property bool containsSticker: display.content['@type'] === "messageSticker"
menu: ContextMenu { menu: ContextMenu {
MenuItem { MenuItem {
@ -495,13 +499,16 @@ Page {
repeat: false repeat: false
running: false running: false
onTriggered: { onTriggered: {
if (typeof display.content !== "undefined") {
webPagePreviewLoader.active = ( typeof display.content.web_page !== "undefined" ); webPagePreviewLoader.active = ( typeof display.content.web_page !== "undefined" );
imagePreviewLoader.active = ( display.content['@type'] === "messagePhoto" ); imagePreviewLoader.active = messageListItem.containsImage;
stickerPreviewLoader.active = messageListItem.containsSticker;
videoPreviewLoader.active = (( display.content['@type'] === "messageVideo" ) || ( display.content['@type'] === "messageAnimation" )); videoPreviewLoader.active = (( display.content['@type'] === "messageVideo" ) || ( display.content['@type'] === "messageAnimation" ));
audioPreviewLoader.active = (( display.content['@type'] === "messageVoiceNote" ) || ( display.content['@type'] === "messageAudio" )); audioPreviewLoader.active = (( display.content['@type'] === "messageVoiceNote" ) || ( display.content['@type'] === "messageAudio" ));
documentPreviewLoader.active = ( display.content['@type'] === "messageDocument" ); documentPreviewLoader.active = ( display.content['@type'] === "messageDocument" );
locationPreviewLoader.active = ( display.content['@type'] === "messageLocation" || ( display.content['@type'] === "messageVenue" )) locationPreviewLoader.active = ( display.content['@type'] === "messageLocation" || ( display.content['@type'] === "messageVenue" ))
forwardedInformationLoader.active = ( typeof display.forward_info !== "undefined" ); forwardedInformationLoader.active = messageListItem.isForwarded;
}
} }
} }
@ -549,9 +556,9 @@ Page {
id: messageBackground id: messageBackground
anchors { anchors {
left: parent.left left: parent.left
leftMargin: (chatPage.myUserId === display.sender_user_id) ? 2 * Theme.horizontalPageMargin : 0 leftMargin: messageListItem.isOwnMessage ? 2 * Theme.horizontalPageMargin : 0
right: parent.right right: parent.right
rightMargin: (chatPage.myUserId === display.sender_user_id) ? 0 : 2 * Theme.horizontalPageMargin rightMargin: messageListItem.isOwnMessage ? 0 : 2 * Theme.horizontalPageMargin
verticalCenter: parent.verticalCenter verticalCenter: parent.verticalCenter
} }
height: messageTextColumn.height + ( 2 * Theme.paddingMedium ) height: messageTextColumn.height + ( 2 * Theme.paddingMedium )
@ -559,7 +566,7 @@ Page {
color: index > ( chatView.count - chatInformation.unread_count - 1 ) ? Theme.secondaryHighlightColor : Theme.secondaryColor color: index > ( chatView.count - chatInformation.unread_count - 1 ) ? Theme.secondaryHighlightColor : Theme.secondaryColor
radius: parent.width / 50 radius: parent.width / 50
opacity: index > ( chatView.count - chatInformation.unread_count - 1 ) ? 0.5 : 0.2 opacity: index > ( chatView.count - chatInformation.unread_count - 1 ) ? 0.5 : 0.2
visible: appSettings.showStickersAsImages || display.content['@type'] !== "messageSticker" visible: appSettings.showStickersAsImages || !messageListItem.containsSticker
} }
Column { Column {
@ -590,14 +597,14 @@ Page {
id: userText id: userText
width: parent.width width: parent.width
text: display.sender_user_id !== chatPage.myUserId ? Emoji.emojify(Functions.getUserName(messageListItem.userInformation), font.pixelSize) : qsTr("You") text: !messageListItem.isOwnMessage ? Emoji.emojify(Functions.getUserName(messageListItem.userInformation), font.pixelSize) : qsTr("You")
font.pixelSize: Theme.fontSizeExtraSmall font.pixelSize: Theme.fontSizeExtraSmall
font.weight: Font.ExtraBold font.weight: Font.ExtraBold
color: (chatPage.myUserId === display.sender_user_id) ? Theme.highlightColor : Theme.primaryColor color: messageListItem.isOwnMessage ? Theme.highlightColor : Theme.primaryColor
maximumLineCount: 1 maximumLineCount: 1
elide: Text.ElideRight elide: Text.ElideRight
textFormat: Text.StyledText textFormat: Text.StyledText
horizontalAlignment: (chatPage.myUserId === display.sender_user_id) ? Text.AlignRight : Text.AlignLeft horizontalAlignment: messageListItem.isOwnMessage ? Text.AlignRight : Text.AlignLeft
visible: ( chatPage.isBasicGroup || chatPage.isSuperGroup ) && !chatPage.isChannel visible: ( chatPage.isBasicGroup || chatPage.isSuperGroup ) && !chatPage.isChannel
} }
@ -612,6 +619,7 @@ Page {
active: false active: false
asynchronous: true asynchronous: true
width: parent.width width: parent.width
height: messageListItem.isForwarded ? ( item ? item.height : Theme.itemSizeExtraSmall ) : 0
sourceComponent: Component { sourceComponent: Component {
Row { Row {
id: forwardedMessageInformationRow id: forwardedMessageInformationRow
@ -687,15 +695,15 @@ Page {
id: messageText id: messageText
width: parent.width width: parent.width
text: Emoji.emojify(Functions.getMessageText(display, false, chatPage.myUserId === display.sender_user_id), font.pixelSize) text: Emoji.emojify(Functions.getMessageText(display, false, messageListItem.isOwnMessage), font.pixelSize)
font.pixelSize: Theme.fontSizeSmall font.pixelSize: Theme.fontSizeSmall
color: (chatPage.myUserId === display.sender_user_id) ? Theme.highlightColor : Theme.primaryColor color: messageListItem.isOwnMessage ? Theme.highlightColor : Theme.primaryColor
wrapMode: Text.Wrap wrapMode: Text.Wrap
textFormat: Text.StyledText textFormat: Text.StyledText
onLinkActivated: { onLinkActivated: {
Functions.handleLink(link); Functions.handleLink(link);
} }
horizontalAlignment: (chatPage.myUserId === display.sender_user_id) ? Text.AlignRight : Text.AlignLeft horizontalAlignment: messageListItem.isOwnMessage ? Text.AlignRight : Text.AlignLeft
linkColor: Theme.highlightColor linkColor: Theme.highlightColor
visible: (text !== "") visible: (text !== "")
} }
@ -718,39 +726,39 @@ Page {
sourceComponent: webPagePreviewComponent sourceComponent: webPagePreviewComponent
} }
Component {
id: imagePreviewComponent
ImagePreview {
id: messageImagePreview
photoData: ( display.content['@type'] === "messagePhoto" ) ? display.content.photo : ""
width: parent.width
height: parent.width * 2 / 3
visible: display.content['@type'] === "messagePhoto"
}
}
Loader { Loader {
id: imagePreviewLoader id: imagePreviewLoader
active: false active: false
asynchronous: true asynchronous: true
width: parent.width width: parent.width
sourceComponent: imagePreviewComponent height: messageListItem.containsImage ? (item ? item.height : (parent.width * 2 / 3)) : 0
sourceComponent: Component {
id: imagePreviewComponent
ImagePreview {
id: messageImagePreview
photoData: messageListItem.containsImage ? display.content.photo : ""
width: parent.width
height: parent.width * 2 / 3
}
}
} }
Component { Loader
{
id: stickerPreviewLoader
active: false
asynchronous: true
x: messageListItem.isOwnMessage ? (parent.width - width) : 0
width: (appSettings.showStickersAsImages || !item) ? parent.width : item.width
height: messageListItem.containsSticker ? display.content.sticker.height : 0
sourceComponent: Component {
id: stickerPreviewComponent id: stickerPreviewComponent
StickerPreview { StickerPreview {
stickerData: ( display.content['@type'] === "messageSticker" ) ? display.content.sticker : "" id: messageStickerPreview
stickerData: messageListItem.containsSticker ? display.content.sticker : ""
} }
} }
Loader {
id: stickerPreviewLoader
active: display.content['@type'] === "messageSticker"
asynchronous: true
x: (chatPage.myUserId === display.sender_user_id) ? (parent.width - width) : 0
width: (appSettings.showStickersAsImages || !item) ? parent.width : item.width
sourceComponent: stickerPreviewComponent
} }
Component { Component {
@ -848,7 +856,7 @@ Page {
if (index === modelIndex) { if (index === modelIndex) {
console.log("[ChatModel] This message was updated, index " + index + ", updating content..."); console.log("[ChatModel] This message was updated, index " + index + ", updating content...");
messageDateText.text = getMessageStatusText(display, index, chatView.lastReadSentIndex); messageDateText.text = getMessageStatusText(display, index, chatView.lastReadSentIndex);
messageText.text = Emoji.emojify(Functions.getMessageText(display, false, chatPage.myUserId === display.sender_user_id), messageText.font.pixelSize); messageText.text = Emoji.emojify(Functions.getMessageText(display, false, messageListItem.isOwnMessage), messageText.font.pixelSize);
if(locationPreviewLoader.active && locationPreviewLoader.status === Loader.Ready) { if(locationPreviewLoader.active && locationPreviewLoader.status === Loader.Ready) {
locationPreviewLoader.item.locationData = display.content.location; locationPreviewLoader.item.locationData = display.content.location;
locationPreviewLoader.item.updatePicture() locationPreviewLoader.item.updatePicture()
@ -862,8 +870,8 @@ Page {
id: messageDateText id: messageDateText
font.pixelSize: Theme.fontSizeTiny font.pixelSize: Theme.fontSizeTiny
color: (chatPage.myUserId === display.sender_user_id) ? Theme.secondaryHighlightColor : Theme.secondaryColor color: messageListItem.isOwnMessage ? Theme.secondaryHighlightColor : Theme.secondaryColor
horizontalAlignment: (chatPage.myUserId === display.sender_user_id) ? Text.AlignRight : Text.AlignLeft horizontalAlignment: messageListItem.isOwnMessage ? Text.AlignRight : Text.AlignLeft
text: getMessageStatusText(display, index, chatView.lastReadSentIndex) text: getMessageStatusText(display, index, chatView.lastReadSentIndex)
} }
@ -1071,15 +1079,15 @@ Page {
sourceSize.height: height sourceSize.height: height
fillMode: Thumbnail.PreserveAspectCrop fillMode: Thumbnail.PreserveAspectCrop
mimeType: attachmentPreviewRow.fileProperties.mimeType mimeType: typeof attachmentPreviewRow.fileProperties !== "undefined" ? attachmentPreviewRow.fileProperties.mimeType : ""
source: attachmentPreviewRow.fileProperties.url source: typeof attachmentPreviewRow.fileProperties !== "undefined" ? attachmentPreviewRow.fileProperties.url : ""
visible: attachmentPreviewRow.isPicture || attachmentPreviewRow.isVideo visible: attachmentPreviewRow.isPicture || attachmentPreviewRow.isVideo
} }
Text { Text {
id: attachmentPreviewText id: attachmentPreviewText
font.pixelSize: Theme.fontSizeSmall font.pixelSize: Theme.fontSizeSmall
text: attachmentPreviewRow.fileProperties.fileName; text: typeof attachmentPreviewRow.fileProperties !== "undefined" ? attachmentPreviewRow.fileProperties.fileName : "";
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
maximumLineCount: 1 maximumLineCount: 1
@ -1130,7 +1138,6 @@ Page {
Row { Row {
id: newMessageRow id: newMessageRow
width: parent.width width: parent.width
height: sendMessageColumn.height + Theme.paddingMedium
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
TextArea { TextArea {