0

On watchOS I draw a circle using the following code:

// Create a graphics context
UIGraphicsBeginImageContext(CGSize.init(width: 18.0, height: 18.0))
let context = UIGraphicsGetCurrentContext()

// Draw a circle
let rect = CGRect.init(x: 1.0, y: 1.0, width: 16.0, height: 16.0)
let border = UIBezierPath(ovalIn: rect)
border.lineWidth = 1.0
UIColor.white.setStroke()
border.stroke()

// Convert to UIImage
let cgimage = context!.makeImage();
let uiimage = UIImage(cgImage: cgimage!)

// End the graphics context
UIGraphicsEndImageContext()  

The circle is drawn, but it looks ugly, as if there were a Moire pattern, see picture, left of the "XX" text:
enter image description here
It should be possible to avoid this pattern and draw a clean circle, since the time is also displayed clearly. But how?

Reinhard Männer
  • 14,022
  • 5
  • 54
  • 116

1 Answers1

1

UIGraphicsBeginImageContext creates a context with draw scale of 1. In other words, it's non-Retina.

Try replacing

UIGraphicsBeginImageContext(CGSize.init(width: 18.0, height: 18.0))

with

UIGraphicsBeginImageContextWithOptions(CGSize.init(width: 18.0, height: 18.0), false, 0)

Specifying 0 for the screen scale makes it default to the current screen scale. Let me know if that doesn't work. :)

TiM
  • 15,812
  • 4
  • 51
  • 79