如何从 URL 加载 SVG 文件并将其用作 UIImage？

Question

随着 Xcode 12 的发布，现在支持 SVG 资源。

如果我想在我的资源目录中使用 SVG 就可以了。但是当我尝试从 URL 加载它时它不起作用，你知道吗？

let downloadURL = URL.init(string:"https://www.flaticon.com/svg/static/icons/svg/3874/3874453.svg")
image.af.setImage(withURL: downloadURL!,imageTransition: .crossDissolve(0.5))

Answer 1

首先，您对要使用的框架的描述非常不清楚。很难想象那是什么image.af.setImage。
有支持 SVG 的第三方框架，例如https://github.com/mchoe/SwiftSVG。
但我假设您对 SDK 解决方案感兴趣。

其次，您应该定义“资产”的含义。一般来说，在Xcode中，资产是应用程序内置的资源文件，因此不需要从URL下载它。

1. 您可以使用以下命令轻松加载 SVG WebKit：

let path = "https://www.flaticon.com/svg/static/icons/svg/3874/3874453.svg"
let webView = WKWebView(frame: view.bounds)
let request = URLRequest(url: URL(string: path)!)
webView.load(request)
view.addSubview(webView)

2. 如果您正在考虑使用 WebKit 以外的框架，则可以将该图像加载为Data，然后将其传递Data给您的框架：

let path = "https://www.flaticon.com/svg/static/icons/svg/3874/3874453.svg"
let data = try! Data(contentsOf: URL(string: path)!)

3. 您可以将 SVG 保存为“资源”，然后加载该本地资源。这是最优的方式。

let path = Bundle.main.path(forResource: "3874453", ofType: "svg")!
let webView = WKWebView(frame: view.bounds)
let request = URLRequest(url: URL(fileURLWithPath: path)!)
webView.load(request)
view.addSubview(webView)

完整的代码如下所示：

import UIKit
import WebKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        
        let webView = WKWebView(frame: view.bounds)
        let request = URLRequest(url: svgUrlLocal)
        //let request = URLRequest(url: svgUrlRemote)
        webView.load(request)
        view.addSubview(webView)
    }
    
    var svgUrlLocal: URL {
        let path = Bundle.main.path(forResource: "3874453", ofType: "svg")!
        return URL(fileURLWithPath: path)
    }
    
    var svgUrlRemote: URL {
        let path = "https://www.flaticon.com/svg/static/icons/svg/3874/3874453.svg"
        return URL(string: path)!
    }
}

您可以在这里下载该项目：https://github.com/gatamar/stackoverflow_answers/tree/master/so65266899