From 352493f10022b7b57e2be883039d017ffa67dd28 Mon Sep 17 00:00:00 2001 From: John Gibbon Date: Sun, 22 Nov 2020 00:39:49 +0100 Subject: [PATCH] Use TruncationMode.Fade --- qml/components/InReplyToRow.qml | 17 ++------- qml/components/MessageListViewItem.qml | 27 +++----------- qml/components/MessageOverlayFlickable.qml | 5 +-- qml/components/PhotoTextsListItem.qml | 37 ++++--------------- qml/components/PinnedMessageItem.qml | 8 ++-- qml/components/StickerPicker.qml | 15 +++----- qml/components/WebPagePreview.qml | 18 ++++----- .../ChatInformationTabItemMembersGroups.qml | 1 - qml/pages/ChatPage.qml | 34 +++++++++-------- qml/pages/CoverPage.qml | 5 +-- 10 files changed, 59 insertions(+), 108 deletions(-) diff --git a/qml/components/InReplyToRow.qml b/qml/components/InReplyToRow.qml index 225e7fc..3756852 100644 --- a/qml/components/InReplyToRow.qml +++ b/qml/components/InReplyToRow.qml @@ -58,33 +58,24 @@ Row { spacing: Theme.paddingSmall width: parent.width - ( inReplyToRow.editable ? ( Theme.paddingSmall + removeInReplyToIconButton.width ) : 0 ) - Text { + Label { id: inReplyToUserText width: parent.width font.pixelSize: Theme.fontSizeExtraSmall font.weight: Font.ExtraBold - color: Theme.primaryColor maximumLineCount: 1 - elide: Text.ElideRight + truncationMode: TruncationMode.Fade textFormat: Text.StyledText horizontalAlignment: Text.AlignLeft } - Text { + Label { id: inReplyToMessageText font.pixelSize: Theme.fontSizeExtraSmall - color: Theme.primaryColor width: parent.width - elide: Text.ElideRight textFormat: Text.StyledText - onTruncatedChanged: { - // There is obviously a bug in QML in truncating text with images. - // We simply remove Emojis then... - if (truncated) { - text = text.replace(/\]+\/\>/g, ""); - } - } + truncationMode: TruncationMode.Fade } } diff --git a/qml/components/MessageListViewItem.qml b/qml/components/MessageListViewItem.qml index f30454b..1c08c63 100644 --- a/qml/components/MessageListViewItem.qml +++ b/qml/components/MessageListViewItem.qml @@ -254,7 +254,7 @@ ListItem { anchors.centerIn: messageBackground - Text { + Label { id: userText width: parent.width @@ -263,7 +263,7 @@ ListItem { font.weight: Font.ExtraBold color: messageListItem.textColor maximumLineCount: 1 - elide: Text.ElideRight + truncationMode: TruncationMode.Fade textFormat: Text.StyledText horizontalAlignment: messageListItem.textAlign visible: precalculatedValues.showUserInfo @@ -341,38 +341,23 @@ ListItem { Column { spacing: Theme.paddingSmall width: parent.width - forwardedThumbnail.width - Theme.paddingSmall - Text { + Label { font.pixelSize: Theme.fontSizeExtraSmall - color: Theme.primaryColor width: parent.width font.italic: true - elide: Text.ElideRight + truncationMode: TruncationMode.Fade textFormat: Text.StyledText text: qsTr("Forwarded Message") - onTruncatedChanged: { - // There is obviously a bug in QML in truncating text with images. - // We simply remove Emojis then... - if (truncated) { - text = text.replace(/\]+\/\>/g, ""); - } - } } - Text { + Label { id: forwardedChannelText font.pixelSize: Theme.fontSizeExtraSmall color: Theme.primaryColor width: parent.width font.bold: true - elide: Text.ElideRight + truncationMode: TruncationMode.Fade textFormat: Text.StyledText text: Emoji.emojify(forwardedMessageInformationRow.otherChatInformation.title, font.pixelSize) - onTruncatedChanged: { - // There is obviously a bug in QML in truncating text with images. - // We simply remove Emojis then... - if (truncated) { - text = text.replace(/\]+\/\>/g, ""); - } - } } } } diff --git a/qml/components/MessageOverlayFlickable.qml b/qml/components/MessageOverlayFlickable.qml index c70f8a1..13028db 100644 --- a/qml/components/MessageOverlayFlickable.qml +++ b/qml/components/MessageOverlayFlickable.qml @@ -109,7 +109,7 @@ Flickable { width: Theme.itemSizeLarge height: Theme.itemSizeLarge } - Text { + Label { id: overlayMessageUserText width: parent.width - overlayMessagePictureThumbnail.width @@ -117,9 +117,8 @@ Flickable { text: messageOverlayFlickable.isOwnMessage ? qsTr("You") : Emoji.emojify(Functions.getUserName(messageOverlayFlickable.userInformation), font.pixelSize) font.pixelSize: Theme.fontSizeExtraLarge font.weight: Font.ExtraBold - color: Theme.primaryColor maximumLineCount: 1 - elide: Text.ElideRight + truncationMode: TruncationMode.Fade textFormat: Text.StyledText } } diff --git a/qml/components/PhotoTextsListItem.qml b/qml/components/PhotoTextsListItem.qml index ceba640..a544642 100644 --- a/qml/components/PhotoTextsListItem.qml +++ b/qml/components/PhotoTextsListItem.qml @@ -78,63 +78,42 @@ ListItem { width: parent.width * 5 / 6 - Theme.horizontalPageMargin spacing: Theme.paddingSmall - Text { + Label { id: primaryText textFormat: Text.StyledText font.pixelSize: Theme.fontSizeMedium - color: Theme.primaryColor - elide: Text.ElideRight + truncationMode: TruncationMode.Fade width: parent.width - onTruncatedChanged: { - // There is obviously a bug in QML in truncating text with images. - // We simply remove Emojis then... - if (truncated) { - text = text.replace(/\]+\/\>/g, ""); - } - } } Row { id: additionalTextRow width: parent.width spacing: Theme.paddingSmall - Text { + Label { id: prologSecondaryText font.pixelSize: Theme.fontSizeExtraSmall width: Math.min(implicitWidth, parent.width) elide: Text.ElideRight color: Theme.highlightColor textFormat: Text.StyledText - onTruncatedChanged: { - // There is obviously a bug in QML in truncating text with images. - // We simply remove Emojis then... - if (truncated) { - text = text.replace(/\]+\/\>/g, ""); - } - } + truncationMode: TruncationMode.Fade } - Text { + Label { id: secondaryText font.pixelSize: Theme.fontSizeExtraSmall - color: Theme.primaryColor width: parent.width - Theme.paddingMedium - prologSecondaryText.width - elide: Text.ElideRight + truncationMode: TruncationMode.Fade textFormat: Text.StyledText - onTruncatedChanged: { - // There is obviously a bug in QML in truncating text with images. - // We simply remove Emojis then... - if (truncated) { - text = text.replace(/\]+\/\>/g, ""); - } - } } } - Text { + Label { id: tertiaryText width: parent.width font.pixelSize: Theme.fontSizeTiny color: Theme.secondaryColor + truncationMode: TruncationMode.Fade } } } diff --git a/qml/components/PinnedMessageItem.qml b/qml/components/PinnedMessageItem.qml index 9040a8a..8a6f41a 100644 --- a/qml/components/PinnedMessageItem.qml +++ b/qml/components/PinnedMessageItem.qml @@ -77,7 +77,7 @@ Item { spacing: Theme.paddingSmall width: parent.width - Text { + Label { id: pinnedMessageUserText width: parent.width @@ -85,18 +85,18 @@ Item { font.weight: Font.ExtraBold color: Theme.primaryColor maximumLineCount: 1 - elide: Text.ElideRight + truncationMode: TruncationMode.Fade textFormat: Text.StyledText horizontalAlignment: Text.AlignLeft } - Text { + Label { id: pinnedMessageText font.pixelSize: Theme.fontSizeExtraSmall color: Theme.primaryColor width: parent.width - elide: Text.ElideRight + truncationMode: TruncationMode.Fade maximumLineCount: 1 textFormat: Text.StyledText } diff --git a/qml/components/StickerPicker.qml b/qml/components/StickerPicker.qml index 1cd6172..bc4eb93 100644 --- a/qml/components/StickerPicker.qml +++ b/qml/components/StickerPicker.qml @@ -63,13 +63,12 @@ Item { id: stickerPickerColumn spacing: Theme.paddingMedium width: stickerPickerFlickable.width - Text { + Label { font.pixelSize: Theme.fontSizeMedium font.bold: true - color: Theme.primaryColor width: parent.width maximumLineCount: 1 - elide: Text.ElideRight + truncationMode: TruncationMode.Fade text: qsTr("Recently used") } @@ -122,13 +121,12 @@ Item { Column { spacing: Theme.paddingMedium width: parent.width - Text { + Label { font.pixelSize: Theme.fontSizeMedium font.bold: true - color: Theme.primaryColor width: parent.width maximumLineCount: 1 - elide: Text.ElideRight + truncationMode: TruncationMode.Fade text: modelData.title } @@ -159,12 +157,11 @@ Item { } } } - Text { + Label { font.pixelSize: Theme.fontSizeHuge - color: Theme.primaryColor anchors.fill: parent maximumLineCount: 1 - elide: Text.ElideRight + truncationMode: TruncationMode.Fade text: Emoji.emojify(modelData.emoji, font.pixelSize) visible: !modelData.thumbnail.photo.local.is_downloading_completed } diff --git a/qml/components/WebPagePreview.qml b/qml/components/WebPagePreview.qml index 3437110..e90178d 100644 --- a/qml/components/WebPagePreview.qml +++ b/qml/components/WebPagePreview.qml @@ -70,7 +70,7 @@ Column { } } - Text { + Label { id: siteNameText width: parent.width @@ -78,35 +78,33 @@ Column { font.pixelSize: webPagePreviewColumn.largerFontSize ? Theme.fontSizeSmall : Theme.fontSizeExtraSmall font.bold: true color: Theme.secondaryHighlightColor - elide: Text.ElideRight + truncationMode: TruncationMode.Fade maximumLineCount: 1 textFormat: Text.StyledText visible: (text !== "") } - Text { + Label { id: titleText width: parent.width text: webPageData.title ? Emoji.emojify(webPageData.title, font.pixelSize) : "" font.pixelSize: webPagePreviewColumn.largerFontSize ? Theme.fontSizeSmall : Theme.fontSizeExtraSmall font.bold: true - color: Theme.primaryColor - elide: Text.ElideRight + truncationMode: TruncationMode.Fade wrapMode: Text.Wrap maximumLineCount: 2 textFormat: Text.StyledText visible: (text !== "") } - Text { + Label { id: descriptionText width: parent.width text: webPageData.description ? Emoji.emojify(webPageData.description, font.pixelSize) : "" font.pixelSize: webPagePreviewColumn.largerFontSize ? Theme.fontSizeSmall : Theme.fontSizeExtraSmall - color: Theme.primaryColor - elide: Text.ElideRight + truncationMode: TruncationMode.Fade wrapMode: Text.Wrap maximumLineCount: 3 textFormat: Text.StyledText @@ -146,7 +144,7 @@ Column { } } - Text { + Label { id: noPreviewAvailableText width: parent.width @@ -154,7 +152,7 @@ Column { font.pixelSize: webPagePreviewColumn.largerFontSize ? Theme.fontSizeExtraSmall : Theme.fontSizeTiny font.italic: true color: Theme.secondaryColor - elide: Text.ElideRight + truncationMode: TruncationMode.Fade wrapMode: Text.Wrap maximumLineCount: 1 textFormat: Text.StyledText diff --git a/qml/components/chatInformationPage/ChatInformationTabItemMembersGroups.qml b/qml/components/chatInformationPage/ChatInformationTabItemMembersGroups.qml index 873302c..9d9243f 100644 --- a/qml/components/chatInformationPage/ChatInformationTabItemMembersGroups.qml +++ b/qml/components/chatInformationPage/ChatInformationTabItemMembersGroups.qml @@ -89,7 +89,6 @@ ChatInformationTabItemBase { tertiaryText { maximumLineCount: 1 text: user.type["@type"] === "userTypeBot" ? (Emoji.emojify("🤖 "+bot_info.description, tertiaryText.font.pixelSize)) : Functions.getChatPartnerStatusText(user.status["@type"], user.status.was_online); - elide: Text.ElideRight } onClicked: { diff --git a/qml/pages/ChatPage.qml b/qml/pages/ChatPage.qml index 649c1be..0a33c4c 100644 --- a/qml/pages/ChatPage.qml +++ b/qml/pages/ChatPage.qml @@ -603,15 +603,15 @@ Page { Row { id: headerRow width: parent.width - (3 * Theme.horizontalPageMargin) - height: chatOverviewColumn.height + ( chatPage.isPortrait ? (2 * Theme.paddingMedium) : (2 * Theme.paddingSmall) ) + height: chatOverviewItem.height + ( chatPage.isPortrait ? (2 * Theme.paddingMedium) : (2 * Theme.paddingSmall) ) anchors.horizontalCenter: parent.horizontalCenter spacing: Theme.paddingMedium ProfileThumbnail { id: chatPictureThumbnail replacementStringHint: chatNameText.text - width: chatOverviewColumn.height - height: chatOverviewColumn.height + width: chatOverviewItem.height + height: chatOverviewItem.height anchors.bottom: parent.bottom anchors.bottomMargin: chatPage.isPortrait ? Theme.paddingMedium : Theme.paddingSmall @@ -626,34 +626,38 @@ Page { } } - Column { - id: chatOverviewColumn + Item { + id: chatOverviewItem width: parent.width - chatPictureThumbnail.width - Theme.paddingMedium + height: chatNameText.height + chatStatusText.height anchors.bottom: parent.bottom anchors.bottomMargin: chatPage.isPortrait ? Theme.paddingMedium : Theme.paddingSmall - Text { + Label { id: chatNameText + width: Math.min(implicitWidth, parent.width) + anchors.right: parent.right text: chatInformation.title !== "" ? Emoji.emojify(chatInformation.title, font.pixelSize) : qsTr("Unknown") textFormat: Text.StyledText font.pixelSize: chatPage.isPortrait ? Theme.fontSizeLarge : Theme.fontSizeMedium font.family: Theme.fontFamilyHeading color: Theme.highlightColor - elide: Text.ElideRight - width: parent.width + truncationMode: TruncationMode.Fade maximumLineCount: 1 - horizontalAlignment: Text.AlignRight } - Text { + Label { id: chatStatusText + width: Math.min(implicitWidth, parent.width) + anchors { + right: parent.right + bottom: parent.bottom + } text: "" textFormat: Text.StyledText font.pixelSize: chatPage.isPortrait ? Theme.fontSizeExtraSmall : Theme.fontSizeTiny font.family: Theme.fontFamilyHeading color: headerMouseArea.pressed ? Theme.secondaryHighlightColor : Theme.secondaryColor - elide: Text.ElideRight - width: parent.width + truncationMode: TruncationMode.Fade maximumLineCount: 1 - horizontalAlignment: Text.AlignRight } } } @@ -1093,14 +1097,14 @@ Page { visible: attachmentPreviewRow.isPicture || attachmentPreviewRow.isVideo } - Text { + Label { id: attachmentPreviewText font.pixelSize: Theme.fontSizeSmall text: typeof attachmentPreviewRow.fileProperties !== "undefined" ? attachmentPreviewRow.fileProperties.fileName || "" : ""; anchors.verticalCenter: parent.verticalCenter maximumLineCount: 1 - elide: Text.ElideRight + truncationMode: TruncationMode.Fade color: Theme.secondaryColor visible: attachmentPreviewRow.isDocument } diff --git a/qml/pages/CoverPage.qml b/qml/pages/CoverPage.qml index 5df9580..9e5df33 100644 --- a/qml/pages/CoverPage.qml +++ b/qml/pages/CoverPage.qml @@ -120,15 +120,14 @@ CoverBackground { color: Theme.primaryColor text: Functions.getShortenedCount(coverPage.unreadMessages) } - Text { + Label { id: unreadMessagesText font.pixelSize: Theme.fontSizeSmall - color: Theme.primaryColor width: parent.width - unreadMessagesCountText.width - Theme.paddingMedium wrapMode: Text.Wrap anchors.verticalCenter: unreadMessagesCountText.verticalCenter maximumLineCount: 2 - elide: Text.ElideRight + truncationMode: TruncationMode.Fade } }