如何让细胞有渐变背景?

时间:2017-08-05 03:54:12

标签: swift cell gradient viewcontroller

我在视图控制器上插入了一个表视图,我想知道如何在表格视图中为单元格提供渐变背景?我可以单独编辑每个单元格,为每个单元格赋予不同的颜色渐变背景吗?例如,每个单元格都在trainingLevels数组中的索引之后标记,我怎样才能使每个单元格具有不同的颜色渐变背景?

这是我的代码:

import UIKit

 class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

var trainingLevels = ["Ball Handling", "Shooting", "Defense", "Advanced Drills", "Vertimax Drills", "Full Workouts", "BHB Products"]


@IBOutlet weak var tableView: TableView!


func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
    cell.backgroundColor = UIColor.clear
}

public func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int
{

    return trainingLevels.count
}


public func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell
{
    let cell = UITableViewCell(style: UITableViewCellStyle.default, reuseIdentifier: "bell")
    cell.textLabel?.text = trainingLevels[indexPath.row]

    //cell details
    cell.backgroundColor = UIColor.black
    cell.textLabel?.textColor = UIColor.white



    return cell
}

override func viewDidLoad() {
    super.viewDidLoad()

    tableView.delegate = self
    tableView.dataSource = self

    // Do any additional setup after loading the view, typically from a nib.
}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}
}

2 个答案:

答案 0 :(得分:2)

您需要先创建渐变,然后将子图层插入到单元格中,如下所示。

func gradient(frame:CGRect) -> CAGradientLayer {
    let layer = CAGradientLayer()
    layer.frame = frame
    layer.startPoint = CGPointMake(0,0.5)
    layer.endPoint = CGPointMake(1,0.5)
    layer.colors = [ 
    UIColor.red.cgColor,UIColor.blue.cgColor]
    return layer
}

//Now on your tableViewcell do below

cell.layer.insertSublayer(gradient(cell.bounds), atIndex:0)

for Swift 4.0

func gradient(frame:CGRect) -> CAGradientLayer {
        let layer = CAGradientLayer()
        layer.frame = frame
        layer.startPoint = CGPoint(x: 0, y: 0.5)
        layer.endPoint = CGPoint(x: 1, y: 0.5)
        layer.colors = [
            UIColor.gray.cgColor,UIColor.cyan.cgColor]
        return layer
    }

    cell.layer.insertSublayer(gradient(frame: backgroundView.bounds), at:0)

答案 1 :(得分:2)

您可以创建UIView的扩展名:

extension UIView{
    func addGradientBackground(firstColor: UIColor, secondColor: UIColor){
        clipsToBounds = true
        let gradientLayer = CAGradientLayer()
        gradientLayer.colors = [firstColor.cgColor, secondColor.cgColor]
        gradientLayer.frame = self.bounds
        gradientLayer.startPoint = CGPoint(x: 0, y: 0)
        gradientLayer.endPoint = CGPoint(x: 0, y: 1)
        print(gradientLayer.frame)
        self.layer.insertSublayer(gradientLayer, at: 0)
    }
}

在你的牢房内简单地说:

override func awakeFromNib() {
    super.awakeFromNib()
    self.addGradientBackground(firstColor: .green, secondColor: .blue)
}