2018-11-11

Non breaking spaces

Arrrg!

There is the normal space character (0x20), and there is the non breaking space character (0xA0).

I was not expecting to have to do anything with these specially in any way to be honest apart from spotting space characters for paragraph text wrapping logic...

However, I have run in to snags, and ended up having to add it as a special case in my code.

The first snag is simple - some fonts (and only a few) do not have the non-breaking space character encoded. So my new font system wants to know the size of every character to work out layout of text in SVG, and it "falls back" to Google NoTo fonts to find the character if missing.

This logic was originally for Emojis, but actually has the full Google NoTo set now, so does Egyptian hieroglyphics and so on. It works well (once you remove the Color[sic] Emoji font).

Thankfully most of the fonts I am using even have extended Latin, so things like Polish crossed "l" characters just work in the base font. Google's free fonts are pretty good!

The problem is that when the main selected font has no non breaking space I fall back, and I hit the Emoji font quite quickly which does, only it is about twice as wide as you expect!

So my text ends up with non breaking space encoded in the Emoji font, and being wide.

Well, this is not ideal, but why would I encounter non breaking spaces anyway? Well, because when I make the SVG output, extra spaces, and leading spaces, and trailing spaces, are all zapped. So any actual formatting with spaces (especially if using mono-spaced fonts) is totally lost. This is bad enough, but I have worked out the size with the spaces and so the result looks horridly stretch to fit the space it should take with all the spaces in place. This took me ages to find as one string I was testing with had a trailing space which I had not spotted. So now I convert all spaces to non breaking spaces for output to SVG.

This them hit the first snag that the non breaking spaces are not in the font, and so I ended up coding all spaces in Emoji (for some base fonts). Again, not spotted originally as the font I was using had non-breaking spaces encoded, but another font did not and just looks horrid spaced!

I have ended up:- (see P.S.)
  • Using only spaces for text wrapping (so non breaking spaces do in fact non-break)
  • Converting non breaking spaces to spaces for all width calculation
  • Converting all spaces to non-breaking spaces when making final SVG
It seems to finally work...

Fonts are fun!

P.S. xml:space="preserve" is your friend - it preserves spaces as they are.

2 comments:

  1. Maybe you could start a vodcast entitled RevK: Fun with Fonts and invite former Star Trek cast members. ;-)

    ReplyDelete
  2. 𓂺 𓂺 Mr Cockburn 𓂺 𓂺Tuesday, 13 November 2018 at 13:16:00 GMT

    Ha ha, what a great idea!

    ReplyDelete

Comments are moderated purely to filter out obvious spam, but it means they may not show immediately.