在 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 中为我还没有的图像保留空间