Comment afficher.svg image en utilisant swift

j'en ai un .svg fichier image que je veux afficher dans mon projet.

j'ai essayé D'utiliser UIImageView, qui fonctionne pour le .png et .formats d'image jpg, mais pas pour le .extension svg. Est-il possible d'afficher un .svg image en utilisant UIWebView ou UIImageView ?

20
demandé sur Priyanka Kanse 2016-02-29 07:10:37

8 réponses

essayez ce code

var path: String = NSBundle.mainBundle().pathForResource("nameOfFile", ofType: "svg")!

        var url: NSURL = NSURL.fileURLWithPath(path)  //Creating a URL which points towards our path

       //Creating a page request which will load our URL (Which points to our path)
        var request: NSURLRequest = NSURLRequest(URL: url)
       webView.loadRequest(request)  //Telling our webView to load our above request
9
répondu Komal Kamble 2016-02-29 10:51:48

Vous pouvez utiliser SVGKit par exemple.

1) L'intégrer selon les instructions. Glisser-déposer le fichier .cadre de fichier est rapide et facile.

2) Assurez-vous d'avoir un en-tête de pontage de fichier Objectif-C pour Swift bridge.h à importer le code:

#import <SVGKit/SVGKit.h>
#import <SVGKit/SVGKImage.h>

3) Utilisez le framework comme ceci, en supposant que dataFromInternet est NSData, précédemment téléchargé à partir du réseau:

let anSVGImage: SVGKImage = SVGKImage(data: dataFromInternet)
myIUImageView.image = anSVGImage.UIImage

le framework permet également d'initer un SVGKImage d'autres sources différentes, par exemple, il peut télécharger l'image pour vous lorsque vous lui fournissez L'URL. Mais dans mon cas, il s'est écrasé en cas d'url inaccessible, il s'est avéré être mieux de gérer le réseau par moi-même. Plus d'infos sur ici.

9
répondu Vitalii 2016-07-01 18:46:03

il n'y a pas de support intégré pour SVG dans Swift. Nous devons donc utiliser d'autres bibliothèques.

les bibliothèques SVG simples dans swift sont:

1)SwiftSVG Bibliothèque

Il vous donne plus d'options pour l'Importation en tant que UIView, CAShapeLayer, Chemin, etc

pour modifier votre couleur SVG et importer en tant Qu'UIImage vous pouvez utiliser mes codes d'extension pour la bibliothèque mentionnée dans le lien ci-dessous,

Cliquez ici pour savoir comment utiliser SwiftSVG bibliothèque :

utiliser SwiftSVG pour définir SVG pour L'Image

|OU|

2)SVGKit Bibliothèque

2.1) utiliser pod pour installer:

pod 'SVGKit', :git => 'https://github.com/SVGKit/SVGKit.git', :branch => '2.x'

2.2) Ajouter un cadre

Goto AppSettings

-> Onglet Général

- >Faites défiler vers le bas Jusqu'au lien Cadres et bibliothèques

-> Cliquez sur l'icône plus

- >Sélectionnez SVG.framework

2.3) ajouter L'Objectif-C à l'en-tête Pont du fichier Swift.h:

#import <SVGKit/SVGKit.h>
#import <SVGKit/SVGKImage.h>

2.4) créer un dossier SvgImg (pour une meilleure organisation) dans le projet et y ajouter des fichiers SVG.

Note: L'ajout D'un dossier "Inside Assets" ne fonctionnera pas et SVGKit recherche des fichiers uniquement dans les dossiers de projets

2,5) Utilisez votre code Swift comme suit:

import SVGKit

et

let namSvgImgVar: SVGKImage = SVGKImage(named: "NamSvgImj")

Note : SVGKit apends extension".svg" à la chaîne de caractères que vous spécifiez

let namSvgImgVyuVar = SVGKImageView(SVGKImage: namSvgImgVar)

let namImjVar: UIImage = namSvgImgVar.UIImage

il y a beaucoup plus d'options pour que vous utilisiez SVGKImage et SVGKImageView

il y a aussi d'autres classes que vous pouvez explorer

    SVGRect
    SVGCurve
    SVGPoint
    SVGAngle
    SVGColor
    SVGLength

    and etc ...
8
répondu Sujay U N 2017-08-17 00:57:19

Swift 3.0 version:

let path = Bundle.main.path(forResource: "svgNameFileHere", ofType: "svg")!
if path != "" {
    let fileURL:URL = URL(fileURLWithPath: path)
    let req = URLRequest(url: fileURL)
    self.webView.scalesPageToFit = false
    self.webView.loadRequest(req)
}
else {
   //handle here if path not found
}
5
répondu Paresh Navadiya 2016-10-07 13:44:20

Vous pouvez garder vos images comme chaînes et utiliser WKWebView pour les afficher:

let webView: WKWebView = {
    let mySVGImage = "<svg height=\"190\"><polygon points=\"100,10 40,180 190,60 10,60 160,180\" style=\"fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;\"></svg>"
    let preferences = WKPreferences()
    preferences.javaScriptEnabled = false
    let configuration = WKWebViewConfiguration()
    configuration.preferences = preferences
    let wv = WKWebView(frame: .zero, configuration: configuration)
    wv.scrollView.isScrollEnabled = false
    wv.loadHTMLString(mySVGImage, baseURL: nil)
    return wv
}()
3
répondu nanvel 2016-11-05 09:31:10

Voici une classe simple qui peut afficher des images SVG dans un UIView

import UIKit

public class SVGImageView: UIView {
    private let webView = UIWebView()

    public init() {
        super.init(frame: .zero)
        webView.delegate = self
        webView.scrollView.isScrollEnabled = false
        webView.contentMode = .scaleAspectFit
        webView.backgroundColor = .clear
        addSubview(webView)
        webView.snp.makeConstraints { make in
            make.edges.equalTo(self)
        }
    }

    required public init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    deinit {
        webView.stopLoading()
    }

    public func load(url: String) {
        webView.stopLoading()
        if let url = URL(string: fullUrl) {
            webView.loadRequest(URLRequest(url: url))
        }
    }
}

extension SVGImageView: UIWebViewDelegate {
    public func webViewDidFinishLoad(_ webView: UIWebView) {
        let scaleFactor = webView.bounds.size.width / webView.scrollView.contentSize.width
        if scaleFactor <= 0 {
            return
        }

        webView.scrollView.minimumZoomScale = scaleFactor
        webView.scrollView.maximumZoomScale = scaleFactor
        webView.scrollView.zoomScale = scaleFactor
    }
}
2
répondu wes 2017-05-22 18:34:55

pour rendre un fichier SVG, vous pouvez utiliser Ara. Macaw prend également en charge les transformations, les événements utilisateurs, l'animation et divers effets.

vous pouvez rendre un fichier SVG avec zéro ligne de code. Pour plus d'informations, veuillez consulter cet article: Rendre un fichier SVG avec Ara.

1
répondu zapletnev 2016-11-25 08:12:10

Dans le cas où vous souhaitez utiliser un WKWebView pour charger un .image svg qui est à venir à partir d'un URLRequest, vous pouvez simplement réaliser, comme ceci:

Swift 4

if let request = URLRequest(url: urlString), let svgString = try? String(contentsOf: request) {
  wkWebView.loadHTMLString(svgString, baseURL: request)
}

C'est beaucoup plus simple que les autres façons de le faire, et vous pouvez aussi poursuivre votre .SVG string quelque part pour le charger plus tard, même hors ligne si vous en avez besoin.

1
répondu GabrielaBezerra 2018-04-13 03:55:13