xamarin ios monospaced Numbers using UIFontFeature - does anyone know why this doesn't work
Asked Answered
L

1

1

I thought it was now possible in IOS apps to force your numbers to be monospaced when using a custom font. I've found examples and used some code that compiles but my number spacing is still proportional. Has anyone got this working and if so what am I doing wrong?!

Here is my code:

UIFont bigNumberFont = UIFont.FromName("Dosis-Light", 60f);

var originalDescriptor = bigNumberFont.FontDescriptor;
var attributes = new UIFontAttributes(new UIFontFeature(CTFontFeatureNumberSpacing.Selector.MonospacedNumbers),
            new UIFontFeature((CTFontFeatureCharacterAlternatives.Selector)0));

var newDesc = originalDescriptor.CreateWithAttributes(attributes);

UIFont bigNumberMono = UIFont.FromDescriptor(newDesc, 60f);

lbCurrentPaceMinute.Font = bigNumberMono;

My custom font renders fine but I cant get any control over number spacing as of yet. Any suggestions greatly appreciated!

Lolitaloll answered 12/10, 2016 at 14:6 Comment(0)
V
2

First, your code is not making font monospaced.

You are tweaking font to render digits in monospace mode. So all your digits will have same width.

Below is an example with 4 labels, 1 is Docis Light, 2nd is Docis Light with your tweak, 3rd is system font of same size, 4th is system font with your tweak:

monospaced digits font tweak in ios

As you see, Docis Light is already supporting monospace digits feature out of the box with no tweak.

If you need to use monospaced font, you have to use custom monospaced font (designed to be monospaced) or you can use built-in iOS monospaced fonts such as Courier or Menlo (See all available iOS fonts at http://iosfonts.com/)

This is how they look like with same scenario:

courier and menlo monospaced iOS fonts

With or without tweaking, they are already monospaced and their digits are monospaced as well.

Finally, if you need to have monospaced digits font (what your code does) you don't need to tweak character alternative. So the code would be:

public static class UIFontExtensions
{
    public static UIFont MonospacedDigitFont(this UIFont font)
    {
        var originalDescriptor = font.FontDescriptor;
        var monospacedNumbersFeature = new UIFontFeature(CTFontFeatureNumberSpacing.Selector.MonospacedNumbers);
        var attributes = new UIFontAttributes(monospacedNumbersFeature);
        var newDescriptor = originalDescriptor.CreateWithAttributes(attributes);
        return UIFont.FromDescriptor(newDescriptor, font.PointSize);
    }
}

Hope this helps! I found it interesting diving into details how you can and cannot tweak fonts in iOS.

Virchow answered 14/10, 2016 at 5:0 Comment(6)
Hi ALex, Thanks for taking the time to answer. I'll respond to your answer in sections.Lolitaloll
"First, your code is not making font monospaced. You are tweaking font to render digits in monospace mode. So all your digits will have same width."Lolitaloll
I realise that - which is why I clearly stated I was trying to make the numbers monospaced. But thanks for clarifying anyway. Also you have stated that the Dosis Light font is showing monospaced numbers and yet the image you have provided shows the two Monospace Light examples as identical to each other and the numbers are clearly proportionally spaced not monspaced?!Lolitaloll
And finally I have implemented your code and unfortunately my custom font still doe snot have monospaced numbers :/Lolitaloll
@EChristy Well, when you asked I double checked the image and indeed I am not sure about digit 1. I'll go ahead and check it. Regarding your custom font, which font are you using? I guess there might be some dependency on the font itself.Virchow
Hi Alex, no that is not how it's meant to work. You are right in saying some fonts are monospace, or have monospace numbers. But in order to design a beautiful UI you need to have fine control over this aspect of any font, and that's what this is meant to be doing, or so I thought! The font I'm using is Dosis Light, and Dosis Medium, neither of which have monospaced numbers built in. Thanks for your efforts so far!Lolitaloll

© 2022 - 2024 — McMap. All rights reserved.