2017-05-10 27 views
1

我有一個UIButton,我想通過訪問其titleLabel屬性來更改其文本。然而,我希望按鈕改變文字的方式是首先縮小到非常小的尺寸,然後在不可見時立即改變,然後縮小。看過這裏的多個帖子後,我已經達到了這個:如何延遲後動畫UILabel的文本?

let changeText = CATransition(); 
    changeText.type = kCATransitionReveal; 
    changeText.duration = 0.0; 
    changeText.timingFunction = CAMediaTimingFunction(name:kCAMediaTimingFunctionLinear); 
    submitButton.titleLabel?.layer.add(changeText, forKey: "changeTextTransition"); 


    UIView.animateKeyframes(withDuration: 0.6, delay: 0, options: .calculationModeLinear, animations: { 
     //Zzzeeeewwwwwwwwww 
     UIView.addKeyframe(withRelativeStartTime: 0.0, relativeDuration: 0.5, animations: { 
      self.submitButton.titleLabel?.transform = self.submitButton.titleLabel!.transform.scaledBy(x: 0.001, y: 0.001); 
     }) 


     UIView.addKeyframe(withRelativeStartTime: 0.5, relativeDuration: 0.0, animations: { 
      self.submitButton.titleLabel?.text = "Green"; 
     }) 

     //Wwwwwweeeeeeyyyyyppp 
     UIView.addKeyframe(withRelativeStartTime: 0.5, relativeDuration: 0.5, animations: { 
      self.submitButton.titleLabel?.transform = self.submitButton.titleLabel!.transform.scaledBy(x: 1000, y: 1000); 
     }) 
    }, completion: nil) 

問題是,這是行不通的。當標籤縮小時,我得到的是「New Text」字樣的快速閃爍,然後當它縮小時,它仍然是「舊文本」。這很奇怪,我甚至無法開始圍繞什麼可能是原因。我認爲發生的事情是,它在新文本縮小之前(不知道爲什麼,因爲我指定了duration = 0),然後增長回舊文本。

這裏是什麼樣子(有一些背景顏色的變化,我上面略):

Weird Bug

+0

嘗試將'fillMode'設置爲'kCAFillModeBoth'。 –

+0

我知道這並不能回答你的問題,但我在定義複雜的動畫和使用https://github.com/airbnb/lottie-ios顯示它們方面有着豐富的經驗。 Lottie需要一個由https://github.com/bodymovin/bodymovin創建的基於後續效果文件的json文件。即使你沒有任何效果技能,你也可以在fivver上完成這樣簡單的工作。 –

+0

@JonRose沒有工作。不用找了。 – QuantumHoneybees

回答

2

首先,對於包括在你的代碼中的註釋音效祝賀,慶幸它不只是我,這樣做。

標籤的文本屬性不能動畫,所以它立即應用,破壞你的動畫。

一個解決方案,我使用很多複雜的動畫,是使用快照。在動畫開始時,創建標籤的快照,然後將標籤的Alpha設置爲零並更新文本。然後,將標籤和快照的變形一起動畫,當它們很小時,使標籤可見並且快照不可見,然後進行動畫備份。

這聽起來比它更復雜的,這裏的代碼在操場運行它:

import UIKit 
import PlaygroundSupport 

let view = UIView(frame: CGRect(x: 0, y: 0, width: 400, height: 400)) 
view.backgroundColor = .blue 
PlaygroundPage.current.liveView = view 

let label = UILabel(frame: CGRect(x: 100, y: 100, width: 200, height: 200)) 
label.text = "Hello" 
label.font = UIFont.systemFont(ofSize: 50) 
label.textAlignment = .center 
label.textColor = .white 
view.addSubview(label) 

let snapshot = label.snapshotView(afterScreenUpdates: true)! 
view.addSubview(snapshot) 
snapshot.frame = label.frame 
label.alpha = 0 
label.text = "Goodbye" 

UIView.animateKeyframes(withDuration: 2, delay: 0, options: [.repeat, .autoreverse], animations: { 
    UIView.addKeyframe(withRelativeStartTime: 0, relativeDuration: 0.45) { 
     label.transform = CGAffineTransform(scaleX: 0.01, y: 0.01) 
     snapshot.transform = label.transform 
    } 

    UIView.addKeyframe(withRelativeStartTime: 0.45, relativeDuration: 0.1) { 
     label.alpha = 1.0 
     snapshot.alpha = 0.0 
    } 

    UIView.addKeyframe(withRelativeStartTime: 0.55, relativeDuration: 0.45) { 
     label.transform = CGAffineTransform.identity 
    } 
}) { _ in 
    snapshot.removeFromSuperview() 
} 

,讓你這個結果:

enter image description here

這不是我清楚你正在嘗試使用CATransition--除非你還在尋找另一種效果,那對你的事業沒有幫助。

+0

哈哈,終於有人欣賞我的內容豐富的評論!顯然,當我的視圖是'UIButton'時,這不起作用。一切工作完美,直到您設置按鈕/標籤的文本的行。由於某些原因,它不會將文本分配給按鈕的標籤。 – QuantumHoneybees

+0

我有一個打印(button.titleLabel.text)右下方的任務線,它顯然是文本仍然是舊文本。 – QuantumHoneybees

+1

Nvm,固定。我不得不使用'setTitle'而不是'button.titleLabel.text'。謝謝!!!!!! – QuantumHoneybees