如何在SwiftUI中播放SVGA动画？需兼容iOS14系统

要在iOS14的SwiftUI中播放SVGA动画，核心思路是通过UIViewRepresentable封装成熟的SVGA播放库（比如SVGAPlayer）——SwiftUI本身没有原生支持SVGA的组件，而SVGAPlayer支持iOS8及以上系统，完全兼容iOS14。

具体实现步骤： #

1. 集成SVGAPlayer库

可以通过两种方式完成集成：

• CocoaPods：在Podfile中添加

  pod 'SVGAPlayer'
  

  执行pod install完成依赖安装。
• Swift Package Manager：在Xcode中添加依赖仓库https://github.com/svga/SVGAPlayer-iOS.git，选择兼容iOS14的版本即可。

2. 封装SwiftUI可用的SVGA播放组件

创建遵循UIViewRepresentable的结构体，将原生SVGAPlayerView包装为SwiftUI视图：

import SwiftUI
import SVGAPlayer

struct SVGAPlayerViewRepresentable: UIViewRepresentable {
    var svgaURL: URL
    var isPlaying: Bool
    
    func makeUIView(context: Context) -> SVGAPlayerView {
        let playerView = SVGAPlayerView()
        // 加载指定URL的SVGA资源
        let parser = SVGAParser()
        parser.parse(with: svgaURL) { videoItem in
            guard let item = videoItem else { return }
            playerView.videoItem = item
            playerView.loopCount = 0 // 设置为0表示无限循环，按需调整
            if isPlaying {
                playerView.startAnimation()
            }
        }
        return playerView
    }
    
    func updateUIView(_ uiView: SVGAPlayerView, context: Context) {
        // 根据状态控制播放/暂停
        if isPlaying && !uiView.isAnimating {
            uiView.startAnimation()
        } else if !isPlaying {
            uiView.pauseAnimation()
        }
    }
}

3. 在SwiftUI视图中调用组件

直接传入你的SVGA文件URL即可使用：

struct ContentView: View {
    @State private var isPlaying = true
    
    var body: some View {
        SVGAPlayerViewRepresentable(
            svgaURL: URL(string: "https://iulia.iwlive.club/ng/ring3d3.svga")!,
            isPlaying: isPlaying
        )
        .frame(width: 200, height: 200) // 按需调整动画视图尺寸
    }
}

注意事项： #

• iOS14默认允许HTTPS请求，无需额外配置ATS；
• 可添加解析失败的错误处理逻辑，比如展示占位视图；
• 若需要控制动画播放进度、停止动画等，可在封装组件中扩展对应的方法。

内容的提问来源于stack exchange，提问作者GorCat