Home / IOS Development / ios – Custom UITableViewCell does not display properly

ios – Custom UITableViewCell does not display properly

I created a custom UITableViewCell to use in a TableView. The cell appears correctly in the storyboard, but when I show it in TableView, it seems completely cluttered. I̵

7;ve looked at similar issues, but their issues seem to have been outlet names and Xcode errors. What am I missing?


class ArticleLargeTableViewCell: UITableViewCell {

public static let Identifier = "ArticleLargeTableViewCell"

@IBOutlet weak var shareButton: UIButton!
@IBOutlet weak var favoriteButton: UIButton!
@IBOutlet weak var articleImage: UIImageView!
@IBOutlet weak var articleType: UIImageView!
@IBOutlet weak var articleTitle: UILabel!
@IBOutlet weak var articleDate: UILabel!
@IBOutlet weak var articleSource: UILabel!
@IBOutlet weak var articleFavicon: UIImageView!
private var shareClickListener: (Article) -> Void = { _ in }
private var favoriteClickListener: (Article) -> Void = { _ in }
private var article: Article!

override class func awakeFromNib() {

func setData(article: Article, shareClickListener: @escaping (Article) -> Void, favoriteClickListener: @escaping (Article) -> Void, shouldShowMoreButton: Bool = true) {
    self.article = article
    articleImage.sd_setImage(with: article.getImageUrl())
    articleImage.contentMode = UIView.ContentMode.scaleAspectFill
    articleImage.clipsToBounds = true
    articleTitle.text = article.title
    let textColor = UIColor(named: "text")
    articleTitle.textColor = textColor
    articleSource.text = article.source.title
    articleSource.textColor = textColor
    articleDate.textColor = UIColor(named: "caption")
    articleDate.text = article.date.timeAgo()
    self.shareClickListener = shareClickListener
    self.favoriteClickListener = favoriteClickListener
    articleType.image = article.articleType().getTypeImage()
    articleFavicon.sd_setImage(with: URL(string: article.faviconUrl)!)
    favoriteButton.addTarget(self, action: #selector(self.onFavoriteButtonClick), for: .touchUpInside)
    shareButton.addTarget(self, action: #selector(self.onShareButtonClick), for: .touchUpInside)

@objc func onShareButtonClick() {

@objc func onFavoriteButtonClick() {


import Foundation
import UIKit
import Combine
import MaterialComponents.MaterialActionSheet

class ArticlesViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
    @IBOutlet weak var articlesList: UITableView!
    private var articles: [Article] = []
    var viewModel: ArticlesViewModel!
    private var useCompactView: Bool = true
    override func viewDidLoad() {
        articlesList.dataSource = self
        articlesList.delegate = self
        viewModel.$viewState.sink(receiveCompletion: { _ in}, receiveValue: { viewState in
            switch viewState {
            case .loading:
            case .error:
            case let .data(data):
                self.setData(data: data)
    private func setData(data: ArticlesViewModel.ViewState.Data) {
        self.articles = data.articles
        self.title = data.title
        self.useCompactView = data.useCompactView
        if self.useCompactView {
            articlesList.register(UINib(nibName: ArticleUiTableViewCell.Identifier, bundle: Bundle.main), forCellReuseIdentifier: ArticleUiTableViewCell.Identifier)
        } else {
            articlesList.register(UINib(nibName: ArticleLargeTableViewCell.Identifier, bundle: Bundle.main), forCellReuseIdentifier: ArticleLargeTableViewCell.Identifier)
    func numberOfSections(in tableView: UITableView) -> Int {
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return articles.count
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        if useCompactView {
            guard let cell = articlesList.dequeueReusableCell(withIdentifier: ArticleUiTableViewCell.Identifier, for: indexPath) as? ArticleUiTableViewCell else {
                fatalError("could not cast to articles cell")
            // display other cell
        } else {
            guard let cell = articlesList.dequeueReusableCell(withIdentifier: ArticleLargeTableViewCell.Identifier, for: indexPath) as? ArticleLargeTableViewCell else {
                fatalError("could not cast to articles cell")
            let article = articles[indexPath.item]
            cell.setData(article: article, shareClickListener: { article in
                self.shareLink(description: article.title, url: article.originalUrl)
            }, favoriteClickListener: { article in
                self.viewModel.favoriteArticle(article: article, delegate: UIApplication.shared.delegate)
            return cell


enter image description here

I have tried to return an explicit height as you can see below, but I get a similar error.

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

Source link