欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

[IOS]如何自定义UITableView的section样式

程序员文章站 2022-06-01 11:29:18
...

一.如何配置section

参考:https://www.youtube.com/watch?v=-yeaLC0jgss

配置无标题section:

let sections = [" "," "]

 不能直接"",IDE会默认为没有section

配置DataSource:

menuList = [
            [menuPingTest,menuPortForword,menuDhcpRes],
            [menuDataTraffic]
        ]

 配置表:

func initView() {
        advancedTable.dataSource = self
        advancedTable.delegate = self
        advancedTable.backgroundColor = uiStyleUtil.getBackGroundGrayColor()
        advancedTable.tableFooterView = UIView.init(frame: CGRect.zero)  //不显示无数据的空行
        advancedTable.separatorColor = uiStyleUtil.getTableLineGrayColor()
    }

 section基本:

//Section
    func numberOfSections(in tableView: UITableView) -> Int {
        return self.sections.count
    }
    func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
        return self.sections[section]
    }
    func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return 20
    }

 table cell基本:

//table view
    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return 50
    }
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return menuList[section].count
    }
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cellId = "AdvancedSubCell"
        let cell = tableView.dequeueReusableCell(withIdentifier: cellId)
        
        cell?.textLabel?.text = menuList[indexPath.section][indexPath.row]
        cell?.detailTextLabel?.text = ""
        cell?.backgroundColor = UIColor.clear
        cell?.selectionStyle = UITableViewCell.SelectionStyle.none
        return cell!
    }

 

二.自定义section相关:

1.如果section行跟随table滚动,在storyboard table属性那里选择grouped

但是这里有个问题就是选择grouped以后,section的样式就会和cell一样,配置背景色等等是没有效果的

section的separator line样式不能设置,默认就是全屏宽(即使cell设置了separator insert)

 

2.不选择grouped,选择plain可以自定义:

有两种方式设置section的样式:

func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int)

 这种可以做简单的自定义,例如背景色,字体颜色等等

func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
        view.tintColor = uiStyleUtil.getBackGroundGrayColor()
        let header = view as! UITableViewHeaderFooterView
        header.textLabel?.textColor = UIColor.white
        separatorView.backgroundColor = uiStyleUtil.getTableLineGrayColor()
        header.addSubview(separatorView)
    }

 但是这种方式不能有针对性地设置separator line:

所以有另外一种定义:

参考:https://*.com/questions/45139262/tableview-section-seperator-line

 

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?

 

func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView?

 这种和第一种会冲突,只能选择一种.这种是把section给一个header view和footer view,把他们给不同背景色就可以看出来,如果两个都配置了,会发现section的高度会变大,因为多了一个view

那如果想给section加上上下分割线怎么做呢,我们只要一个view,我的例子是:

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let headerView = UIView()
        let separatorHeaderView = UIView(frame: CGRect(x: tableView.separatorInset.left,
                                                       y: headerView.frame.height,
                                                       width: tableView.frame.width - tableView.separatorInset.right - tableView.separatorInset.left,
                                                       height: 1))
        let separatorFooterView = UIView(frame: CGRect(x: tableView.separatorInset.left,
                                                       y: headerView.frame.height + 20,
                                                       width: tableView.frame.width - tableView.separatorInset.right - tableView.separatorInset.left,
                                                       height: 1))
        separatorHeaderView.backgroundColor = uiStyleUtil.getTableLineGrayColor()
        separatorFooterView.backgroundColor = uiStyleUtil.getTableLineGrayColor()
        if section == 1 {
            headerView.addSubview(separatorHeaderView)
        }
        headerView.addSubview(separatorFooterView)
        print("header view: frame-h: \(headerView.frame.height) bounds-h: \(headerView.bounds.height)")
        return headerView
    }

 这样,样式就是


[IOS]如何自定义UITableView的section样式
 

相关标签: UITableView section