A technology sharing blog

创建自定义Cell

UITableViewCell默认是没有Slider控件的,如果你使用上文添加Switch的方法,Cell上的Slider会变很小无法自定义大小,这时候就要使用到UITableView的一个强大方法——最定义Cell视图

创建XIB文件

按下快捷键command + n创建一个Class文件,使其继承UITableViewCell

xib文件中,创建你需要的空间,调整大小,创建约束。

关联

XIB文件中可变组件关联到swift文件。

import UIKit

class ColorCubeTableViewCell: UITableViewCell {
    @IBOutlet weak var lable: UILabel!
    @IBOutlet weak var slider: UISlider!
    
    override func awakeFromNib() {
        super.awakeFromNib()
        
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
    }
    
    
}

如果有什么需要设置可以在awakeFromNib()中设置,他会在Cell刚刚被载入时候调用

在Table View中使用

定义Cell

自定义Cell创建完成后还不能直接使用,我们需要做一些操作

self.tableView.register(UINib(nibName: "ColorCubeTableViewCell", bundle: Bundle.main), forCellReuseIdentifier: "ColorSetTableViewCellID")

首先在vivedidload()中加入监听,其中nibName为你刚刚创建的XIB文件名称。

然后在override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell 方法中获取Cell

let colorCubeCell = self.tableView.dequeueReusableCell(withIdentifier: "ColorSetTableViewCellID", for: indexPath) as! ColorCubeTableViewCell

注意这样需要把获取到的Cell强制转换为你刚刚创建的Cell。

然后设置自定义Cell中控件属性

colorCubeCell.lable.text = "Red: "
                colorCubeCell.slider.minimumValue = 0
                colorCubeCell.slider.maximumValue = 255
                colorCubeCell.slider.value = Float(getRedColor())
colorCubeCell.slider.addTarget(self, action: #selector(ColorSetTableViewController.setRedColor(_:)), for: .valueChanged)

注意slider中addTarget方法中,selector选择方法一定要带上方法所在类,使用 . 操作符

最好将Cell转化为UITableViewCell类型。

cell = colorCubeCell as UITableViewCell
cell.selectionStyle = .none

顺便将Cell点按设置为无样式。

获取Slider值

创建函数,函数名称为你刚刚在addTarget中所设置的。

@objc func setRedColor(_ sender: UISlider) {
        let setValue = Int(sender.value)
        // print(setValue)
        userDefaults.setValue(setValue, forKey: "red" + colorName!)
        redColor = setValue
        updateColor()
    }

注意@objc不能少,函数入参为UISlider

通过sender.value获取响应时间的sender值。

You’ve successfully subscribed to UTS Blog
Welcome back! You’ve successfully signed in.
Great! You’ve successfully signed up.
Your link has expired
Success! Check your email for magic link to sign-in.