表视图控制器中的集合视图单元格(如Tinder消息选项卡)



这是我第一次使用Stack Overflow:(希望我能找到答案并给出我的知识。

我目前正在制作一个像Tinder或instagram风格的聊天应用程序来学习Swift。

正如你在Tinder上看到的,你可以滑动水平匹配的用户

https://i.stack.imgur.com/dFUcM.jpg

我想建立几乎相同的设计像那样。

在我的主板上,它就像

TableViewController
-collectionView
-collectionViewCell
-collectionViewFlowLayout
-tableViewCell
-contentView

像这样。

collectionView单元格适用于匹配的用户,和tableviewCells用于打开的聊天室。

我已经完成了聊天室的制作。

但集合视图部分从未出现。我试着为此制作Extension.swift文件,并像一样键入

extension TableViewController {

class RequestCVCell: UICollectionViewCell {
@IBOutlet weak var MatchedAvatar: UIImageView!
@IBOutlet weak var MatchedName: UILabel!
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
MatchedAvatar.layer.cornerRadius = 30
MatchedAvatar.clipsToBounds = true
}

let horizontalView = UIView(backgroundColor: .blue)
}
}

我想过建立一个类似的故事板

ViewController
-collectionView
-collectionViewCell
-collectionViewFlowLayout
-tableView
-contentView

我真的不知道为什么它不起作用(有什么办法我可以做得像火绒吗?

谢谢你的阅读,对不起我的英语,没有解释。

我在github上为您创建了一个示例项目https://github.com/manojaher88/CollectionViewInTableView

以下是可能帮助您的代码

// MARK:- CellType
enum CellType: Int, CaseIterable {
case newMatches = 0
case messages
}
// MARK:- NewMatch
struct NewMatch {
let name: String
let imageName: String
}
// MARK:- ViewController
class ViewController: UIViewController {
enum Constants {
static let nibName = "CollectionTableViewCell"
static let reuseIdentifier = "CollectionTableViewCell"
}
@IBOutlet weak var tableView: UITableView!
private var newMatches: [NewMatch] = []
private var newMessages: [NewMatch] = []
override func viewDidLoad() {
super.viewDidLoad()
setupTableView()
createDataSource()
}
private func setupTableView() {
tableView.delegate = self
tableView.dataSource = self
tableView.estimatedRowHeight = 100
tableView.rowHeight = UITableView.automaticDimension
let nibName = UINib(nibName: Constants.nibName, bundle: nil)
tableView.register(nibName, forCellReuseIdentifier: Constants.reuseIdentifier)
}
private func createDataSource() {
for i in 0...3 {
let newMatch = NewMatch(name: "Matches (i)", imageName: "image_1")
newMatches.append(newMatch)
}
for i in 0...3 {
let newMatch = NewMatch(name: "Messages (i)", imageName: "image_1")
newMessages.append(newMatch)
}
}
}
extension ViewController: UITableViewDelegate, UITableViewDataSource  {
func numberOfSections(in tableView: UITableView) -> Int {
return CellType.allCases.count
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 1
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
guard let cell = tableView.dequeueReusableCell(withIdentifier: Constants.reuseIdentifier, for: indexPath) as? CollectionTableViewCell else {
fatalError()
}
var dataSource: [NewMatch] = []
let cellType = CellType(rawValue: indexPath.section)
switch cellType {
case .newMatches:   dataSource = newMatches
case .messages:     dataSource = newMessages
case .none: break
}
cell.update(newModels: dataSource)
return cell
}
}
class CollectionTableViewCell: UITableViewCell {
enum Constants {
static let nibName = "CollectionViewCell"
static let reuseIdentifier = "CollectionViewCell"
}
@IBOutlet private weak var collectionView: UICollectionView!
private var models: [NewMatch] = []

override func awakeFromNib() {
super.awakeFromNib()
collectionView.delegate = self
collectionView.dataSource = self
let collectionViewCell = UINib(nibName: Constants.nibName, bundle: nil)
collectionView.register(collectionViewCell, forCellWithReuseIdentifier: Constants.reuseIdentifier)
}
func update(newModels: [NewMatch]) {
models.removeAll()
models.append(contentsOf: newModels)
collectionView.reloadData()
}
}
extension CollectionTableViewCell: UICollectionViewDelegate, UICollectionViewDataSource {
func numberOfSections(in collectionView: UICollectionView) -> Int {
return 1
}
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return models.count
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
guard let cell = collectionView.dequeueReusableCell(withReuseIdentifier: Constants.reuseIdentifier, for: indexPath) as? CollectionViewCell else {
fatalError()
}
let model = models[indexPath.section]
cell.userImage.image = UIImage(named: model.imageName)
cell.userName.text = model.name
return cell
}
}
class CollectionViewCell: UICollectionViewCell {
@IBOutlet weak var userImage: UIImageView!
@IBOutlet weak var userName: UILabel!
override func prepareForReuse() {
userImage.image = nil
}
}

最新更新