私はSwiftを使ってiOSでSVG画像をアニメーション化しています。私はSVGKit(https://github.com/SVGKit/SVGKit)を使ってSVGを簡単にレンダリングすることができましたが、アニメーション化するためにSVGパス要素をUIBezierPathに変換する必要があります。私は他のライブラリを使ってそうすることができますが、SVGKitだけを使ってすべてを行うことができればいいと思います。私はパス要素を取得するための簡単な方法を見つけることができませんでした。iOSでSVGKitを使用してSVGパスコンポーネントをUIBezierPathに解析する方法は?
3
A
答えて
1
パスはAppleクラスの.pathを呼び出すことで利用できます。 Apple CoreAnimationのドキュメント、特にCAShapeLayer(SVGKitが頻繁に使用する)を読むことをお勧めします。
AppleはUIBezierPathに変換するためのコードも提供しています。これについてはAppleのドキュメントを参照してください。たとえば、
- (UIBezierPath *)bezierPathWithCGPath:(CGPathRef)CGPath;
1
私はSwiftとSVGKitを使用して同じ問題がありました。このsimple tutorialを実行してswiftに変換しても、私はSVGをレンダリングできますが、線画をアニメートすることはできません。質問がCGPathににUiBezierPathの変換に関するものではありません
let url = NSBundle.mainBundle().URLForResource("tiger", withExtension: "svg")!
let paths = SVGBezierPath.pathsFromSVGAtURL(url)
for path in paths {
// Create a layer for each path
let layer = CAShapeLayer()
layer.path = path.CGPath
// Default Settings
var strokeWidth = CGFloat(4.0)
var strokeColor = UIColor.blackColor().CGColor
var fillColor = UIColor.whiteColor().CGColor
// Inspect the SVG Path Attributes
print("path.svgAttributes = \(path.svgAttributes)")
if let strokeValue = path.svgAttributes["stroke-width"] {
if let strokeN = NSNumberFormatter().numberFromString(strokeValue as! String) {
strokeWidth = CGFloat(strokeN)
}
}
if let strokeValue = path.svgAttributes["stroke"] {
strokeColor = strokeValue as! CGColor
}
if let fillColorVal = path.svgAttributes["fill"] {
fillColor = fillColorVal as! CGColor
}
// Set its display properties
layer.lineWidth = strokeWidth
layer.strokeColor = strokeColor
layer.fillColor = fillColor
// Add it to the layer hierarchy
self.view.layer.addSublayer(layer)
// Simple Animation
let animation = CABasicAnimation(keyPath:"strokeEnd")
animation.duration = 4.0
animation.fromValue = 0.0
animation.toValue = 1.0
animation.fillMode = kCAFillModeForwards
animation.removedOnCompletion = false
layer.addAnimation(animation, forKey: "strokeEndAnimation")
関連する問題
- 1. UIBezierPathを使用してイメージをトリミングする方法は?
- 2. Microsoft.SqlServer.Types.SqlGeometryをSVGに解析する方法はありますか?
- 3. JAXBを使用してxmlを解析する方法は?
- 4. JVMを使用してOpenAM XACMLを解析する方法は?
- 5. GSONを使用してJSONを解析する方法は?
- 6. jquery $ .parseXMLを使用してxmlを解析する方法は?
- 7. org.apache.poi.ss.formula.FormulaParserを使用して数式を解析する方法は?
- 8. reを使用してPythonでリストを解析する方法
- 9. linqをオブジェクトに使用してxmlを解析する方法
- 10. libxml解析を使用してxmlデータを解析する方法
- 11. Sonarを使用したIOSの解析
- 12. jsonkit iOSを使用してjsonフィードを解析する
- 13. Hpricot/nokogiri - SVG/XMLファイルを解析して使用する色を取得する
- 14. JSON.netを使用してJSONファイルを解析する方法
- 15. xml javascriptを使用してchildrenNodesを解析する方法
- 16. jsoupを使用してXMLを解析する方法
- 17. perlを使用してテーブルを解析する方法
- 18. angular2のナビゲーションを使用してデータを解析する方法
- 19. RubyとNokogiriを使用してXMLを解析する方法
- 20. openSSLを使用して.JKS(java keystore)を解析する方法
- 21. GSONを使用してJSONを解析する方法
- 22. シングルトンクラスを使用してjsonデータを解析する方法
- 23. XMLParserを使用してgoogle weather XMLを解析する方法
- 24. .NETを使用してRDFを解析する方法
- 25. ボレーライブラリを使用してJSONを解析する方法
- 26. NSScannerを使用して.icsファイルを解析する方法
- 27. jqueryを使用してjsonオブジェクトを解析する方法
- 28. Javascriptを使用して.RCファイルを解析する方法
- 29. Apacheコモンを使用してファイルパターンを解析する方法CLI
- 30. SAXパーサーを使用してXMLを解析する方法
か:何私のために働いたことは彼らが各レイヤを反復処理する機能を持っており、これは私がSVGファイルをアニメーション化するためにそれを使用する方法ですPocketSVG
に切り替えました。逆に。むしろsvg-> UiBezierPath – alexburtnik
OPがSVGKitを使用しています。 SVGKitはレンダリングのためのCGPathとして* everything *を格納します。 SVGKitは上で説明したようにAppleのAPIを介して*すべて*を公開します。もっと慎重に読んでください:これはUIBezierPathとCGPathの間の変換に関するものです! – Adam
私は誰かがこの答えを落としているというポップアップを得ました。コメントはありません、ただdownvote。役に立たない(特にdownvoterが間違っているので:)) – Adam