A simple toolkit for displaying and manipulating SVGs on iOS and macOS in a performant manner.
The goal of this project is not to be a fully compliant SVG parser/renderer. But rather to use SVG as a format for serializing CG/UIPaths, meaning it only supports SVG features that can be represented by CG/UIPaths.
Thoroughly documented.
- Render SVG files via SVGImageView/Layer
- Display all kinds of SVGs shapes and paths.
- Fully working iOS and macOS demos.
- Straightforward API for typical SVG rendering (
SVGLayer
andSVGImageView
) - Supports more fine-grained SVG manipulation (
SVGBezierPath
andSVGEngine
)
Add pod PocketSVG
to your Podfile.
Add this to your Cartfile:
github "pocketsvg/PocketSVG"
Then run carthage update
.
Drag and drop PocketSVG.xcodeproj
into your Xcode project. In your project settings, add PocketSVG.framework in Link Binary With Libraries.
Render an SVG file using SVGImageView:
let url = NSBundle.mainBundle().URLForResource("svg_file_name", withExtension: "svg")!
let svgImageView = SVGImageView(contentsOfURL: url)
view.addSubview(svgImageView)
Manually render each path of an SVG file into using CAShapeLayers:
for(SVGBezierPath *path in [SVGBezierPath pathsFromSVGNamed:@"myImage"]) {
// Create a layer for each path
CAShapeLayer *layer = [CAShapeLayer layer];
layer.path = path.CGPath;
// Set its display properties
layer.lineWidth = 4;
layer.strokeColor = [path.svgAttributes[@"stroke"] ?: [UIColor blackColor] CGColor];
layer.fillColor = [path.svgAttributes[@"fill"] ?: [UIColor redColor] CGColor];
// Add it to the layer hierarchy
[self.view.layer addSublayer:layer];
}
Please use the issue tracker to report any bugs or file feature requests.
PRs are welcome.