Swift 4中模板图像上的渐变颜色

Question

我正在尝试使用 swift 4 在我的应用程序中创建一个聊天应用程序。

我希望聊天气泡以我以编程方式设置的渐变颜色显示。

我通过将图像渲染为以下模板，通过纯色实现了这一点：

    let TestImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 300, height: 200))
    let TestImage = ChatBubble
    let TestImage2 = TestImage.resizableImage(withCapInsets: TestInsets, resizingMode: .stretch).withRenderingMode(UIImageRenderingMode.alwaysTemplate)
    TestImageView.image = TestImage2
    TestImageView.tintColor = UIColor.red

怎么做？

更新：我是通过 Mr.Matt 解决方案制作的，但在调整尺寸时遇到了一些麻烦。这是我在类中制作后的最终代码：

类 UIChatBubbleView: UIView {

override func draw(_ rect: CGRect) {
    let ChatBubbleView = UIImageView(frame: rect)
    let BubbleInsets = UIEdgeInsets(top: 100, left: 200, bottom: 240, right: 240)
    let BubbleImage = #imageLiteral(resourceName: "ChatBubble").resizableImage(withCapInsets: BubbleInsets, resizingMode: .stretch)
    ChatBubbleView.image = BubbleImage
    let MyView = UIView(frame: ChatBubbleView.bounds)
    MyView.layer.contents = ChatBubbleView.image?.cgImage
    let GradientLayer = CAGradientLayer()
    GradientLayer.frame = ChatBubbleView.bounds
    GradientLayer.colors = [UIColor.red.cgColor,UIColor.blue.cgColor]
    GradientLayer.mask = ChatBubbleView.layer

    MyView.layer.addSublayer(GradientLayer)
    MyView.layer.shadowColor = UIColor.black.cgColor
    MyView.layer.shadowOffset = CGSize(width: 3.0, height: 3.0)
    MyView.layer.shadowOpacity = 0.5
    MyView.layer.shadowRadius = 3
    self.addSubview(MyView)
}

override init(frame:CGRect) {
    super.init(frame:frame)
    self.isOpaque = false
}
required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
}

}

最终的结果是这样的：

我希望渐变气泡的大小与黑色气泡的大小完全相同。

Answer 1

绘制渐变（CAGradientLayer 是最简单的方法）。然后使用您的气泡形状来掩盖渐变。

例如，这是一个气泡形状示例：

这是掩盖红色到橙色渐变的形状：

现在您可以将文本放入气泡中（作为标签、CATextLayer 或任何方便的方式）。