Search code examples
svguiviewswiftcore-graphicsuibezierpath

Resize paths generated by PaintCode


I'm using PaintCode to convert a set of SVGs I have to use in to Swift code. It looks like it just converts the SVG paths in to UIBezierPath()s, which is great.

To display the generated code I'm doing the following:

class FirstImageView: UIView {

    init(name: String) { // Irrelevant custom init
        super.init(frame: CGRectMake(15, 15, 40, 40)) // 40x40 View
        self.opaque = false // Transparent background
    }

    override func drawRect(rect: CGRect) {
        ImagesCollection.firstImage() // Fill the view with this image
    }

    required init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
    }

}

Where ImagesCollection.firstImage() is referencing:

public class ImagesCollection: NSObject {

    public class func firstImage() {
        let color4 = UIColor(red: 0.595, green: 0.080, blue: 0.125, alpha: 1.000)
        var fill295Path = UIBezierPath()
        fill295Path.moveToPoint(CGPointMake(27.5, 2.73))
        // Rest of generated graphics code
    }

}

Which works great - I generated the graphics at 40x40, set the frame to 40x40, and that works fine. What I'm wondering now, is how can I display that same graphic at a smaller (or larger size) - since they're bezier paths they should scale fine, right? Setting my View's frame to CGRectMake(15, 15, 20, 20) (for a desired 20x20 image) just seems to clip the graphic.

How can I ensure that whatever graphic is drawn in to my View is sized to the view's frame?

Thanks


Solution

  • You can use a CGAffineTransform to scale either your custom view or the bezier path itself.

    1. Scale the view:

      myFirstImageView.transform = CGAffineTransformMakeScale(0.5, 0.5)
      
    2. Scale the bezier path:

      // ...
      // lots of generated graphics code
      fill295Path.applyTransform(CGAffineTransformMakeScale(0.5, 0.5))
      fill295Path.stroke() // or fill, etc.