How can you create a circle image on a table cell? For example:
This is our storyboard with the arrow pointing to where we are trying to draw a circle when we want to highlight the row:
Update:
Decided to do this using a custom font and associatedSwift library. As Leo pointed out it is overkill to generate a circle when you can use an image (or font). Was as easy as adding a new label and setting the font/icon:
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { .. if doHighlight { cell.statusLabel.setFAIcon(icon: .FACircle, iconSize: 6) } ..5 Answers5
The most performant way is to add an image that is round. Setting thecornerRadius will work, but it is a performance hog and it's an overkill for a simple colored circle.
Comments
if height & width = 50
View.clipsToBounds = true View.layer.cornerRadius= View.frame.size.width/2Comments
You can make a view that adds aCAShapeLayer with a circle:
@IBDesignable class CircleView: UIView { @IBInspectable public var fillColor: UIColor = #colorLiteral(red: 0, green: 0, blue: 1, alpha: 1) { didSet { shapeLayer.fillColor = fillColor.cgColor } } @IBInspectable public var strokeColor: UIColor = #colorLiteral(red: 1, green: 1, blue: 1, alpha: 0) { didSet { shapeLayer.strokeColor = strokeColor.cgColor } } @IBInspectable public var lineWidth: CGFloat = 0 { didSet { setNeedsLayout() } } lazy private var shapeLayer: CAShapeLayer = { let _shapeLayer = CAShapeLayer() _shapeLayer.fillColor = self.fillColor.cgColor _shapeLayer.strokeColor = self.strokeColor.cgColor self.layer.insertSublayer(_shapeLayer, at: 0) return _shapeLayer }() override func layoutSubviews() { super.layoutSubviews() let center = CGPoint(x: bounds.midX, y: bounds.midY) let radius = (min(bounds.size.width, bounds.size.height) - lineWidth) / 2 shapeLayer.path = UIBezierPath(arcCenter: center, radius: radius, startAngle: 0, endAngle: .pi * 2, clockwise: true).cgPath shapeLayer.lineWidth = lineWidth }}Note, that is@IBDesignable, so you'll be able to use it in Interface Builder. Just create a separate target ("File" - "New" - "Target...") and choose "Cocoa Touch Framework" and give it an appropriate name (e.g. if your app is "Foo", you'd call this framework "FooKit"). Then add the aboveUIView subclass to that framework, and you can reference this class in IB (just add aUIView object and change its base class toCircleView):
Comments
Add a UIView instance and set itslayer.cornerRadius to half its width/height.
Comments
class CircularImageView: UIImageView {override func layoutSubviews() { super.layoutSubviews() let radius: CGFloat = self.bounds.size.width / 2.0 self.layer.cornerRadius = radius self.clipsToBounds = true} }you can also make a circular image view which is subclass of UIImageView so you can set it directly to UIImageView...
Comments
Explore related questions
See similar questions with these tags.







