使 UITableViewCell 着色为特定百分比

Question

我有一个应用程序测验应用程序分为不同的类别。类别可以在 UITableView 中看到，例如A 类、B 类、C 类...等。我试图通过为类别 UITableView 单元格的背景着色来显示已回答的问题的百分比作为 UITableView 中的视觉表示。

例如，如果此人完成了类别 A 中 75% 的问题，我希望 UITableView 中类别 A 的背景从左到右以绿色着色 Cell 背景的 75% .

知道如何做的唯一方法是制作绿色背景的背景图像，并根据回答问题的百分比将相关背景图像作为单元格背景的背景。

有没有更简单的方法？我可能会使用像

这样的东西

Cell.backgroundcolor = UIColor.greencolor().75%ofCell.

我知道这段代码不正确，但它有点理解我正在尝试做的事情。

Answer 1

您可以将 UIView 作为子视图添加到单元格，并使 UIView 的背景颜色成为您想要的颜色。

在添加视图之前，您将视图宽度设置为 0.75 * cellWidth。

Answer 2

假设您使用的是故事板，请将 UIView 和 backgroundColor = .greenColor() 添加到单元格

为与父视图相同的视图添加顶部、左侧和底部约束，然后为视图添加宽度约束并为其创建出口。

然后在单元格中你可以说：

var pctScore: CGFloat {
   didSet {
       let viewWidth = cell.contentView.frame.width * pctScore
       widthConstraint.constant = viewWidth
   }
}

Answer 3

我认为您可以通过使用层在不向单元格添加视图的情况下做到这一点：

在您的单元格 class 中，您可以添加以下功能：

func addGradientLayer(percentage: Double) {
   let color1 = UIColor.green
   let color2 = UIColor.clear

   let gradientLayer = CAGradientLayer()
   // sets the gradient frame as the bounds of your cell
   gradientLayer.frame = bounds 

   gradientLayer.colors = [color1.cgColor, color2.cgColor]

   // tells the gradient to go from left to right
   gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.5) 
   gradientLayer.endPoint = CGPoint(x: 1.0, y: 0.5)

   //this line is the important one: as 
   //long the second Double is smaller than 
   //your percentage, you will not get a gradient 
   //but a clear separation between your two colors.
   gradientLayer.locations = [percentage, 0.0]

   layer.addSublayer(gradientLayer)
}

然后您可以在 awakeFromNib() 方法或 cellForRowAt（tableView 委托）中调用此方法：

tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
   ...
   cell.addGradientLayer(percentage: 0.8)
}

使 UITableViewCell 着色为特定百分比

Make a UITableViewCell Coloured to specific percentage

background-color

uitableview

uicolor

swift

swift2