Animate display of selection panel

This commit is contained in:
Slava Monich 2020-12-06 16:50:03 +02:00
parent e295f6e082
commit 2ce1ad1f49

View file

@ -57,15 +57,11 @@ Page {
|| (chatGroupInformation.status["@type"] === "chatMemberStatusCreator" && chatGroupInformation.status.is_member) || (chatGroupInformation.status["@type"] === "chatMemberStatusCreator" && chatGroupInformation.status.is_member)
) )
property var selectedMessages: [] property var selectedMessages: []
readonly property bool isSelecting: selectedMessages.length > 0
states: [ states: [
State { State {
name: "selectMessages" name: "selectMessages"
when: selectedMessages.length > 0 when: isSelecting
PropertyChanges {
target: newMessageColumn
visible: false
opacity: 0
}
PropertyChanges { PropertyChanges {
target: chatNameText target: chatNameText
text: qsTr("Select Messages") text: qsTr("Select Messages")
@ -74,12 +70,6 @@ Page {
target: chatStatusText target: chatStatusText
text: qsTr("%Ln messages selected", "number of messages selected", chatPage.selectedMessages.length) text: qsTr("%Ln messages selected", "number of messages selected", chatPage.selectedMessages.length)
} }
PropertyChanges {
target: selectedMessagesActions
height: Theme.itemSizeMedium
active: true
opacity: 1.0//selectedMessages.length > 0 ? 1.0 : 0.5
}
PropertyChanges { PropertyChanges {
target: newMessageTextField target: newMessageTextField
focus: false focus: false
@ -107,7 +97,7 @@ Page {
} }
function updateChatPartnerStatusText() { function updateChatPartnerStatusText() {
if (chatPage.state === "selectMessages") { if (chatPage.isSelecting) {
return return
} }
var statusText = Functions.getChatPartnerStatusText(chatPartnerInformation.status['@type'], chatPartnerInformation.status.was_online); var statusText = Functions.getChatPartnerStatusText(chatPartnerInformation.status['@type'], chatPartnerInformation.status.was_online);
@ -127,7 +117,7 @@ Page {
} }
function updateGroupStatusText() { function updateGroupStatusText() {
if(chatPage.state === "selectMessages") { if (chatPage.isSelecting) {
return return
} }
if (chatOnlineMemberCount > 0) { if (chatOnlineMemberCount > 0) {
@ -644,7 +634,7 @@ Page {
height: headerRow.height height: headerRow.height
width: parent.width width: parent.width
onClicked: { onClicked: {
if(chatPage.state === "selectMessages") { if (chatPage.isSelecting) {
chatPage.selectedMessages = []; chatPage.selectedMessages = [];
} else { } else {
pageStack.navigateForward(); pageStack.navigateForward();
@ -699,7 +689,6 @@ Page {
} }
Image { Image {
id: chatSecretImage
source: "image://theme/icon-s-secure" source: "image://theme/icon-s-secure"
width: chatPage.isPortrait ? Theme.fontSizeSmall : Theme.fontSizeExtraSmall width: chatPage.isPortrait ? Theme.fontSizeSmall : Theme.fontSizeExtraSmall
height: width height: width
@ -825,7 +814,7 @@ Page {
readonly property int textColumnWidth: backgroundWidth - Theme.horizontalPageMargin readonly property int textColumnWidth: backgroundWidth - Theme.horizontalPageMargin
readonly property int messageInReplyToHeight: Theme.fontSizeExtraSmall * 2.571428571 + Theme.paddingSmall; readonly property int messageInReplyToHeight: Theme.fontSizeExtraSmall * 2.571428571 + Theme.paddingSmall;
readonly property int webPagePreviewHeight: ( (textColumnWidth * 2 / 3) + (6 * Theme.fontSizeExtraSmall) + ( 7 * Theme.paddingSmall) ) readonly property int webPagePreviewHeight: ( (textColumnWidth * 2 / 3) + (6 * Theme.fontSizeExtraSmall) + ( 7 * Theme.paddingSmall) )
readonly property bool pageIsSelecting: chatPage.state === "selectMessages" readonly property bool pageIsSelecting: chatPage.isSelecting
} }
@ -1048,12 +1037,14 @@ Page {
id: newMessageColumn id: newMessageColumn
spacing: Theme.paddingSmall spacing: Theme.paddingSmall
topPadding: Theme.paddingSmall topPadding: Theme.paddingSmall
width: parent.width - ( 2 * Theme.horizontalPageMargin )
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
visible: chatPage.hasSendPrivilege("can_send_messages") clip: true
height: visible ? implicitHeight : 0 visible: height > 0
Behavior on opacity { FadeAnimation {} } width: parent.width - ( 2 * Theme.horizontalPageMargin )
height: isNeeded ? implicitHeight : 0
Behavior on height { SmoothedAnimation { duration: 200 } }
readonly property bool isNeeded: !chatPage.isSelecting && chatPage.hasSendPrivilege("can_send_messages")
property string replyToMessageId: "0"; property string replyToMessageId: "0";
property string editMessageId: "0"; property string editMessageId: "0";
@ -1456,21 +1447,23 @@ Page {
} }
} }
} }
}
}
Loader { Loader {
id: selectedMessagesActions id: selectedMessagesActions
asynchronous: true asynchronous: true
active: false anchors.bottom: parent.bottom
height: 0 readonly property bool isNeeded: chatPage.isSelecting
opacity: 0 active: height > 0
width: parent.width - Theme.horizontalPageMargin width: parent.width
Behavior on opacity { FadeAnimation {} } height: isNeeded ? Theme.itemSizeMedium : 0
Behavior on height { SmoothedAnimation { duration: 200 } }
sourceComponent: Component { sourceComponent: Component {
Item { Item {
clip: true clip: true
IconButton { IconButton {
id: cancelSelectionButton
anchors { anchors {
left: parent.left left: parent.left
leftMargin: Theme.horizontalPageMargin leftMargin: Theme.horizontalPageMargin
@ -1482,18 +1475,17 @@ Page {
} }
} }
IconButton { Row {
id: messagesCopyButton spacing: Theme.paddingSmall
anchors { anchors {
right: messagesForwardButton.left right: parent.right
leftMargin: Theme.paddingSmall rightMargin: Theme.horizontalPageMargin
verticalCenter: parent.verticalCenter verticalCenter: parent.verticalCenter
} }
IconButton {
icon.source: "../../images/icon-m-copy.svg" icon.source: "../../images/icon-m-copy.svg"
icon.sourceSize { icon.sourceSize: Qt.size(Theme.iconSizeMedium, Theme.iconSizeMedium)
width: Theme.iconSizeMedium
height: Theme.iconSizeMedium
}
onClicked: { onClicked: {
Clipboard.text = Functions.getMessagesArrayText(chatPage.selectedMessages); Clipboard.text = Functions.getMessagesArrayText(chatPage.selectedMessages);
appNotification.show(qsTr("%Ln messages have been copied", "", selectedMessages.length)); appNotification.show(qsTr("%Ln messages have been copied", "", selectedMessages.length));
@ -1502,17 +1494,10 @@ Page {
} }
IconButton { IconButton {
id: messagesForwardButton visible: !chatPage.isSecretChat && selectedMessages.every(function(message){
return message.can_be_forwarded
anchors {
right: messagesDeleteButton.left
leftMargin: visible ? Theme.paddingSmall : 0
verticalCenter: parent.verticalCenter
}
visible: selectedMessages.every(function(message){
return message.can_be_forwarded && !chatPage.isSecretChat
}) })
width: visible ? Theme.itemSizeMedium : 0 icon.sourceSize: Qt.size(Theme.iconSizeMedium, Theme.iconSizeMedium)
icon.source: "image://theme/icon-m-forward" icon.source: "image://theme/icon-m-forward"
onClicked: { onClicked: {
var ids = Functions.getMessagesArrayIds(chatPage.selectedMessages) var ids = Functions.getMessagesArrayIds(chatPage.selectedMessages)
@ -1528,18 +1513,11 @@ Page {
} }
IconButton { IconButton {
id: messagesDeleteButton
anchors {
right: parent.right
leftMargin: visible ? Theme.paddingSmall : 0
verticalCenter: parent.verticalCenter
}
icon.source: "image://theme/icon-m-delete" icon.source: "image://theme/icon-m-delete"
visible: chatInformation.id === chatPage.myUserId || selectedMessages.every(function(message){ visible: chatInformation.id === chatPage.myUserId || selectedMessages.every(function(message){
return message.can_be_deleted_for_all_users return message.can_be_deleted_for_all_users
}) })
width: visible ? Theme.itemSizeMedium : 0 icon.sourceSize: Qt.size(Theme.iconSizeMedium, Theme.iconSizeMedium)
onClicked: { onClicked: {
var ids = Functions.getMessagesArrayIds(selectedMessages); var ids = Functions.getMessagesArrayIds(selectedMessages);
var chatId = chatInformation.id var chatId = chatInformation.id
@ -1555,5 +1533,3 @@ Page {
} }
} }
} }
}