【问题标题】:Multiple Colour Gradient with Label Mask in Swift (Xcode)Swift(Xcode)中带有标签掩码的多颜色渐变
【发布时间】:2017-03-27 19:52:38
【问题描述】:

我正在尝试使用 3 色渐变来为 Xcode 中的文本着色,但似乎不可能获得我正在寻找的结果。我在以下方面取得了成功,但这只能通过渐变给我两种颜色。

@IBOutlet weak var textSample: UILabel!

override func viewDidLoad() {
    super.viewDidLoad()
    textSample.textColor = UIColor(patternImage: gradientImage(size: textSample.frame.size, color1: CIColor(color: UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)), color2: CIColor(color: UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 0.2))))
}

func gradientImage(size: CGSize, color1: CIColor, color2: CIColor) -> UIImage {

    let context = CIContext(options: nil)
    let filter = CIFilter(name: "CILinearGradient")
    var startVector: CIVector
    var endVector: CIVector

    filter!.setDefaults()

    startVector = CIVector(x: size.width * 0.5, y: 0)
    endVector = CIVector(x: size.width * 0.5, y: size.height * 0.8)

    filter!.setValue(startVector, forKey: "inputPoint0")
    filter!.setValue(endVector, forKey: "inputPoint1")
    filter!.setValue(color1, forKey: "inputColor0")
    filter!.setValue(color2, forKey: "inputColor1")

    let image = UIImage(cgImage: context.createCGImage(filter!.outputImage!, from: CGRect(x: 0, y: 0, width: size.width, height: size.height))!)
    return image
}

我想做的是有 3 个位置,三种颜色:

location1: y:0.0
location2: y:0.8
location3: y:1.0

color1: UIColour(red: 1, green: 1, blue: 1, alpha: 0.2)
color2: UIColour(red: 1, green: 1, blue: 1, alpha: 1.0)
color3: UIColour(red: 1, green: 1, blue: 1, alpha: 0.45)

我一直试图通过将具有 3 个位置的渐变添加到 UIView 来简化它,但似乎无论我为使用 UILabel 掩盖该 UIView 做什么,都没有任何效果。任何建议都会非常有帮助。我附上了一张图片,上面有我用上面的代码得到的结果,以及一个我想尽可能实现的例子。

【问题讨论】:

  • 我假设对三层执行此操作并非易事,但您已经设法为两层执行此操作。那么为什么不将 IUImage 分成两半,为两半实现渐变,然后重新附加呢?

标签: xcode swift3 uilabel mask linear-gradients


【解决方案1】:

最好选择CAGradientLayer (AppCoda),然后将其添加到标签as described here。这是一个例子:

var labelBackground = UIView(frame: label.frame)
label.backgroundColor = UIColor.clear
label.frame = label.bounds
var gradLayer = CAGradientLayer()
gradLayer.frame = labelBackground.layer.bounds
gradLayer.colors = [UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0).CGColor, UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 0.2).CGColor, UIColor(red: 1, green: 1, blue: 1, alpha: 0.45).CGColor]
gradientLayer.locations = [0.0, 0.8, 1.0]    
labelBackground.layer.addSublayer(gradLayer)
labelBackground.addSubview(label)
view.addSubview(labelBackground)

【讨论】:

  • 这会创建一个矩形,其中包含渐变,位于与原始标签不同的位置,并将原始标签移动到屏幕的左上角。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-01-15
  • 1970-01-01
  • 2018-12-23
  • 1970-01-01
相关资源
最近更新 更多