在 UITableViewCell 中包含图像的 CollectionView

Posted

技术标签:

【中文标题】在 UITableViewCell 中包含图像的 CollectionView【英文标题】:CollectionView with images inside a TableViewCell 【发布时间】:2017-02-17 11:11:00 【问题描述】:

我想要一个有 5 个 CollectionView 的 TableView 一个一个。集合视图必须显示水平滚动的图像。我遵循了这个教程:https://ashfurrow.com/blog/putting-a-uicollectionview-in-a-uitableviewcell-in-swift/

但我希望图像在我的 CollectionView 中滚动。我不知道该怎么做。

这是我的示例代码:

    import UIKit

    class ViewController1: UIViewController, UITableViewDataSource, UITableViewDelegate, UICollectionViewDelegateFlowLayout 

    @IBOutlet var tableView: UITableView!

    var images = [UIImage(named:"banner2"),UIImage(named:"banner1"),UIImage(named:"banner3"),UIImage(named:"banner4"),UIImage(named:"banner5")]

     var storedOffsets = [Int: CGFloat]()

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

      func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell 
           let cell = tableView.dequeueReusableCell(withIdentifier: "cell2", for: indexPath) as! Cell2
          cell.frame = CGRect(x: 0, y: 28, width: 375, height: 202)
            cell.myCollection.reloadData()
            return cell
        

        func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) 
                guard let tableViewCell = cell as? Cell2 else  return 
                tableViewCell.setCollectionViewDataSourceDelegate(self, forRow: indexPath.row)
                tableViewCell.collectionViewOffset = storedOffsets[indexPath.row] ?? 0
            

       func tableView(_ tableView: UITableView, didEndDisplaying cell: UITableViewCell, forRowAt indexPath: IndexPath) 
            guard let tableViewCell = cell as? Cell2 else  return 
            storedOffsets[indexPath.row] = tableViewCell.collectionViewOffset
        
    

extension ViewController1: UICollectionViewDelegate, UICollectionViewDataSource 

        func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int 
            return images.count
        

        func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
            let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell1", for: indexPath) as! Cell1
            cell.image.image = images[(indexPath as NSIndexPath).row]      
            return cell
        

        func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) 
            print("Collection view at row \(collectionView.tag) selected index path \(indexPath)")
        
    


import UIKit
class Cell1: UICollectionViewCell 

        @IBOutlet var image: UIImageView!

        override init(frame: CGRect) 
            super.init(frame: frame)
               image.frame = CGRect(x: 0, y: 0, width: 175, height: 175) // Here I get exc_bad_instruction (code=exc_i386_invop subcode=0x0) warning
               contentView.backgroundColor = UIColor.green
            self.contentView.addSubview(image)
        

        required init?(coder aDecoder: NSCoder) 
            super.init(coder: aDecoder)   
        
    

import UIKit

class Cell2: UITableViewCell 

        @IBOutlet var myCollection: UICollectionView!

        override func awakeFromNib() 
            myCollection.frame = CGRect(x: 0, y: 28, width: 375, height: 202)   
        
    

extension Cell2 

           func setCollectionViewDataSourceDelegate<D: UICollectionViewDataSource & UICollectionViewDelegate>(_ dataSourceDelegate: D, forRow row: Int) 

              self.myCollection.delegate = dataSourceDelegate
               self.myCollection.dataSource = dataSourceDelegate
                myCollection.tag = row
                myCollection.setContentOffset(myCollection.contentOffset, animated:false) // Stops collection view if it was scrolling.
                    let layout = UICollectionViewFlowLayout.init()
                    layout.scrollDirection = .horizontal
                    layout.sectionInset = UIEdgeInsets(top: 5, left: 0, bottom: 5, right: 0)
                    layout.minimumInteritemSpacing = 0
                    layout.minimumLineSpacing = 0
                    layout.itemSize = CGSize(width: 182, height: 182)
                    myCollection = UICollectionView.init(frame: myCollection.frame, collectionViewLayout: layout)
                    myCollection.register(Cell1.self, forCellWithReuseIdentifier: "cell1")
                    self.contentView.addSubview(myCollection)
                myCollection.reloadData()
            

var collectionViewOffset: CGFloat 
    set  myCollection.contentOffset.x = newValue 
    get  return myCollection.contentOffset.x 
   

粉红色的 TableView(我设置了颜色)和黑色的 CollectionView(再次,我设置了颜色)我无法查看我设置为 greenColor 的图像或 CollectionViewCells。当触摸粉红色部分或尝试滚动时,我收到错误:fatal error: unexpectedly found nil while unwrapping an Optional value 并带有警告 - exc_bad_instruction (code=exc_i386_invop subcode=0x0)

谁能告诉我怎么做?提前致谢

我使用 Xcode 8 和 Swift 3。

【问题讨论】:

你需要用UITableViewCell实现UICollectionViewDataSorce和委托方法,而不是ViewController1 是的,我尝试过这样做。它给了我相同的输出 【参考方案1】:

我在 OBJECTIVE-C 中有 sn-p,我认为你必须转换为 swift 3.0

这是我的代码

你可以试试

tablecell cellForRowAtIndexPath

 static NSString *CellIdentifier = @"cell3";
        CollectionViewTableCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
        if (cell == nil) 
            cell = [[CollectionViewTableCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:CellIdentifier];
        
        cell.headerLabel.text = @"DISH TYPE";

        cell.collectionView.delegate = self;
        cell.collectionView.dataSource = self;
        cell.collectionView.tag = indexPath.row;
        [cell.collectionView reloadData];

和集合视图 cellForItemAtIndexPath

 if(collectionView.tag == 4)
        FIPhotoCollectionCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"foodTagCell" forIndexPath:indexPath];
        NSDictionary *dic = [arrAmenities objectAtIndex:indexPath.row];

        NSMutableDictionary *dic1 = [selectedAmenities objectAtIndex:indexPath.row];


            NSURL *url = [NSURL URLWithString:[dic valueForKey:@"ImageURL"]];
            [cell.photoImage sd_setImageWithURL:url placeholderImage:[UIImage imageNamed:@""]];


        return cell;
 

【讨论】:

我应该在 ViewController 中添加 TableCell cellForRowAtIndexPath 的代码,在 TableViewCell 类中添加 CollectionCell cellForItemAtIndexPath 的代码吗?因为如您所见,我的外部 ViewController 中有 CollectionView cellForItemAtIndexPath 方法,当我在那里添加时,它显示 ----if(myCollection.tag == 0) 未解决使用标识符“myCollection”---你能解释一下吗? @AraRose :您可以尝试将 myCollection 替换为 collectionView。

以上是关于在 UITableViewCell 中包含图像的 CollectionView的主要内容,如果未能解决你的问题,请参考以下文章

在点击时全屏显示 UITableViewCell 中包含的 UIImageView 并带有动画

iOS 中包含 UIWebView 的单元格的动态 UITableViewCell 高度

如何在默认样式的 UITableViewCell 中为我还没有的图像保留空间

检测点击UITableViewCell中包含多个部分的UITableView的按钮

插入 UITableViewCell 不起作用

使用 POST 在网页中包含动态图像?