在动画 WKInterfaceImage 上渲染为模板图像

Question

我有一个 160 帧的 WKInterfaceImage 动画。动画很棒。现在我想添加一种色调。 This SO question 提到了在检查器中使用渲染为模板图像选项的 WatchKit 色调方法，但它似乎只适用于单个静态图像。它仅对最后一帧进行着色，并且将最后一帧着色为我在检查器中的色调，而不是我的代码色调。我试过只渲染第一帧并渲染所有帧都无济于事。

我是否必须遍历所有这些或设置范围或将 setTint 方法合并到 startAnimatingWithImagesInRange 方法中？

rotateButtonImage.setImageNamed("frame")

    rotateButtonImage.startAnimatingWithImagesInRange(NSRange(location: 0, length: 159), duration: 1, repeatCount: 1)
    rotateButtonImage.setTintColor(UIColor.redColor())

编辑：所以我所做的是创建一个扩展。看起来像这样。

WKImage+Tint.swift

extension UIImage {

func imageWithTintColor(colorTint : UIColor) -> UIImage {

    UIGraphicsBeginImageContextWithOptions(self.size, false, self.scale)
    colorTint.setFill()

    let context : CGContextRef = UIGraphicsGetCurrentContext()! as CGContextRef 
    CGContextTranslateCTM(context, 0, self.size.height)
    CGContextScaleCTM(context, 1.0, -1.0)
    CGContextSetBlendMode(context, CGBlendMode.Normal)

    let rect : CGRect = CGRectMake(0, 0, self.size.width, self.size.height)
    CGContextClipToMask(context, rect, self.CGImage)
    CGContextFillRect(context, rect)

    let newImage : UIImage = UIGraphicsGetImageFromCurrentImageContext() as UIImage
    UIGraphicsEndImageContext()

    return newImage
}
}

然后在我的自定义 VC 中 awakeWithContext 我调用了：

rotateButtonImage.image = rotateButtonImage.image.imageWithColor(UIColor.redColor())

但由于某些原因，事情没有自动完成。我的 WKInterfaceImage 名为 rotateButtonImage，我已经导入了 Foundation 和 WatchKit 等。

我的扩展或函数 return 类型应该改为 WKInterfaceImage 类型吗？我尝试更改这些但出现大量错误。

所以我想我发现这个扩展在 WatchKit 中不起作用 lol

所以你必须使用Inspector方法。但是我的动画仍然没有色调。我认为这可能是一个错误？单个图像可以使用色调，但可能不能使用多个帧，即使代码有效。

Answer 1

setTintColor 仅在图像包含单个图像模板时有效，如此处所述。

https://developer.apple.com/library/ios/documentation/WatchKit/Reference/WKInterfaceImage_class/index.html#//apple_ref/occ/instm/WKInterfaceImage/setTintColor:

但是，实际上，有一种方法可以为动画图像重新着色。它的性能不佳，而且您不想对大量图像执行此操作。

 static func animatedImagesWithColor(color: UIColor) -> [UIImage] {
    var animatedImages = [UIImage]()

    (0...60).forEach { imageNumber in
        if let img = UIImage(named: "MyImage\(imageNumber)") {
            UIGraphicsBeginImageContextWithOptions(img.size, false, img.scale);

            let context = UIGraphicsGetCurrentContext()

            color.setFill()

            CGContextTranslateCTM(context, 0, img.size.height);
            CGContextScaleCTM(context, 1.0, -1.0);
            CGContextClipToMask(context, CGRectMake(0, 0, img.size.width, img.size.height), img.CGImage);
            CGContextFillRect(context, CGRectMake(0, 0, img.size.width, img.size.height));

            animatedImages.append(UIGraphicsGetImageFromCurrentImageContext())
            UIGraphicsEndImageContext()

        }
    }

    return animatedImages
}

您可以这样使用该数组：

let animation = UIImage.animatedImageWithImages(UIImage.animatedImagesWithColor(.redColor()), duration: 50)
let range = NSRange(location: 0, length: 60)

animationGroup.setBackgroundImage(animation)
animationGroup.startAnimatingWithImagesInRange(range, duration: 50, repeatCount: -1)

在动画 WKInterfaceImage 上渲染为模板图像

Render As Template Image on an animated WKInterfaceImage

swift

watchkit

watchos-2