Slightly improve message background animation

This commit is contained in:
Ali 2021-04-13 22:56:49 +04:00
parent d26313f99a
commit 7cad5c1b86
3 changed files with 45 additions and 7 deletions

View File

@ -240,8 +240,16 @@ class ChatMessageBackground: ASDisplayNode {
self.outlineImageNode.layer.animateAlpha(from: 0.0, to: 1.0, duration: 0.1)
self.view.addSubview(sourceView)
sourceView.frame = CGRect(origin: CGPoint(x: 0.0, y: 0.0), size: sourceView.bounds.size)
sourceView.layer.animateAlpha(from: 1.0, to: 0.0, duration: 0.15, removeOnCompletion: false, completion: { [weak sourceView] _ in
let wasMaskNode = self.maskMode
if let wasMaskNode = wasMaskNode, !wasMaskNode {
self.setMaskMode(true)
}
sourceView.layer.animateAlpha(from: 1.0, to: 0.0, duration: 0.15, removeOnCompletion: false, completion: { [weak self, weak sourceView] _ in
if let wasMaskNode = wasMaskNode, !wasMaskNode {
self?.setMaskMode(false)
}
sourceView?.removeFromSuperview()
})

View File

@ -63,6 +63,8 @@ final class ChatMessageBubbleBackdrop: ASDisplayNode {
private var maskView: UIImageView?
private var fixedMaskMode: Bool?
var hasImage: Bool {
return self.backgroundContent.contents != nil
}
@ -94,7 +96,9 @@ final class ChatMessageBubbleBackdrop: ASDisplayNode {
}
}
func setType(type: ChatMessageBackgroundType, theme: ChatPresentationThemeData, mediaBox: MediaBox, essentialGraphics: PrincipalThemeEssentialGraphics, maskMode: Bool) {
func setType(type: ChatMessageBackgroundType, theme: ChatPresentationThemeData, mediaBox: MediaBox, essentialGraphics: PrincipalThemeEssentialGraphics, maskMode inputMaskMode: Bool) {
let maskMode = self.fixedMaskMode ?? inputMaskMode
if self.currentType != type || self.theme != theme || self.currentMaskMode != maskMode || self.essentialGraphics !== essentialGraphics {
self.currentType = type
self.theme = theme
@ -149,10 +153,31 @@ final class ChatMessageBubbleBackdrop: ASDisplayNode {
self.backgroundContent.layer.animateSpring(from: NSValue(cgPoint: CGPoint(x: 0.0, y: value)), to: NSValue(cgPoint: CGPoint()), keyPath: "position", duration: duration, initialVelocity: 0.0, damping: damping, additive: true)
}
func updateFrame(_ value: CGRect, transition: ContainedViewLayoutTransition) {
func updateFrame(_ value: CGRect, transition: ContainedViewLayoutTransition, completion: @escaping () -> Void = {}) {
if let maskView = self.maskView {
transition.updateFrame(view: maskView, frame: CGRect(origin: CGPoint(x: 0.0, y: 0.0), size: CGSize(width: value.size.width + maskInset * 2.0, height: value.size.height + maskInset * 2.0)))
transition.updateFrame(view: maskView, frame: CGRect(origin: CGPoint(x: 0.0, y: 0.0), size: CGSize(width: value.size.width, height: value.size.height)).insetBy(dx: -maskInset, dy: -maskInset))
}
transition.updateFrame(node: self, frame: value, completion: { _ in
completion()
})
}
func animateFrom(sourceView: UIView, mediaBox: MediaBox, transition: ContainedViewLayoutTransition) {
if transition.isAnimated {
let wasMaskMode = self.currentMaskMode
if let wasMaskMode = wasMaskMode, !wasMaskMode {
self.fixedMaskMode = true
self.setMaskMode(true, mediaBox: mediaBox)
}
let previousFrame = self.frame
self.updateFrame(CGRect(origin: previousFrame.origin, size: sourceView.frame.size), transition: .immediate)
self.updateFrame(previousFrame, transition: transition, completion: { [weak self] in
if let wasMaskMode = wasMaskMode, !wasMaskMode {
self?.fixedMaskMode = nil
self?.setMaskMode(false, mediaBox: mediaBox)
}
})
}
transition.updateFrame(node: self, frame: value)
}
}

View File

@ -650,8 +650,13 @@ class ChatMessageBubbleItemNode: ChatMessageItemView, ChatMessagePreviewItemNode
}
func animateContentFromTextInputField(textInput: ChatMessageTransitionNode.Source.TextInput, transition: ContainedViewLayoutTransition) {
guard let item = self.item else {
return
}
let widthDifference = self.backgroundNode.frame.width - textInput.backgroundView.frame.width
textInput.backgroundView.frame = CGRect(origin: CGPoint(x: 0.0, y: 0.0), size: textInput.backgroundView.bounds.size)
self.backgroundWallpaperNode.animateFrom(sourceView: textInput.backgroundView, mediaBox: item.context.account.postbox.mediaBox, transition: transition)
self.backgroundNode.animateFrom(sourceView: textInput.backgroundView, transition: transition)
for contentNode in self.contentNodes {