如何在Apple Watch上绘制自定义图形？

Question

如何在Apple Watch上绘制自定义图形？

如果我理解正确，我们只能在Apple Watch上使用图像和标准控件。如果是这样，是否有可能在内存中的图像上绘制自定义图形，然后将这些图像放在屏幕上？

Answer 1

在watchOS2你可以使用WKInterfaceImage使用一些CoreGraphics。

作为参考，检查出图像绘制真棒watchOS2 Sampler

实施例：

// Create a graphics context 
    let size = CGSizeMake(100, 100) 
    UIGraphicsBeginImageContext(size) 
    let context = UIGraphicsGetCurrentContext() 

    // Setup for the path appearance 
    CGContextSetStrokeColorWithColor(context, UIColor.whiteColor().CGColor) 
    CGContextSetLineWidth(context, 4.0) 

    // Draw lines 
    CGContextBeginPath (context); 
    CGContextMoveToPoint(context, 0, 0); 
    CGContextAddLineToPoint(context, 100, 100); 
    CGContextMoveToPoint(context, 0, 100); 
    CGContextAddLineToPoint(context, 100, 0); 
    CGContextStrokePath(context); 

    // Convert to UIImage 
    let cgimage = CGBitmapContextCreateImage(context); 
    let uiimage = UIImage(CGImage: cgimage!) 

    // End the graphics context 
    UIGraphicsEndImageContext() 

    image.setImage(uiimage) 

使用贝塞尔路径的实施例：

// Create a graphics context 
    let size = CGSizeMake(100, 100) 
    UIGraphicsBeginImageContext(size) 
    let context = UIGraphicsGetCurrentContext() 

    // Setup for the path appearance 
    UIColor.greenColor().setStroke() 
    UIColor.whiteColor().setFill() 

    // Draw an oval 
    let rect = CGRectMake(2, 2, 96, 96) 
    let path = UIBezierPath(ovalInRect: rect) 
    path.lineWidth = 4.0 
    path.fill() 
    path.stroke() 

    // Convert to UIImage 
    let cgimage = CGBitmapContextCreateImage(context); 
    let uiimage = UIImage(CGImage: cgimage!) 

    // End the graphics context 
    UIGraphicsEndImageContext() 

    image.setImage(uiimage) 

最后又用PocketSVG

// Create a graphics context 
    let size = CGSizeMake(512, 512) 
    UIGraphicsBeginImageContext(size) 
    let context = UIGraphicsGetCurrentContext() 

    // Setup for the path appearance 
    UIColor.yellowColor().setFill() 

    // Convert SVG -> CGPath -> UIBezierPath 
    let pocketSvg = PocketSVG(fromSVGFileNamed: "sample") 
    let path = pocketSvg.bezier 
    print(path) 
    path.fill() 

    // Convert to UIImage 
    let cgimage = CGBitmapContextCreateImage(context); 
    let uiimage = UIImage(CGImage: cgimage!) 

    // End the graphics context 
    UIGraphicsEndImageContext() 

    image.setImage(uiimage) 

显示SVG