MonoTouch: Custom drawing text always draws flip text

Question

Inside the UIView subclass, I override the Draw element to draw some custom text, but the text always displays as flip text.

This is the code I'm using:

class TextViewProblem : UIView { public override void Draw (RectangleF rect) { base.Draw (rect); CGContext g = UIGraphics.GetCurrentContext(); UIColor.White.SetFill(); g.SelectFont("Arial",16f,CGTextEncoding.MacRoman); UIColor.White.SetFill(); g.SetTextDrawingMode(CGTextDrawingMode.Fill); g.ShowTextAtPoint(1,25,"Yiannis 123"); } } 

And this is the result of this code:

Why does the text flip?

I run: MonoDevelop 2.4.2 iPhone Simulator 4.2 MonoTouch 3.2.6

You can download the project to reproduce this problem at this link: www.grbytes.com/downloads/TextProblem.zip

Answer 1

The image is upside down because the coordinate system for CoreGraphics is not the same as for UIKit, you need to apply a transformation that includes turning the rendering (scale x = 1, y = -1), and then translate it to height (x = 0, y = height).

You do this by applying a transform to the graphics context.

Answer 2

The code works here:

  CGContext g = UIGraphics.GetCurrentContext(); UIColor.White.SetFill(); g.ScaleCTM(1f,-1f); g.SelectFont("Arial",16f,CGTextEncoding.MacRoman); UIColor.White.SetFill(); g.SetTextDrawingMode(CGTextDrawingMode.Fill); g.ShowTextAtPoint(1,-50,"Yiannis 123"); 

Once you set the scale to -1 for Y, your coordinate system is now flipped. So, (0,0) is in the upper left, but lower left is now (0, -480), not (0.480). Therefore, pay attention to -50 in ShowTextAtPoint .

Answer 3

 using (CGContext g = UIGraphics.GetCurrentContext()) { g.ScaleCTM (1f, -1f); g.TranslateCTM (0, -Bounds.Height); .... 

Answer 4

This code works fine:

 public override void Draw (System.Drawing.RectangleF rect) { base.Draw (rect); CGContext g = UIGraphics.GetCurrentContext(); g.TranslateCTM(0,Bounds.Height); g.ScaleCTM(1f,-1f); g.DrawImage .......... } 

Tip: TranslateCTM first and then ScaleCTM.