Custom Font Sizing in XCode6 Size Classes not work

Question

Xcode 6 has a new feature where fonts and font sizes in UILabel, UITextField, and UIButton can be set automatically based on the size class of the current device configuration, right in the storyboard. For example, you can set a UILabel to use font size 12 on "any width, compact height" (such as on iPhones in landscape) configurations and size 18 on "regular width, regular height" configurations (such as on iPads). More information is available here:

https://developer.apple.com/library/content/documentation/UserExperience/Conceptual/AutolayoutPG/Size-ClassSpecificLayout.html

This is a really great feature in theory because it could make it unnecessary to programmatically set different fonts on UI features based on the device configuration. Right now, I have some conditional code that sets the fonts based on the device type, but obviously that means I have to set the fonts programmatically everywhere throughout the app. So I was initially really excited about this feature, but I found that it has a serious problem in actual usage for me (perhaps a bug). Note that I am building against SDK 8 and setting a minimum deployment target of iOS 8 so this has nothing to do with compatibility with old versions of iOS.

The problem is this: If I set different font sizes for different size classes, and use the "System" font provided by iOS, everything works as expected and the font sizes change based on the size class. If I use a custom font provided by my application (yes, I have it set up correctly in my application bundle, as it works programmatically) and set the custom font to a label in an XCode 6 storyboard, that also works as expected. But when I try to use different sizes of the custom font for different size classes, in the storyboard, it suddenly doesn't work. The only difference in configuration is the font I've chosen (a custom one vs. the System font). Instead, all of the fonts show up on the device and simulator as the default system font at the default size, regardless of size class (and I verified via the debugger that it is substituting the system font for the actual one specified in the storyboard). So basically the size class feature appears to be broken for custom fonts. Also, interestingly, the custom fonts actually display and adjust size properly in the XCode 6 "Preview" pane for the view controller: it's only when running on the actual iOS system that it stops working (which makes me think that I'm configuring it correctly).

I tried multiple different custom fonts and it doesn't seem to work for any of them, but it always works if I use "System" instead.

Anyway, has anyone else seen this problem in Xcode 6? Any ideas on whether this is a bug in iOS 8, Xcode, or something I'm doing wrong? The only workaround I've found, like I said, is to continue to programmatically set the fonts like I have been for about 3 versions of iOS, because that does work. But I'd love to be able to use this feature if I could get it to work with custom fonts. Using the System font is not acceptable for our design.

---

ADDITIONAL INFO: As of Xcode 8.0, bug is fixed.

Answer 1

Fast fix:

1) Set fonts as System for size classes

2) Subclass UILabel and override "layoutSubviews" method like:

- (void)layoutSubviews
{
  [super layoutSubviews];

   // Implement font logic depending on screen size
    if ([self.font.fontName rangeOfString:@"bold" options:NSCaseInsensitiveSearch].location == NSNotFound) {
        NSLog(@"font is not bold");
        self.font = [UIFont fontWithName:@"Custom regular Font" size:self.font.pointSize];
    } else {
        NSLog(@"font is bold");
        self.font = [UIFont fontWithName:@"Custom bold Font" size:self.font.pointSize];
    }

}

By the way, it is a very convenient technique for iconic fonts

Answer 2

• add Fonts provided by application into your app .plist
• add your .ttf file to item 0
• use it [UIFont fontWithName:"example.ttf" size:10]

Answer 3

After trying everything, I eventually settled on a combination of the above solutions. Using Xcode 7.2, Swift 2.

import UIKit

class LabelDeviceClass : UILabel {

    @IBInspectable var iPhoneSize:CGFloat = 0 {
        didSet {
            if isPhone() {
                overrideFontSize(iPhoneSize)
            }
        }
    }

    @IBInspectable var iPadSize:CGFloat = 0 {
        didSet {
            if isPad() {
                overrideFontSize(iPadSize)
            }
        }
    }

    func isPhone() -> Bool {
        // return UIDevice.currentDevice().userInterfaceIdiom == .Phone
        return !isPad()
    }

    func isPad() -> Bool {
        // return UIDevice.currentDevice().userInterfaceIdiom == .Pad
        switch (UIScreen.mainScreen().traitCollection.horizontalSizeClass, UIScreen.mainScreen().traitCollection.verticalSizeClass) {
        case (.Regular, .Regular):
            return true
        default:
            return false
        }
    }

    func overrideFontSize(fontSize:CGFloat){
        let currentFontName = self.font.fontName
        if let calculatedFont = UIFont(name: currentFontName, size: fontSize) {
            self.font = calculatedFont
        }
    }

}

• @IBInspectable lets you set the font size in the Storyboard
• It uses a didSet observer, to avoid the pitfalls from layoutSubviews() (infinite loop for dynamic table view row heights) and awakeFromNib() (see @cocoaNoob's comment)
• It uses size classes rather than the device idiom, in hopes of eventually using this with @IBDesignable
• Sadly, @IBDesignable doesn't work with traitCollection according to this other stack article
• The trait collection switch statement is performed on UIScreen.mainScreen() rather than self per this stack article

Answer 4

The bug is still valid in XCode 7.0 GM.

Razor28's solution causes infinite loops in some cases. My experience has been with using it in conjunction with SwipeView.

Instead, I suggest that you:

1) Subclass UILabel and override setFont:

- (void)setFont:(UIFont *)font
{
    font = [UIFont fontWithName:(@"Montserrat") size:font.pointSize];
    [super setFont:font];
}

2) Set the custom class of your UILabels and then set the font size classes by using System font

Answer 5

None of these worked for me, but this did. You also need to use the system font in IB

#import <UIKit/UIKit.h>

@interface UILabelEx : UILabel


@end

#import "UILabelEx.h"
#import "Constants.h"

@implementation UILabelEx

- (void) traitCollectionDidChange: (UITraitCollection *) previousTraitCollection {
    [super traitCollectionDidChange: previousTraitCollection];

    self.font = [UIFont fontWithName:APP_FONT size:self.font.pointSize];   
}
@end

Answer 6

Workaround for UILabel: keep the same font size on all Size Classes, but instead change your label height accordingly in each Size Class. Your label must have autoshrink enabled. It worked nicely in my case.