将阴影添加到分组表视图中的每个部分

时间:2018-01-24 23:18:53

标签: ios swift uitableview swift3

如图所示,我想在表视图部分添加阴影。就像表视图有4个部分一样,表视图中会有4个阴影视图。

func numberOfSections(在tableView:UITableView中) - > Int {         返回3}

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 3
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    switch processIndex {
        return cell
}

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    return  44
}

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

func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return 40
}

2 个答案:

答案 0 :(得分:3)

我尝试过自定义[String : UIView]。这将适用于最小行数。如果您的单元设计是静态的,这将满足您的设计。如果您想访问UITableViewCell中的某些媒体资源,则必须使用子视图。

  • 只有一行的多个部分。该行中只有一个视图(lookView)。
  • 我们必须根据要求以编程方式创建n个UIView
  • UITapGestureTableViewTableView格式为GroupedSeparator格式为.none

以下代码将提供如下输出:

screenShot

//Global Variable:


@IBOutlet weak var tblVw: UITableView!

var rowItemsDict = [String : [String]]()
var rowHeight = [String : CGFloat]()
var eachRowSubViews = [String : UIView]()


override func viewDidAppear(_ animated: Bool) {

    rowItemsDict = ["0" : ["welcome", "hello", "wow", "Good", "Bad"], "1" : ["Asia", "Europe", "America"], "2" : ["Mcdonald", "Pizza", "Fries"]]

    for i in 0..<rowItemsDict.count
    {
        let numOfSubItemsArr : [String] = rowItemsDict[String(i)]!
        let eachRowHeight : CGFloat = getShadowViewHeight(defaultHeight: 44.0, numberOfItems: numOfSubItemsArr.count)

        var subArrView = UIView()

        for j in 0..<numOfSubItemsArr.count
        {
            let sublabel = UILabel(frame: CGRect(x: 0, y: 0, width: tblVw.frame.size.width - 42, height: 39))
            sublabel.text = numOfSubItemsArr[j]
            sublabel.isUserInteractionEnabled = true
            sublabel.textAlignment = .right
            sublabel.textColor = UIColor.red
            let subView = UIView(frame: CGRect(x: 0, y: CGFloat((j * 40)), width: tblVw.frame.size.width, height: 39))
            subView.addSubview(sublabel)
            subView.backgroundColor = UIColor.clear
            subView.tag = ((i+1) * 100) + j

            if j == (numOfSubItemsArr.count - 1)
            {

            }
            else
            {
                let LinesubView = UIView(frame: CGRect(x: 0, y: 38, width: tblVw.frame.size.width - 8, height: 1))
                LinesubView.backgroundColor = UIColor.lightGray.withAlphaComponent(0.2)
                subView.addSubview(LinesubView)
            }

            subView.isUserInteractionEnabled = true
            subArrView.addSubview(subView)
            subArrView.isUserInteractionEnabled = true
        }

        eachRowSubViews[String(i)] = subArrView
        rowHeight[String(i)] = eachRowHeight
    }

    let tapGesture = UITapGestureRecognizer(target: self, action: #selector(tapEachView))
    tblVw.addGestureRecognizer(tapGesture)
    tblVw.reloadData()
}


// TABLEVIEW DELEGATES
func numberOfSections(in tableView: UITableView) -> Int {


    return rowItemsDict.count
}

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

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

    let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! SampleTableViewCell

    print("\n\ncellFor")
    cell.backgroundColor = UIColor(red: 240/255, green: 240/255, blue: 240/255, alpha: 0.0)
    cell.separatorVw.backgroundColor = UIColor(red: 250/255, green: 250/255, blue: 250/255, alpha: 0.0)
    tableView.clipsToBounds = true
    let gettingVw : UIView = eachRowSubViews[String(indexPath.section)]!
    cell.lookVw.addSubview(gettingVw)
    cell.lookVw.layer.cornerRadius = 10
    cell.separatorVw.backgroundColor = UIColor.clear

    cell.selectionStyle = .none
    return cell
}


func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {

    let cell = cell as! SampleTableViewCell

    cell.lookVw.dropOnlyOneShadowLeft(getSize: CGSize.zero)
    cell.lookVw.backgroundColor = UIColor.white


}

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {

    return (rowHeight[String(indexPath.section)]! )

}


//ROW HEIGHT CALCULATION
func getShadowViewHeight(defaultHeight: CGFloat, numberOfItems: Int) -> CGFloat
{
    let requiredHeight = CGFloat(Int(defaultHeight) * numberOfItems)

    return requiredHeight
}

//TAP GESTURE ACTION
@objc func tapEachView(sender: UITapGestureRecognizer)
{
    let touchPoint = sender.location(in: tblVw)
    let index = tblVw.indexPathForRow(at: touchPoint)

    if (index == nil)
    {
            print("long press on table view but not on a row");
    }
    else
    {
        let cell = tblVw.cellForRow(at: index!) as! SampleTableViewCell
        let pointInCell = cell.convert(touchPoint, from: tblVw)

        let innerSubVw = cell.lookVw.subviews
        print("pointInCellpointInCell)  ", pointInCell)
        for sVw in innerSubVw[0].subviews
        {
            let pointY = pointInCell.y - 5
            let comparePoint = sVw.frame.origin.y

            if pointY >= comparePoint && pointY <= comparePoint + 39
            {
                print("sVwsVwsVwsVwsVw    ", sVw.tag)

                //DO YOUR ACTION IN RESPECTIVE VIEW CLICK
                return
            }

        }

    }
}


extension UIView {
    func dropOnlyOneShadowLeft(getSize: CGSize) {
        self.layer.shadowColor = UIColor.lightGray.cgColor
        self.layer.shadowOpacity = 0.6
        self.layer.shadowOffset = getSize
        self.layer.shadowRadius = 3
    }
}

答案 1 :(得分:1)

有一种更简单的方法可以为每个部分显示阴影。

  1. 将表格视图的背景颜色设置为 UIColor.clear
  2. 将表格视图样式设置为分组(或者对于 iOS 13+,您甚至可以选择 Inset Grouped 样式,这也会为每个部分添加角)
  3. 为整个表格视图添加阴影。这将为每个部分添加阴影

给表格视图添加阴影:

tableView.layer.masksToBounds = false
tableView.layer.shadowColor = UIColor.black.withAlphaComponent(0.4).cgColor // any value you want
tableView.layer.shadowOpacity = 1 // any value you want
tableView.layer.shadowRadius = 100 // any value you want
tableView.layer.shadowOffset = .init(width: 0, height: 10) // any value you want

Result