Table View Cells

Core

A family of UITableViewCell subclasses. TTBaseUITableViewCell is the base β€” provides a padded panel sub-view, selection highlight, skeleton animation, and bottom border support. Specialized subclasses provide ready-made content layouts.

ClassLayout
TTBaseUITableViewCellBase cell β€” empty panel, subclass and fill
BaseShadowTableViewCellCell with shadow card effect on panel
BaseTextSubtextHorTableViewCellHorizontal: left label + right label (key-value)
IconTextSubtextTableViewCellIcon (left) + title + subtitle (right)
IconTextSubtextTextSubTextRightTableViewCellIcon + texts left + texts right
TextIconTableViewCellText (left) + icon (right)
TextSubtextIconTableViewCellTitle + subtitle + icon (right)

πŸš€ Usage

// Register and dequeue
tableView.register(TTBaseUITableViewCell.self,
                   forCellReuseIdentifier: TTBaseUITableViewCell.reuseIdentifier)

let cell = tableView.dequeueReusableCell(
    withIdentifier: TTBaseUITableViewCell.reuseIdentifier,
    for: indexPath
) as! TTBaseUITableViewCell

// Subclass and add your content
class ProductCell: TTBaseUITableViewCell {
    let nameLabel = TTBaseUILabel(withType: .TITLE, text: "", align: .left)
    let priceLabel = TTBaseUILabel(withType: .SUB_TITLE, text: "", align: .right)

    override func updateUI() {
        panel.addSubview(nameLabel)
        panel.addSubview(priceLabel)
        // ... constraints
    }

    func configure(product: Product) {
        nameLabel.setText(text: product.name)
        priceLabel.setText(text: "$\(product.price)")
    }
}

// Override padding
override var padding: (CGFloat, CGFloat, CGFloat, CGFloat) {
    return (16, 8, 16, 8)
}

// Bottom border separator
override var isSetBoderBottom: Bool { return true }

// Skeleton loading
cell.setSkeletonAnimation().done()
cell.onStartSkeletonAnimation()
// ... later:
cell.onStopSkeletonAnimation()

πŸ“– Base API Reference

MemberTypeDescription
panelTTBaseUIViewContent container with bg and corner radius
bgColorUIColorOverride: normal cell bg
bgSelectColorUIColorOverride: selected state bg
padding(CGFloatΓ—4)Override: panel insets from cell edges
cornerRadiusCGFloatOverride: panel corner radius
isSetBoderBottomBoolOverride: add 1pt bottom border to panel
onStartSkeletonAnimation()MethodShow shimmer on all labels/images/buttons
onStopSkeletonAnimation()MethodRemove shimmer and restore content
setBgPanelView(color:)MethodChange panel background at runtime
getTableView()MethodGet parent UITableView reference
Pro Tip: Use setSkeletonAnimation() + onStartSkeletonAnimation() while waiting for network data, then call onStopSkeletonAnimation() in your data refresh block. The skeleton layer covers the entire panel automatically.