• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

ios - 滚动后 UITableView 单元格正确

[复制链接]
菜鸟教程小白 发表于 2022-12-11 19:32:41 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题

我创建了一个 Swift UITableView 帖子,每个帖子都包含一些文本和图表图像。使用 SDWebImage 和 Firebase 异步加载图像。图片有不同的高度,但宽度是固定的。

这是一个显示显示问题的短视频:https://youtu.be/QzQFT2z0GjA

有些单元格第一次显示不正确,但滚动后看起来很完美。我读到了关于使用 layoutIfNeeded 和 setNeedsLayout as suggested in this post或 iOS 11 UITableViewAutomaticDimension 但在我的情况下似乎不起作用。

这是我的代码:

var postArray : [Post] = [Post]()

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.

    postTableView.delegate = self
    postTableView.dataSource = self
    aLaUneWidthConstraint.constant = view.frame.size.width/2

    etatFranceWidthConstraint.constant = view.frame.size.width/2
    postTableView.register(UINib(nibName:"TableViewCell", bundle: nil), forCellReuseIdentifier: "postCell")



    activityIndicator.activityIndicatorViewStyle = UIActivityIndicatorViewStyle.gray
    activityIndicator.startAnimating()

    retrievePosts()

}

override func viewWillAppear(_ animated: Bool) {
    self.navigationController?.isNavigationBarHidden = true
}

func numberOfSections(in tableView: UITableView) -> Int {
    return 1
}

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

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

    let cell = tableView.dequeueReusableCell(withIdentifier: "postCell", for: indexPath) as! TableViewCell

    tableView.separatorStyle = UITableViewCellSeparatorStyle.none
    cell.selectionStyle = UITableViewCellSelectionStyle.none

    cell.postTitle.text = postArray[indexPath.row].title
    cell.postSource.text = postArray[indexPath.row].source
    cell.postChart.sd_setImage(with: URL(string: postArray[indexPath.row].chartURL!), placeholderImage: UIImage(named: "placeholder.png")) { (image, error, cache, url) in
        cell.chartHeightConstraint.constant = ((cell.postChart.image?.size.height)!/2)
        cell.setNeedsLayout()
        cell.layoutIfNeeded()
    }

    return cell

}

func retrievePosts() {

    let postDB = Database.database().reference().child("osts")

    postDB.observe(.childAdded, with: { (snapshot) in

        let snapshotValue = snapshot.value as! NSDictionary

        let title = snapshotValue["title"] as! String
        let source = snapshotValue["source"] as! String
        let chartURL = snapshotValue["chartURL"] as! String
        let category = snapshotValue["category"] as! String

        let post = Post(data: snapshotValue)
        post.title = title
        post.source = source
        post.chartURL = chartURL
        post.category = category

        self.postArray.append(post)

        self.activityIndicator.stopAnimating()
        self.activityView.isHidden = true
        self.activityView.frame.size.height = 0
        self.postTableView.reloadData()

    })

}

有什么想法吗?提前致谢。



Best Answer-推荐答案


解决方案包括在 Post 对象中添加 chartWidth 和 chartHeight 参数,并为 Firebase 数据库中的每个帖子添加它们的值,然后设置一些约束以在下载图像之前预先计算单元格高度。

在 TableViewCell.swift 中添加:

func setChartSize(size: CGSize) {
    postChart.removeConstraint(postChartRatioConstraint)

    postChartRatioConstraint = NSLayoutConstraint(
        item: postChart,
        attribute: .height,
        relatedBy: .equal,
        toItem: postChart,
        attribute: .width,
        multiplier: (size.height / size.width),
        constant: 0)

    postChart.addConstraint(postChartRatioConstraint)
}

在 ViewController 中使用 setChartSize 函数:

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

    let cell = tableView.dequeueReusableCell(withIdentifier: "postCell", for: indexPath) as! TableViewCell

    tableView.separatorStyle = UITableViewCellSeparatorStyle.none
    cell.selectionStyle = UITableViewCellSelectionStyle.none

    let post = postArray[indexPath.row]

    cell.postTitle.text = post.title
    cell.postSource.text = post.source

    cell.postChart.sd_setShowActivityIndicatorView(true)
    cell.postChart.sd_setIndicatorStyle(.white)

    cell.setChartSize(size: CGSize(width: post.chartWidth!, height: post.chartHeight!))
    cell.postChart.sd_setImage(
        with: URL(string: post.chartURL!),
        placeholderImage: UIImage(named: "placeholder.png"),
        options: [.continueInBackground],
        completed: nil)

    return cell
}

下载图表后调整单元格大小等任何其他选项都会生成滚动跳转。

关于ios - 滚动后 UITableView 单元格正确,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48057813/

回复

使用道具 举报

懒得打字嘛,点击右侧快捷回复 【右侧内容,后台自定义】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关注0

粉丝2

帖子830918

发布主题
阅读排行 更多
广告位

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap