zul_mzmz
zul_mzmz

Reputation: 53

UITableViewCell with UIImageView - Incorrect width at first load

I have a UITableView with the cells contain customized layers like shadows, drawing lines and corner radiuses. I have done the design through Storyboard using Autolayout in IPhone SE view size.

The problem is when first initialize of UITableView it show like this (which is not should be) :

First UITableView show

However, when scrolling to bottom, it shows as what it should be, like this:

After scrolling

I have done so many things to make it updated such as:

cell?.imageView.invalidateIntrinsicContentSize()
cell?.imageView.setNeedsUpdateConstraints()
cell?.imageView.setNeedsLayout()
cell?.imageView.layoutIfNeeded()
cell?.imageView.setNeedsDisplay()
cell?.imageView.translatesAutoresizingMaskIntoConstraints = false

but it doesn't work.

So, any ideas for that to make it as second picture after the first display loaded?

- Updated -

Here the cellForRow for corresponding tableView:

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

        var cell: GProjectsFTContentTVCell = tableView.dequeueReusableCell(withIdentifier: "GProjFTContentHeaderCellID") as! GProjectsFTContentTVCell

        cell.performPopulateData(data: self.contentInfo![indexPath.row])

        tableView.reloadRows(at: [indexPath], with: UITableView.RowAnimation.automatic)

        return cell
    }

and its cell class:

func performPopulateData(data: APIJSON.ProjectList)
{
   let urlFriendlyFileName: String? = data.cover?.replacingOccurrences(of: " ", with: "%20")
        self.vwGPFTCTVCBannerPanel.layer.cornerRadius = 20
        self.vwGPFTCTVCBannerPanel.dropShadow()
        self.ivGPFTCTVCBannerImage.roundCorners(corners: [.topLeft, .topRight], radius: 20.0)

        AF.request(urlFriendlyFileName ?? "").responseImage(completionHandler: { response in

            if let image = response.value {
                self.ivGPFTCTVCBannerImage.image = image

            }
        })

        self.lblGPFTCTVCTitle.text = data.title
        self.lblGPFTCTVCTitle.font = FontPredefine.SFProSemiBold(withSize: 16.0)
        self.lblGPFTCTVCTitle.textColor = ColorPredefine.greenTextColor
        self.lblGPFTCTVCSubTitle.text = data.subtitle
        self.lblGPFTCTVCSubTitle.font = FontPredefine.SFProRegular(withSize: 12.0)

}

For layout, what I have done is like this:

Layout constraints visual

Layout constraints values

Upvotes: 1

Views: 465

Answers (1)

zul_mzmz
zul_mzmz

Reputation: 53

Bingo! I have spent hours to fix on this thing, I have been silly as I missed on this important thing, that I simply need to put on this code:

DispatchQueue.main.async {
    cell?.performPopulateData(data: self.contentInfo![indexPath.row])
}

and now it works as what it should be. Thanks to @Rob for give me this idea.

Upvotes: 1

Related Questions