如何在单个UIView中添加3种背景色?

时间:2018-08-17 09:44:50

标签: ios uiview

我需要在单一背景色Just like that中添加三种颜色

不使用3个UIView或图像。

3 个答案:

答案 0 :(得分:2)

创建自定义UIView并覆盖draw(_:)函数。然后使用当前的CGContext并根据您的首选大小进行绘制。基于给定图像的对齐方式的示例如下所示:

class CustomView: UIView {
    override func draw(_ rect: CGRect) {
        super.draw(rect)
        guard let context = UIGraphicsGetCurrentContext() else {
            return
        }

        let firstRect = CGRect(origin: CGPoint(x: rect.origin.x, y: rect.origin.y), size: CGSize(width: rect.size.width / 3, height: rect.size.height))
        let middleRect = CGRect(origin: CGPoint(x: firstRect.maxX, y: rect.origin.y), size: CGSize(width: rect.size.width / 3, height: rect.size.height))
        let lastRect = CGRect(origin: CGPoint(x: middleRect.maxX, y: rect.origin.y), size: CGSize(width: rect.size.width / 3, height: rect.size.height))

        let arrayTuple: [(rect: CGRect, color: CGColor)] = [(firstRect, UIColor.red.cgColor), (middleRect, UIColor.green.cgColor), (lastRect, UIColor.blue.cgColor)]
        for tuple in arrayTuple {
            context.setFillColor(tuple.color)
            context.fill(tuple.rect)
        }
    }
}

答案 1 :(得分:1)

在func下面使用此

func addSublayers (_ viewCustom : UIView){
    let layer1 = CAShapeLayer()
    let layer2 = CAShapeLayer()
    let layer3 = CAShapeLayer()

    layer1.frame = CGRect(origin: viewCustom.bounds.origin,
                          size: CGSize(width: viewCustom.frame.size.width/3,
                                       height: viewCustom.frame.size.height))

    layer2.frame = CGRect(x: layer1.frame.size.width,
                          y: layer1.frame.origin.y,
                          width: viewCustom.frame.size.width/3,
                          height: viewCustom.frame.size.height)

    layer3.frame = CGRect(x: layer2.frame.size.width + layer2.frame.origin.x,
                          y: layer2.frame.origin.y,
                          width: viewCustom.frame.size.width/3,
                          height: viewCustom.frame.size.height)

    layer1.backgroundColor =  UIColor.red.cgColor
    layer2.backgroundColor = UIColor.green.cgColor
    layer3.backgroundColor = UIColor.blue.cgColor

    viewCustom.layer.addSublayer(layer1)
    viewCustom.layer.addSublayer(layer2)
    viewCustom.layer.addSublayer(layer3)
}

输出:

enter image description here

答案 2 :(得分:0)

extension UIView {
    func addMultipleColorsHorizontal(colors: [UIColor]) {
        let gradientLayer = CAGradientLayer()
        gradientLayer.frame = self.bounds

        var colorsArray: [CGColor] = []
        var locationsArray: [NSNumber] = []
        for (index, color) in colors.enumerated() {

            colorsArray.append(color.cgColor)
            colorsArray.append(color.cgColor)
            locationsArray.append(NSNumber(value: (1.0 / Double(colors.count)) * Double(index)))
            locationsArray.append(NSNumber(value: (1.0 / Double(colors.count)) * Double(index + 1)))
        }

        gradientLayer.colors = colorsArray
        gradientLayer.locations = locationsArray
        gradientLayer.startPoint = CGPoint(x: 0, y: 1)
        gradientLayer.endPoint = CGPoint(x: 1, y: 1)

        self.backgroundColor = .clear
        self.layer.addSublayer(gradientLayer)
    }
}