Custom View with UIKit vs SwiftUI: BadgeView

Photo by Maxwell Nelson on Unsplash

Customizing views during an iOS app/framework development could be a very common task. In this article, I’ll present how to creating a customized view, a Badge View, in both SwiftUI and UIKit.

Here is an image of what we expect as the final result:

Displaying 100 with orange background.

With UIKit ,

//
//  BadgeView.swift
//
//  Created by Antonio081014 on 2/11/23.
//  Copyright © 2023 Antonio081014.com. All rights reserved.
//

import UIKit

class BadgeView: UIView {
    private lazy var displayLabel: UILabel = {
        let label = UILabel()
        label.textAlignment = .center
        label.translatesAutoresizingMaskIntoConstraints = false
        return label
    }()
    
    private static let defaultTextFont = UIFont.preferredFont(forTextStyle: .headline)
    private static let defaultTextColor = UIColor.white
    private static let defaultBadgeBackgroundColor = UIColor.systemOrange
    
    private override init(frame: CGRect) {
        super.init(frame: frame)
    }
    
    private func setupViews() {
        self.backgroundColor = BadgeView.defaultBadgeBackgroundColor
        self.displayLabel.textColor = BadgeView.defaultTextColor
        self.displayLabel.font =…