3 ms·

As a self-taught newbie programmer, one of my early question was, "How do letters get drawn on the screen?" My limited understanding is that it works like: bi

As a self-taught newbie programmer, one of my early question was, "How do letters get drawn on the screen?" My limited understanding is that it works like: bits (0's and 1's) -> encoding (e.g. UTF-8) -> glyphs (e.g. Unicode) -> Some insanely complicated black box. This black box knows how to do all sorts of things like kerning, combining cháracters, bizarre punctuation，and other magic. I understand UTF-8 and Unicode, but I have no idea how all the other magic works. Why is AV nicely kerned, and 我. nicely spaced? Apparenty this is a really hard problem because my trusty old code editor Textmate didn't get it right. Unicode to screen is a terribly hard problem.

aaronblohowiak 13y ago
individual glyphs: http://www.smashingmagazine.com/2012/04/24/a-closer-look-at-font-rendering/ http://www.smashingmagazine.com/2012/04/24/a-closer-look-at-... kerning: http://en.wikipedia.org/wiki/Kerning#Digital_typography http://en.wikipedia.org/wiki/Kerning#Digital_typography some stuff is embedded in the font, other things the OS will do on a "best guess" basis -- which is why things look radically different between operating systems and even between different apps on the same OS if they use their own font rendering. Check out a very high-quality open source font rendering engine: https://developer.gnome.org/pango/unstable/ https://developer.gnome.org/pango/unstable/
gonnakillme 13y ago
One way to think about text encoding is that it provides a nice way to represent indexes into a big array of glyphs: "unicode". Fonts map (some) of these indexes to graphic representations and provide "font hinting" -- clues as to how different letters should be rendered at different sizes -- and kerning information. Usually your desktop environment is the thing that handles all of this, providing widgets for other programs to combine to create GUIs. I can't find it right now, but you can probably find e.g. GNOME/GTK's implementation. (Re: Textmate: code is typically rendered in monospace font -- where every glyph has the same size -- so that it has the same alignment in every font with every renderer.)
- iv_08 13y ago
  GTK+ uses Pango [1], which uses the FreeType [2] backend on Linux. There's also a pure Go implementation of FreeType. Here's the entry point for those who are interested in reading the code: http://code.google.com/p/freetype-go/source/browse/freetype/freetype.go#185 http://code.google.com/p/freetype-go/source/browse/freetype/... [1] http://www.pango.org http://www.pango.org [2] http://www.freetype.org http://www.freetype.org
- MarcusBrutus 13y ago
  I think the terminology you use is not right. Unicode maps integers to graphemes (not glyphs) and vice-versa (i.e. it's a 1-1 mapping). Fonts map graphemes to glyphs.
  - ygra 13y ago
    This is even more wrong. Unicode maps integers to abstract characters. Fonts map characters to glyphs and layout engines map glyphs to graphemes. Keep in mind that graphemes can be composed of multiple parts, e.g. ligratures or combining characters.
nitrogen 13y ago
Learning about the freetype library may be useful to you (http://freetype.org/ http://freetype.org/). I used many years ago to render TTFs to in-memory pixmaps, and then loaded those as OpenGL textures.

aaronblohowiak 13y ago

individual glyphs: http://www.smashingmagazine.com/2012/04/24/a-closer-look-at-font-rendering/ http://www.smashingmagazine.com/2012/04/24/a-closer-look-at-... kerning: http://en.wikipedia.org/wiki/Kerning#Digital_typography http://en.wikipedia.org/wiki/Kerning#Digital_typography some stuff is embedded in the font, other things the OS will do on a "best guess" basis -- which is why things look radically different between operating systems and even between different apps on the same OS if they use their own font rendering. Check out a very high-quality open source font rendering engine: https://developer.gnome.org/pango/unstable/ https://developer.gnome.org/pango/unstable/

gonnakillme 13y ago

One way to think about text encoding is that it provides a nice way to represent indexes into a big array of glyphs: "unicode". Fonts map (some) of these indexes to graphic representations and provide "font hinting" -- clues as to how different letters should be rendered at different sizes -- and kerning information. Usually your desktop environment is the thing that handles all of this, providing widgets for other programs to combine to create GUIs. I can't find it right now, but you can probably find e.g. GNOME/GTK's implementation. (Re: Textmate: code is typically rendered in monospace font -- where every glyph has the same size -- so that it has the same alignment in every font with every renderer.)

iv_08 13y ago
GTK+ uses Pango [1], which uses the FreeType [2] backend on Linux. There's also a pure Go implementation of FreeType. Here's the entry point for those who are interested in reading the code: http://code.google.com/p/freetype-go/source/browse/freetype/freetype.go#185 http://code.google.com/p/freetype-go/source/browse/freetype/... [1] http://www.pango.org http://www.pango.org [2] http://www.freetype.org http://www.freetype.org
MarcusBrutus 13y ago
I think the terminology you use is not right. Unicode maps integers to graphemes (not glyphs) and vice-versa (i.e. it's a 1-1 mapping). Fonts map graphemes to glyphs.
- ygra 13y ago
  This is even more wrong. Unicode maps integers to abstract characters. Fonts map characters to glyphs and layout engines map glyphs to graphemes. Keep in mind that graphemes can be composed of multiple parts, e.g. ligratures or combining characters.

nitrogen 13y ago

Learning about the freetype library may be useful to you (http://freetype.org/ http://freetype.org/). I used many years ago to render TTFs to in-memory pixmaps, and then loaded those as OpenGL textures.