我关注了this个帖子,以设置渐变位置。
我的代码:
let color1 = UIColor(red: 0.0/255.0, green: 231.0/255.0, blue: 198.0/255.0, alpha: 0.9).cgColor as CGColor
let color2 = UIColor(red: 0.0/255.0, green: 198.0/255.0, blue: 255.0/255.0, alpha: 0.9).cgColor as CGColor
self.gradientLayer.colors = [color2, color1, color2]
self.gradientLayer.locations = [0.0, 0.10, 0.9]
self.gradientLayer.startPoint = CGPoint(x: 0, y: 0)
self.gradientLayer.endPoint = CGPoint(x: 1, y: 1)
viewMain.layer.insertSublayer(self.gradientLayer, at: 0)
我的输出:
预期输出:
答案 0 :(得分:2)
为便于说明,我更改了startPoint
/ endPoint
。
此代码可以在XCode Playground中使用。那不是最好的Swifty代码,而是专注于逻辑/解释而不是纯Swift代码
共享设置:
import Foundation
import UIKit
let viewsWidth: CGFloat = 300.0
let viewsHeight: CGFloat = 400.0
修复代码的方法是修改locations
:
let viewMain: UIView = UIView(frame: CGRect(x: 0, y: 0, width: viewsWidth, height: viewsHeight))
let color1 = UIColor(red: 0.0/255.0, green: 231.0/255.0, blue: 198.0/255.0, alpha: 0.9).cgColor
let color2 = UIColor(red: 0.0/255.0, green: 198.0/255.0, blue: 255.0/255.0, alpha: 0.9).cgColor
var gradientLayer = CAGradientLayer.init()
gradientLayer.frame = viewMain.bounds
gradientLayer.colors = [color2, color1, color1, color2]
gradientLayer.locations = [0.0, 0.2, 0.8, 1.0]
gradientLayer.startPoint = CGPoint(x: 0, y: 0.5)
gradientLayer.endPoint = CGPoint(x: 1, y: 0.5)
viewMain.layer.insertSublayer(gradientLayer, at: 0)
viewMain //That's just for the Show Result action in Playground
ViewMain:
现在有一些解释。
我们首先在每个位置画一条线:
let otherView = UIView(frame: viewMain.bounds)
if let locations = gradientLayer.locations, let colors = gradientLayer.colors {
for (index, aLocation) in locations.enumerated() {
let aLine = UIView(frame: CGRect(x: viewsWidth*CGFloat(aLocation.floatValue)-2,
y: 0,
width: 4,
height: viewsHeight))
aLine.backgroundColor = UIColor(cgColor: colors[index] as! CGColor)
otherView.addSubview(aLine)
}
}
otherView //That's just for the Show Result action in Playground
OtherView:
现在,让我们为每条线绘制一个渐变,但是只有一条(为简化起见,其余颜色设置为白色)。
if let locations = gradientLayer.locations, let colors = gradientLayer.colors {
let offset = 5
let bigView = UIView(frame: CGRect(x: 0,
y: 0,
width: viewsWidth * CGFloat(locations.count) + CGFloat(offset),
height: viewsHeight))
for (index, _) in locations.enumerated() {
let aGradientView = UIView(frame: CGRect(x: 0 + (viewsWidth + CGFloat(offset))*CGFloat(index),
y: 0,
width: viewsWidth,
height: viewsHeight))
let aGradientLayer = CAGradientLayer()
aGradientLayer.frame = aGradientView.bounds
var aGradientColors = [CGColor](repeating: UIColor.white.cgColor, count: colors.count)
aGradientColors[index] = colors[index] as! CGColor
aGradientLayer.colors = aGradientColors
aGradientLayer.locations = gradientLayer.locations
aGradientLayer.startPoint = CGPoint(x: 0.0, y: 0.5)
aGradientLayer.endPoint = CGPoint(x: 1.0, y: 0.5)
aGradientView.layer.insertSublayer(aGradientLayer, at: 0)
aGradientView.layer.borderColor = UIColor.black.cgColor
aGradientView.layer.borderWidth = 2.0
aGradientView.clipsToBounds = false
bigView.addSubview(aGradientView)
}
bigView //That's just for the Show Result action in Playground
}
所示插图不言而喻。
在每条“线”(图2)上,当您要应用渐变(图3)时,颜色将从该行开始直到下一行。这就是为什么您的第一个位置未达到预期效果的原因。您需要采取中介措施。