在Swift中为Image添加标签

Question

Im new to swift and working on app which displays number of unread messages like below image within the app

Counter will increase/decreases as the new messages gets added/read

In order to display that, I have Image with mail icon and wanted to add that green label as badge which shows the number of unread messages

I was thinking to add circular label to image but couldnt figure out how to add that or find any references. Please assist

Answer 1

I was thinking to add circular label to image but couldnt figure out how to add that or find any references. Please assist.

Welcome to Stackoverflow. There are lots of resources out there on how to round a view, like: https://www.appcoda.com/ios-programming-circular-image-calayer/

You are correct, one way to do what you want is to add a circular label. That's it. Now how to add a circular label? You round the corner of your view by giving its cornerRadius the half of its height .

Position the label to your desired position (with constraints) referencing your message icon. For example:

class ViewController: UIViewController {

    @IBOutlet weak var label: UILabel!

    override func viewDidLoad() {
        super.viewDidLoad()

        // Corner radius to 25 height / 2
        self.label.layer.cornerRadius = 12.5
        self.label.clipsToBounds = true

        // Border
        self.label.layer.borderWidth = 2
        self.label.layer.borderColor = UIColor.black.cgColor

    }
}

Result: