Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it possible to alter the letter-spacing/kerning of a font with Cocoa Touch?

I've been scouring the Internet for a while now for information on how one can alter the letter-spacing/kerning of a font within UIKit.

My fear is, that like using your own custom fonts, you simply can't. Which would be terrible news.

I know Apple is protecting us from bad design with these constraints, but they're also preventing us from implementing really great design too.

What do people suggest I do?

  1. Use the font with the standard kerning, people probably wouldn't notice the difference anyway.

  2. Find someone's hacked class to get the look the user deserves after parting with their hard earned cash.

  3. Use the method that I've somehow overlooked, and do it with UIKit, pledging my eternal gratitude to the person who imparts this hidden nugget of knowledge.

like image 851
Tricky Avatar asked Jun 30 '09 11:06

Tricky


People also ask

How does spaces between fonts are adjusted through kerning?

What is kerning? Kerning typography is the spacing between individual letters or characters. Unlike tracking, which adjusts the amount of space between the letters of an entire word in equal increments, kerning is focused creating readable text that's visually pleasing.

How do you control kerning?

To adjust kerning visually, click between two letters with the Type tool, and then press Option (macOS) or Alt (Windows) + left/right arrows. To reset tracking and kerning to default settings, select the text with the Type tool. Press Cmd+Option+Q (macOS) or Ctrl+Alt+Q (Windows).


1 Answers

The accepted answer lost a lot of the formatting, and user363349's answer mostly worked for me but text alignment wasn't working. I modified the code to fix that:

- (void) drawRect:(CGRect)rect
{
    // Drawing code
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSelectFont (context, [self.font.fontName cStringUsingEncoding:NSASCIIStringEncoding], self.font.pointSize, kCGEncodingMacRoman);
    CGContextSetCharacterSpacing(context, characterSpacing);
    CGContextSetFillColorWithColor(context, [[UIColor clearColor] CGColor]);
    CGAffineTransform myTextTransform = CGAffineTransformScale(CGAffineTransformIdentity, 1.f, -1.f );

    CGContextSetTextMatrix (context, myTextTransform);

    // draw 1 but invisbly to get the string length.
    CGPoint p =CGContextGetTextPosition(context);
    float centeredY = (self.font.pointSize + (self.frame.size.height- self.font.pointSize)/2)-2;
    CGContextShowTextAtPoint(context, 0, centeredY, [self.text cStringUsingEncoding:NSASCIIStringEncoding], [self.text length]);
    CGPoint v =CGContextGetTextPosition(context);

    // calculate width and draw second one.
    float width = v.x - p.x;
    float destX = 0;

    // calculate X position based on alignment
    if([self textAlignment] == UITextAlignmentLeft){
        destX = 0;
    }else if([self textAlignment] == UITextAlignmentCenter){
        destX = (self.frame.size.width- width)/2;
    }else if([self textAlignment] == UITextAlignmentRight){
        destX = self.frame.size.width - width;
    }
    CGContextSetFillColorWithColor(context, [self.textColor CGColor]);
    CGContextShowTextAtPoint(context, destX, centeredY, [self.text cStringUsingEncoding:NSASCIIStringEncoding], [self.text length]);
}
like image 163
Rich Lowenberg Avatar answered Sep 20 '22 19:09

Rich Lowenberg