在 tableview 内的 collectionview 上显示图像

Posted 2023-03-04

【中文标题】在 tableview 内的 collectionview 上显示图像

【英文标题】：display images on collectionview inside tableview

【发布时间】：2017-12-21 06:49:52

【问题描述】：

我正在尝试。

我实现了这样的代码

 //Model
    import UIKit
    import Firebase

    struct Post 

        var key: String
        var Date: String
        var tweetImageUrl = [URL]()
        var Text: String

        init(snapshot: DataSnapshot) 

            self.key = snapshot.key
            self.Date = (snapshot.value as! NSDictionary)["Date"] as? String ?? ""
            self.Text = (snapshot.value as! NSDictionary)["Text"] as? String ?? ""
          if let urls = (snapshot.value as! NSDictionary)["tweetImageUrl"] as? [String:String] 
                 for (_,value) in urls 
              if let finalUrl = URL(string: value) 
                         tweetImageUrl.append(finalUrl)
                 
              
            
         
    

//tableviewcell
import UIKit

class TimellineTableViewCell: UITableViewCell 

    @IBOutlet var profileImage: UIImageView!
    @IBOutlet var tempoName: UILabel!
    @IBOutlet var dateLabel: UILabel!
    @IBOutlet var caption: UILabel!
    @IBOutlet var collectionView: UICollectionView!

    var post: Post? 
        didSet 
            tempoName.text = "channing"
            dateLabel.text = post?.Date
            caption.text = post?.Text
            profileImage.image = #imageLiteral(resourceName: "heart")
        
    

    override func awakeFromNib() 
        super.awakeFromNib()

        collectionView.delegate = self
        collectionView.dataSource = self
        profileImage.layer.cornerRadius = 30.0
        profileImage.layer.masksToBounds = true
    
//class

extension TimellineTableViewCell: UICollectionViewDelegate, UICollectionViewDataSource 

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int 
        guard let count = post?.tweetImageUrl.count else  return 0 
        return count
    

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "timeLineCell", for: indexPath) as! TimelineCollectionViewCell

        cell.configCell(post: post)

        return cell
    
//extension

//collectionviewcell
import UIKit

class TimelineCollectionViewCell: UICollectionViewCell 


    @IBOutlet var imageView: UIImageView!


    override func awakeFromNib() 
        super.awakeFromNib()
    

    func configCell(post: Post?) 

        guard let imageUrl = post?.tweetImageUrl else  return 

        for url in imageUrl 

            URLSession.shared.dataTask(with: url, completionHandler:  (data, res, err) in

                guard let data = data else  return 
                let image = UIImage(data: data)

                DispatchQueue.main.async 
                    self.imageView.image = image
                
            ).resume()
        
    
//class

//viewcontroller
import UIKit
import Firebase

class TimelineViewController: UIViewController, UITableViewDataSource, UITableViewDelegate 

    @IBOutlet var TimelinetableView: UITableView!

    var ref: DatabaseReference! 
        return Database.database().reference()
    
    let uid = Auth.auth().currentUser?.uid
    var tweets = [Post]()

    override func viewDidLoad() 
        super.viewDidLoad()

        self.TimelinetableView.rowHeight = UITableViewAutomaticDimension
        self.TimelinetableView.estimatedRowHeight = 300
        fetchTweets()
    

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

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int 
        return tweets.count
    

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

        let cell = TimelinetableView.dequeueReusableCell(withIdentifier: "tableCell", for: indexPath) as! TimellineTableViewCell

        cell.post = tweets[indexPath.row]

        return cell
    

    func fetchTweets() 
        ref.child("TWEETS").child(uid!).observe(.value, with:  (snapshot) in

            var result = [Post]()
            for post in snapshot.children 
                let post = Post(snapshot: post as! DataSnapshot)
                result.append(post)
            
            self.tweets = result.sorted(by:  (p1, p2) -> Bool in
                p1.Date > p2.Date
            )
            self.TimelinetableView.reloadData()            
        , withCancel: nil)

    //func

//class

但是如果我运行它，模拟器看起来像这样

如果我选择了其中一个单元格，则会出现除了 collectionview 上的 imageview 之外的组件。如果未选择单元格，则模拟器看起来像一个显示“非常有趣”的单元格。有谁知道如何解决这个问题？

【问题讨论】：

您可以通过按 Shift-Command-4 并在所需区域周围拖动一个框来截取屏幕的一部分。它看起来比图片好看。 :-) support.apple.com/en-us/HT201361

单元格自定义高亮：***.com/a/31512042/2450755 单元格自定义选择：***.com/a/27475774/2450755

谢谢石头。下次我会这样做的！

再次感谢安德里亚！！但这与背景颜色有关吗？

是关于在高亮/取消高亮或选择/取消选择单元格期间准确控制您想要自定义的内容（背景、标签、单元格内可能有的任何内容）的可能性。您想定制（或修复）什么？从上面的问题，我不清楚。

【参考方案1】：

这是关于约束而不是代码。所以，在我适当地给予约束之后，它工作得很好。

【讨论】：

嗨 - 我和你一样陷入了同样的困境，尽管两年多过去了。我必须编码工作正常，但无法正确显示集合视图。您还记得您为使集合视图内容正确显示所做的工作吗？

我记不太清了，但我想我对 collectionvlew 进行了限制，比如 collectionvlew 应该远离 tablevlew 的底部边缘多少 px。另外我使用了故事板，所以我不能给你代码抱歉:(我希望这会有所帮助。