Question

对于我的应用程序，我正在使用TableView并使用自定义的UITableViewCells。

我通过界面构建器自定义了我的单元格，而不是以编程方式。有没有办法在界面构建器中使我的自定义单元格的背景颜色成为渐变？

感谢。

Answer 1

要绘制渐变，您必须以编程方式子类化并覆盖drawRect：

- (void)drawRect:(CGRect)rect
{
    CGContextRef context = UIGraphicsGetCurrentContext();

    CGContextSaveGState(context);
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGGradientRef gradient = CGGradientCreateWithColorComponents
                             (colorSpace,
                              (const CGFloat[8]){1.0f, 0.0f, 0.0f, 1.0f, 0.0f, 1.0f, 0.0f, 1.0f},
                              (const CGFloat[2]){0.0f,1.0f},
                              2);

    CGContextDrawLinearGradient(context,
                                gradient,
                                CGPointMake(CGRectGetMidX(self.bounds), CGRectGetMinY(self.bounds)),
                                CGPointMake(CGRectGetMidX(self.bounds), CGRectGetMaxY(self.bounds)),
                                0);

    CGColorSpaceRelease(colorSpace);
    CGContextRestoreGState(context);
}

最简单的方法，它将您的单元格保存在界面构建器中，可能是为了使UIView在其drawRect中绘制渐变并将其放在您的单元格后面的其他子视图中的子类： / p>

GradientView *gradientView = [[GradientView alloc] init];
gradientView.frame = cell.bounds;
[cell addSubview:gradientView];
[cell sendSubviewToBack:gradientView];

但是，最好的方法可能不是为此使用接口构建器，而是创建UITableViewCell的子类。对于高级自定义，界面构建器往往只会让我的体验变得更复杂。这取决于个人偏好。

Answer 2

CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = yourView.bounds;
gradient.colors = [NSArray arrayWithObjects:(id)[[UIColor blackColor] CGColor], (id)    [[UIColor whiteColor] CGColor], nil];
[yourView.layer insertSublayer:gradient atIndex:0];

Answer 3

是的，这是可能的：使用1 X高度像素制作渐变图像。将其设置为backgroundColor for cell。

cell.backgroundColor =  [UIColor colorWithPatternImage:[UIImage imageNamed:@"gradImage.png"]];

**您可以使用代码设置渐变颜色，但需要花费时间。如果你填写得更好，那么搜索它。

Answer 4

answer by etayluz工作正常，但我添加了一些更改：

由自己的图层边界定义的渐变尺寸，而不是超级视图。

在每次绘制时移除渐变图层，以便在需要重绘时不会继续绘制并添加新图层（例如在旋转时调用.setNeedsDisplay()）。

@IBDesignable final class MFGradientView: UIView {

    @IBInspectable var startColor: UIColor = UIColor.clear
    @IBInspectable var endColor: UIColor = UIColor.clear

    override func draw(_ rect: CGRect) {
       layer.sublayers?.first?.removeFromSuperlayer()

       let gradient: CAGradientLayer = CAGradientLayer()
       gradient.frame = CGRect(origin: CGPoint.zero, size: self.bounds.size)
       gradient.colors = [startColor.cgColor, endColor.cgColor]
       layer.insertSublayer(gradient, at: 0)
    }
}

Answer 5

基于etayluz的答案，我考虑了 UIView 的 layerClass 属性，稍微更改了代码，因此您不需要单独的图层作为子图层

我认为它更清晰，它也适用于Interface Builder中的实时更新。

@IBDesignable final class GradientView: UIView {

    @IBInspectable var startColor: UIColor = UIColor.red
    @IBInspectable var endColor: UIColor = UIColor.blue

    override class var layerClass: AnyClass {
        get {
            return CAGradientLayer.self
        }
    }

    override init(frame: CGRect) {
        super.init(frame: frame)
        setupGradient()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        setupGradient()
    }

    private func setupGradient() {
        let gradient = self.layer as! CAGradientLayer
        gradient.colors = [startColor.cgColor, endColor.cgColor]
    }

}

Answer 6

我不知道是否有渐变选项，但您可以将UIImageView添加到自定义单元格并添加带渐变的图像。

Answer 7

使用@IBInspectable属性创建一个简单的视图类。

一次创建渐变图层
在每个布局子视图中重用渐变层

...

//
//  GradientView.swift
//
//  Created by Maksim Vialykh on 23.08.2018.
//  Copyright © 2018 Vialyx. All rights reserved.
//

import UIKit

class GradientView: UIView {

    @IBInspectable
    var startColor: UIColor = .white

    @IBInspectable
    var endColor: UIColor = .black

    private let gradientLayerName = "Gradient"

    override func layoutSubviews() {
        super.layoutSubviews()

        setupGradient()
    }

    private func setupGradient() {
        var gradient: CAGradientLayer? = layer.sublayers?.first { $0.name == gradientLayerName } as? CAGradientLayer
        if gradient == nil {
            gradient = CAGradientLayer()
            gradient?.name = gradientLayerName
            layer.addSublayer(gradient!)
        }
        gradient?.frame = bounds
        gradient?.colors = [startColor.cgColor, endColor.cgColor]
        gradient?.zPosition = -1
    }

}

Answer 8

不，你不能。您可以在较旧的sdk和xCode版本中将UISegmentedControl与一个段一起使用： http://chris-software.com/index.php/2009/05/13/creating-a-nice-glass-buttons/ 但是现在你不能在一个UISegmentedControl中创建少于两个段。即使这样，您也无法在不编码的情况下更改按钮的默认颜色。

有没有办法在界面构建器中制作渐变背景颜色？

8 个答案: