在表格视图单元格中添加集合视图 swift 3

Posted 2023-03-04

【中文标题】在表格视图单元格中添加集合视图 swift 3

【英文标题】：Adding a collection view inside a table view cell swift 3

【发布时间】：2017-04-30 13:27:02

【问题描述】：

我正在尝试显示表格视图，一旦您选择了一行，它将展开以显示该类别中产品的集合视图网格。我已经设法通过修改图像的高度约束（不是 xib 方法，我尝试过，没有成功）来扩展和显示图像的表格视图单元格，按照下面的教程但是我似乎无法让它工作，如果我插入一个集合视图。

http://codepany.com/blog/swift-3-expandable-table-view-cells/

这就是我想要达到的目标：

我的代码：

自定义表格视图单元格类

class ExpandableCell: UITableViewCell 

@IBOutlet weak var view: UIView!
@IBOutlet weak var label: UILabel!
@IBOutlet weak var img: UIImageView!
@IBOutlet weak var imgHeightConstraint: NSLayoutConstraint!
@IBOutlet weak var viewHeight: NSLayoutConstraint!

var isExpanded:Bool = false

    didSet
    
        if !isExpanded 
            self.imgHeightConstraint.constant = 0.0

         else 
            self.imgHeightConstraint.constant = 128.0
        
    


override func awakeFromNib() 
    super.awakeFromNib()
    // Initialization code




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

    // Configure the view for the selected state

视图控制器

class NewMenuVC: UIViewController, UITableViewDataSource, UITableViewDelegate 

    @IBOutlet weak var tableView: UITableView!
//    @IBOutlet weak var tableViewCell: UITableViewCell!
//    @IBOutlet weak var collectionView: UICollectionView!
//    @IBOutlet weak var collectionViewCell: UICollectionViewCell!

    let imgs = ["0", "1", "2", "0", "1", "2", "0", "1", "2", "0", "1", "2", "0", "1", "2", "0", "1", "2", "0", "1", "2"]
    let categories = ["Hamburgers", "Saver Menu", "Sides", "Desserts", "Drinks", "Offers", "Specials", "Wraps", "Chicken", "Meals"]

    var expandedRows = Set<Int>()

    //@IBOutlet weak var tableView: UITableView!

    override func viewDidLoad() 

        super.viewDidLoad()

        self.tableView.delegate = self

        self.tableView.dataSource = self

        self.tableView.rowHeight = UITableViewAutomaticDimension

    


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

        return 10
    

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

        let cell:ExpandableCell = tableView.dequeueReusableCell(withIdentifier: "ExpandableCell") as! ExpandableCell

        cell.img.image = UIImage(named: imgs[indexPath.row])

        cell.isExpanded = self.expandedRows.contains(indexPath.row)

        cell.label.text = categories[indexPath.row]

        return cell

    


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

        return 144.0

    

    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) 

        print(indexPath.row)

        guard let cell = tableView.cellForRow(at: indexPath) as? ExpandableCell

            else  return 



        switch cell.isExpanded

        

        case true:

            self.expandedRows.remove(indexPath.row)

        case false:

            self.expandedRows.insert(indexPath.row)

        

        cell.isExpanded = !cell.isExpanded


        self.tableView.beginUpdates()

        self.tableView.endUpdates()

    

【问题讨论】：

显示一些代码 .. 你已经做了什么 .. 你的问题到底是什么

我已经为我的 VC 和自定义表格视图单元添加了代码。谢谢

“我似乎无法正常工作” ...这不是您遇到问题的一个很好的描述。什么是不起作用？应用程序不会运行？应用程序崩溃？应用程序运行但显示小猫的图片时，您想显示汉堡包？

当我尝试在表格视图单元格内实现集合视图时，扩展部分停止运行，因此表格视图单元格包含标题，但一旦点击就不会展开

那么，当你有一个 ImageView，并且你改变了 ImageView 的高度约束常量，它是否可以正常工作？但是如果你使用 CollectionView 代替 ImageView，并且你改变了 CollectionView 的高度约束常量，没有任何反应？你确定你正确地分配了约束吗？

【参考方案1】：

现有方法： 我建议尝试使用部分标题（UITableViewHeaderFooterView）。点击部分标题后，您可以将行数设置为 1。 在这里您必须确保 rowHeight = 集合中项目数的高度。

这将包括太多的工作。

简化方法。 直接使用集合视图，并为垂直滚动配置节标题和布局。

【讨论】：

我想我会尝试“现有方法”的方法。在使标题看起来像一行方面，我可以增加标题本身的大小吗？我将如何注册标题上的水龙头？抱歉，我对编码很陌生。提前致谢

我增加了标题的大小，但是我似乎无法找到一个函数来注册标题本身的点击，只有行。有什么建议么？ @andyPaul

没有header Selection的功能，可以使用点击手势识别器。

或者您可以添加一个具有目标功能的按钮？

【参考方案2】：

CollectionViewCell.swift

import UIKit
class FriendCVCell: UICollectionViewCell 

    @IBOutlet weak var FriendNameLabel: UILabel!

    @IBOutlet weak var FriendMobileNOLabel: UILabel!

tableCell.swift

import UIKit

class MyPlanTVCell: UITableViewCell 

    @IBOutlet weak var collectionView: UICollectionView!

    @IBOutlet weak var PlanNameLabel: UILabel!

    @IBOutlet weak var MallNameLabel: UILabel!

    @IBOutlet weak var PlanDateLabel: UILabel!

    var FriendNameArray: NSArray = []

    override func awakeFromNib() 
        super.awakeFromNib()
        // Initialization code
        collectionView.delegate = self as! UICollectionViewDelegate
        collectionView.dataSource = self as! UICollectionViewDataSource
         FriendNameArray = ["Sunny", "Mike", "Tom", "Henry", "Jenny", "Neena", "Julia" ]

    



extension MyPlanTVCell
: UICollectionViewDelegate, UICollectionViewDataSource 
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int 
        return FriendNameArray.count

    
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
        //
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath) as! FriendCVCell
        //What is this CustomCollectionCell? Create a CustomCell with SubClass of UICollectionViewCell
        //Load images w.r.t IndexPath
    cell.collectionImageView.image = UIImage(named:"default"[indexPath.row])

    cell.FriendNameLabel.text = FriendNameArray[indexPath.row] as! String


        cell.backgroundColor = UIColor.green



        //gameNames[indexPath.row]
        return cell
    
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) 
        let clickedIndex = 
            imageNames[indexPath.row]
        print(clickedIndex)