IOS drawing a simple image turns out blurry using Xamarin C#

Question

I'm developing in Xamarin and would like to draw a simple circle with the text "CIRCLE" inside it and display that image in a UIImageView. The problem is that the circle and text appear very blurry. I've read a bit about subpixels but I don't think that's my problem.

Here's the blurry image and code, hoping someone has some ideas :)

UIGraphics.BeginImageContext (new SizeF(150,150));
var context = UIGraphics.GetCurrentContext ();

var content = "CIRCLE";
var font = UIFont.SystemFontOfSize (16);

const float width = 150;
const float height = 150;

context.SetFillColorWithColor (UIColor.Red.CGColor);
context.FillEllipseInRect (new RectangleF (0, 0, width, height));

var contentString = new NSString (content);
var contentSize = contentString.StringSize (font);

var rect = new RectangleF (0, ((height - contentSize.Height) / 2) + 0, width, contentSize.Height);

context.SetFillColorWithColor (UIColor.White.CGColor);
new NSString (content).DrawString (rect, font, UILineBreakMode.WordWrap, UITextAlignment.Center);

var image = UIGraphics.GetImageFromCurrentImageContext ();
imageView.Image = image;

Answer 1

The reason why it's blurry is because it was resized. That bitmap is not 150x150 (like the context you created), it's 333x317 pixels.

It could be because imageView is scaling it's image (there's no source code) or because of pixel doubling (for retina displays). In the later case what you really want to use is:

UIGraphics.BeginImageContextWithOptions (size, false, 0);

which will (using 0) automagically use the right scaling factor for retina (or not) display - and look crisp (and not oversized) on all types of devices.