38ef3649002e2703e1cf5a44ba8eab9f
SwiftUI 动画特效之代码雨组建电影特性(项目含源码)

实战需求

SwiftUI 动画特效之代码雨组建电影特性(项目含源码)

本文价值与收获

看完本文后,您将能够作出下面的界面

代码雨组建电影特性

代码雨组建电影特性

代码雨组建电影特性

代码雨组建电影特性


基础知识

  • 按时间生成随机字符串
final class MatrixElementViewModel: ObservableObject {

    @Published var randomCG = CGSize()
    @Published var randomCharacters = [String]()

    let cgRange = CGSize(width: .random(in: -400...400), height: .random(in: -400...400))
    let characters = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "a","b","c","d","e","f","g","h","中","文","代","码","编","程","序"]

    init() {
        randomCG = cgRange
    }

    func generateRandomCharacters() {
        DispatchQueue.main.asyncAfter(deadline: .now() + 1 / 7) {
            self.randomCharacters.append(self.characters.randomElement()!)

        }
    }

}

实战代码

  1. 主界面
import SwiftUI

struct MainView: View {

    var body: some View {

        ZStack {
            Color.black.edgesIgnoringSafeArea(.all)

            ZStack {
                Group {
                    MatrixElement()
                    MatrixElement()
                    MatrixElement()
                    MatrixElement()
                    MatrixElement()
                    MatrixElement()
                    MatrixElement()
                    MatrixElement()
                    MatrixElement()
                }
            }
        }
    }
}
  1. 动画界面
    ```
    import SwiftUI

struct AnimationView: View {

var duration:Int
@State private var isAppearing = true
@ObservedObject var viewModel: MatrixElementViewModel
top Created with Sketch.