的UILabel與顏色漸變到標籤

的一定高度欲波紋管實現從畫面的效果 - 一個UILabel顯示進度X爲從底部到X％的標籤的高度的的梯度。標籤的其餘（100-X）％將具有不同的顏色。的UILabel與顏色漸變到標籤

，自己目前進入我腦海的唯一的事情是創建兩個UIViews一個帶有灰色背景和一個用漸變的顏色。將漸變視圖放在灰色視圖上方並將其高度設置爲與當前進度相匹配。然後只需使用標籤作爲這兩個視圖的掩碼。爲了更好的說明，我附上描述我建議的解決方案的圖片雖然我不滿意它，因爲它不是很優雅。

是否有可能在不同的和更優雅的方式來實現這一目標？理想情況下，只需繼承UILabel即可。

來源

2016-12-24 frooby

你可以使用層和麪具做到這一點，但它實際上是更容易只設置與圖案像的UIColor的文本顏色。這段代碼有效，儘管子類UILabel可能會更好，併爲該類提供了一種應用和/或更新圖像的方法。我認爲這很容易，因爲我發現處理文本圖層有點麻煩，因爲標籤可以通過adjustsFontSizeToFitWidth改變字體大小。

override func viewDidLayoutSubviews() { 
    label.textColor = UIColor(patternImage: partialGradient(forViewSize: label.frame.size, proportion: 0.65)) 
} 

func partialGradient(forViewSize size: CGSize, proportion p: CGFloat) -> UIImage { 
    UIGraphicsBeginImageContextWithOptions(size, false, 0) 

    let context = UIGraphicsGetCurrentContext() 


    context?.setFillColor(UIColor.darkGray.cgColor) 
    context?.fill(CGRect(origin: .zero, size: size)) 

    let c1 = UIColor.orange.cgColor 
    let c2 = UIColor.red.cgColor 

    let top = CGPoint(x: 0, y: size.height * (1.0 - p)) 
    let bottom = CGPoint(x: 0, y: size.height) 

    let colorspace = CGColorSpaceCreateDeviceRGB() 

    if let gradient = CGGradient(colorsSpace: colorspace, colors: [c1, c2] as CFArray, locations: [0.0, 1.0]){ 
     // change 0.0 above to 1-p if you want the top of the gradient orange 
     context?.drawLinearGradient(gradient, start: top, end: bottom, options: CGGradientDrawingOptions.drawsAfterEndLocation) 
    } 


    let img = UIGraphicsGetImageFromCurrentImageContext() 
    UIGraphicsEndImageContext() 
    return img! 
}

來源

2016-12-24 19:34:09

您可以繼承UILabel並在draw(_ rect: CGRect)函數中繪製您想要的內容。或者，如果你想快速完成，你也可以繼承子類並添加漸變子視圖。不要忘記調整它在layoutSubviews()函數。

來源

2016-12-24 12:12:59

您可以將Core Animation與CATextLayer和CAGradientLayer一起使用。

import PlaygroundSupport 

let bgView = UIView(frame: CGRect(x: 0, y: 0, width: 80, height: 80)) 
bgView.backgroundColor = UIColor.black 
PlaygroundPage.current.liveView = bgView 

let textLayer = CATextLayer() 
textLayer.frame = bgView.frame 
textLayer.string = "70" 
textLayer.fontSize = 60 

let gradientLayer = CAGradientLayer() 
gradientLayer.frame = bgView.frame 
gradientLayer.colors = [ 
    UIColor.gray.cgColor, 
    UIColor(red: 1, green: 122.0/255.0, blue: 0, alpha: 1).cgColor, 
    UIColor(red: 249.0/255.0, green: 1, blue: 0, alpha: 1).cgColor 
] 

//Here you can adjust the filling 
gradientLayer.locations = [0.5, 0.51, 1] 

gradientLayer.mask = textLayer 
bgView.layer.addSublayer(gradientLayer)

來源

2016-12-24 13:40:57

的UILabel與顏色漸變到標籤

回答

相關問題