如何在 Swift 中的位置上设置加扰字母的动画？

Posted 2023-03-10

【中文标题】如何在 Swift 中的位置上设置加扰字母的动画？

【英文标题】：How to animate scrambling letters on its position in Swift?

【发布时间】：2017-06-15 06:12:15

【问题描述】：

我想创建一个动画，其中随机字母在其位置打乱并在特定字母处停止。 这可以使用 UIView.animate 来实现吗？ 下面给出了一个粗略的想法。

【问题讨论】：

如果我写了这个代码的答案，它只会随机打乱字母并具有不同的长度，但不能随机形成单词，那可以吗？我真的很喜欢这个主意。

你能检查这两个链接并告诉我你是否想要这样的东西吗？ github.com/franklinsch/iosDrawTextAnimationgithub.com/chuganzy/ShuffleTextLabel

@AaronZheng 谢谢，是的，它会有所帮助。

【参考方案1】：

真的很喜欢这个灵感。仍然有两种方法可以将其放入您的应用程序中： 1) 这是我为您的实例创建的代码： 导入 UIKit

class ViewController: UIViewController 
    let listOfRandomLetters = ["@", "%", "*", "^", "1", "2", "3", " ", " "]
    var textNeedDisplaying = ["String", "Other Person", "Sample", "String", "Other Person", "Sample", "String", "Other Person", "Sample", "String", "Other Person", "Sample", "String", "Other Person", "Sample", "String", "Other Person", "Sample", "String", "Other Person", "Sample"]
    var newList: [String] = []
    var incrementer = 0
    var internalTimer: Timer?
    var timer: Timer?
    var mainTimer: Timer?
    @IBOutlet weak var animatingLabel: UILabel!
    override func viewDidAppear(_ animated: Bool) 
        schedule()
    

    func schedule() 
        //Main Timer interval usually adds up the other two intervals
        self.mainTimer = Timer.scheduledTimer(withTimeInterval: 1, repeats: true, block:  _ in
            //Play around with the time Intervals
            self.internalTimer = Timer.scheduledTimer(withTimeInterval: 0.1, repeats: true, block:  _ in
                for _ in 0...arc4random_uniform(UInt32(10)) + 1 
                    let randomNumber = arc4random_uniform(UInt32(self.listOfRandomLetters.count - 1))
                    self.newList.append(self.listOfRandomLetters[Int(randomNumber)])
                
                self.animatingLabel.text = self.newList.joined()
                self.newList.removeAll()
            )
            //Play around with the time Intervals
            self.timer = Timer.scheduledTimer(withTimeInterval: 0.7, repeats: false, block:  _ in
                if self.incrementer != self.textNeedDisplaying.count - 1 
                    self.internalTimer?.invalidate()
                    self.animatingLabel.text = self.textNeedDisplaying[self.incrementer]
                    self.incrementer += 1

                 else 
                    self.timer?.invalidate()
                    self.internalTimer?.invalidate()
                    self.mainTimer?.invalidate()
                    self.animatingLabel.text = "DONE"
                
            )
        )
    

如果您想让单个字母动画，请告诉我。我会做到的...确保标签的宽度限制足够大以适合您的文字。另外，如果代码可以更简洁或更好，请告诉我。

2) 使用 Lottie 和后期效果进行更自定义的过渡。如果您对此感兴趣，请告诉我：链接：https://airbnb.design/lottie/。

【讨论】：

想知道这是否可以使用 CADisplayLink 而不是计时器来完成！