StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POHow to draw text with attributes (Specifically Stroke and Fill color) in UIGraphicsImageContext for iPhone
text
Body
copied!<p>I am trying to create an image of text to put on top of another image. The text needs to have a white fill and a black stroke outline. I am using objective-C and it is for the iPhone. I can get the text to show up; however, I cannot seam to figure out how to get the stroke and fill color to change.</p> <p><code>self.bigImage</code> is a pointer to a UIImage in my xib. </p> <p>Here is my code: (This code works... I want it to have a black stroke with white fill however)</p> <pre><code>- (IBAction)submitBtn:(id)sender { UIFont *myfont = [UIFont fontWithName:@"myfont" size:32]; UIImage *textImage = [self imageFromText:@"teststring" font:myfont]; CGSize finalSize = [self.bigImage.image size]; CGSize textSize = [textImage size]; UIGraphicsBeginImageContext(finalSize); [self.bigImage.image drawInRect:CGRectMake(0,0, finalSize.width, finalSize.height)]; [textImage drawInRect:CGRectMake(0, 0, textSize.width, textSize.height)]; UIImage *newImg = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); self.bigImage.image = newImg; } -(UIImage *)imageFromText:(NSString *)text font:(UIFont *)font { CGSize size = [text sizeWithFont:font]; // check if UIGraphicsBeginImageContextWithOptions is available (iOS is 4.0+) if (UIGraphicsBeginImageContextWithOptions != NULL) UIGraphicsBeginImageContextWithOptions(size,NO,0.0); else // iOS is < 4.0 UIGraphicsBeginImageContext(size); [text drawAtPoint:CGPointMake(0.0, 0.0) withFont:font]; // transfer image UIImage *Image = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); return Image; } </code></pre> <p><br /> <br /> I can get it to render one or the other. If I add this code I get a black stroke:</p> <pre><code>CGContextSetTextDrawingMode(UIGraphicsGetCurrentContext(), kCGTextStroke); CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 2); CGContextSetStrokeColorWithColor(UIGraphicsGetCurrentContext(), [[UIColor blackColor] CGColor]); </code></pre> <p><br /> <br /> If I add this code I get a white font:</p> <pre><code>CGFloat fontColor[4] = {255,255,255,1}; CGContextSetFillColor(UIGraphicsGetCurrentContext(), fontColor); </code></pre> <p>But If I add both snipets I get the black stroke but the font color is transparent...</p> <p><br /> <br /> <strong>Solved:</strong> thanks to a little help from 'Brane':</p> <p>I needed to add this bit of code before the <code>drawAtPoint</code>:</p> <pre><code>CGFloat fontColor[4] = {255,255,255,1}; CGContextSetFillColor(UIGraphicsGetCurrentContext(), fontColor); CGContextSetTextDrawingMode(UIGraphicsGetCurrentContext(), kCGTextFillStroke); CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 2); CGContextSetStrokeColorWithColor(UIGraphicsGetCurrentContext(), [[UIColor blackColor] CGColor]); </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload