整个UITableviewcell突出显示而不是单元格内的圆形视图

时间:2018-02-10 23:55:29

标签: ios uitableview uikit swift4 xcode9

我试图实现圆形tableview单元格效果,所以我试图在我的自定义单元格类中弄乱layoutSubviews:

override func layoutSubviews() {        
    // Set the width of the cell
    self.bounds = CGRectMake(self.bounds.origin.x, self.bounds.origin.y, self.bounds.size.width - 40, self.bounds.size.height)
    super.layoutSubviews()
}

我听说不建议更改单元格本身的宽度,并且在单元格中添加UIView(在代码中称为mainView)并添加约束+角半径也可以完成这项任务。

我的自定义单元格类现在是:

class customTableViewCell: UITableViewCell {

    @IBOutlet weak var mainView: UIView!

    override func awakeFromNib() {
        super.awakeFromNib()

        mainView.layer.borderWidth = 2
        mainView.layer.cornerRadius = 20
        mainView.layer.borderColor = UIColor.black.cgColor
        mainView.layer.masksToBounds = true
        // Initialization code
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
        // Configure the view for the selected state
    }
}

以下是我的ViewController的相关组件,它包含mainTableView:

    override func viewDidLoad() {
            super.viewDidLoad()

            mainTableView.rowHeight = 100
            mainTableView.backgroundColor = UIColor.clear

            mainTableView.delegate = self
            mainTableView.dataSource = self
            // Do any additional setup after loading the view, typically from a nib.
        }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

            let cell = self.mainTableView.dequeueReusableCell(withIdentifier: "customCell") as! customTableViewCell

            // note that indexPath.section is used rather than indexPath.row
            cell.textLabel?.text = self.animals[indexPath.row]
            cell.textLabel?.font = UIFont.boldSystemFont(ofSize: 16)
            cell.textLabel?.textAlignment = .center

            // add border and color

            cell.backgroundColor = UIColor.clear
            cell.layer.borderColor = UIColor.clear.cgColor
            cell.layer.borderWidth = 1
            //cell.layer.cornerRadius = 8
            cell.clipsToBounds = true

            return cell
        }

我的结果是:

screenshot of simulator

正如您所知,整个单元格都被突出显示,而不仅仅是内部。

我剩下的问题是 - 有没有办法只在单元格的contentView中强调UIView而不是整个单元格?或者我应该不启用选择和突出显示。

请告诉我。感谢。

2 个答案:

答案 0 :(得分:1)

你可以达到欲望的效果。你只需要按照这些步骤。

第1步 - 将tableview单元格的选择样式设置为 UITableViewCellSelectionStyleNone

cell.selectionStyle = UITableViewCellSelectionStyleNone;

第2步 - 在 customTableViewCell 中,覆盖 setHighlighted(_:animated :) 的默认实现,并决定要突出显示的内容。

override func setHighlighted(_ highlighted: Bool, animated: Bool) {
    super.setHighlighted(highlighted, animated: animated)
    self.backgroundColor = UIColor.blue // Change this to any color you want. 
}

您还可以在此方法中突出显示自定义UITableViewCell的各个元素。 我希望这有帮助。

答案 1 :(得分:1)

对于 Swift 4.1 ,在 tableView(_ tableView:UITableView,cellForRowAt ...)或Storyboard tableview单元格场景中:

cell.selectionStyle = .none

在您的单元格子类中:

override func setHighlighted(_ highlighted: Bool, animated: Bool) {
     super.setHighlighted(highlighted, animated: animated)
     // do your custom things with the cell subviews here
     if highlighted == true {
         self.contentView.backgroundColor = .gray
     } else {
         self.contentView.backgroundColor = .white
     }
}