I just asked the same thing on SO so please dont hit me for just copypasting most of it, im only at my phone
So, skippedy-boo-bap on the first part. I made a library for basic drawing, ported freetype2 for text rendering and the windowing/input system/basic components work fine.
Buttons and other basic stuff are not very hard, but text components have a lot more requirements - they need to be fast, allow text selection (view-model/model?) and other stuff, and should be extendable in the sense of allowing a program to add whatever funky stuff it needs (like, maybe emoticons) into the text.
What are some/where can I find out about best-practices when implementing good-performing/extendable text components?
P.S.: just got a close-vote on my question.. what is wrong with these guys at stackoverflow^^'
P.P.S.: mods, if links to SO re not wanted here, feel free to remove the links and this notice
GUI - Implementing text components
Re: GUI - Implementing text components
Hi,
Note 2: The string may include some sort of mark-up; including support for things like font changes, font size changes, bold, italics, underline, etc.
For efficiency, the font engine would have 2 caches. The first cache would hold the width of each character (for a specific font at a specific size) and any information needed for kerning; and would be used to determine where each character would be within the bitmap. The second cache would hold "pre-rendered" bitmap data for each character (for a specific font at a specific size).
The second layer would be a layout engine. This handles thing like line wrapping, centering text, left and/or right justification, etc. Essentially, it splits a larger string into sub-strings (one sub-string per row of text), then asks the font engine to convert each sub-string into an "alpha channel only" bitmap, applies colour to the bitmaps (if necessary) and combines all of them into a larger (RGBA?) bitmap. Like the font engine, it would also be able to tell you where each character would be within a bitmap (e.g. top and bottom edge of each row from its own data, and horizontal position of left and right edge of each character within each row from the font engine).
Note: The strings used by the layout engine may include some sort of mark-up; which may be a super-set of the markup the font engine excepts (e.g. including additional things that the font engine doesn't accept, like foreground and/or background colour, line breaks, inline images, etc).
The third layer might be (e.g.) something like a "text widget" that handles user input, scroll bars, cut & paste, etc.
Cheers,
Brendan
Think of it as layers. First layer is a font engine capable of:max wrote:What are some/where can I find out about best-practices when implementing good-performing/extendable text components?
- Given a string, a font, a font size and an optional minimum width; telling you where each character would be (e.g. horizontal position of both left and right edge of each character) within a bitmap.
- Given a string, a font, a font size and an optional minimum width; converting a string into an "alpha channel only" bitmap
Note 2: The string may include some sort of mark-up; including support for things like font changes, font size changes, bold, italics, underline, etc.
For efficiency, the font engine would have 2 caches. The first cache would hold the width of each character (for a specific font at a specific size) and any information needed for kerning; and would be used to determine where each character would be within the bitmap. The second cache would hold "pre-rendered" bitmap data for each character (for a specific font at a specific size).
The second layer would be a layout engine. This handles thing like line wrapping, centering text, left and/or right justification, etc. Essentially, it splits a larger string into sub-strings (one sub-string per row of text), then asks the font engine to convert each sub-string into an "alpha channel only" bitmap, applies colour to the bitmaps (if necessary) and combines all of them into a larger (RGBA?) bitmap. Like the font engine, it would also be able to tell you where each character would be within a bitmap (e.g. top and bottom edge of each row from its own data, and horizontal position of left and right edge of each character within each row from the font engine).
Note: The strings used by the layout engine may include some sort of mark-up; which may be a super-set of the markup the font engine excepts (e.g. including additional things that the font engine doesn't accept, like foreground and/or background colour, line breaks, inline images, etc).
The third layer might be (e.g.) something like a "text widget" that handles user input, scroll bars, cut & paste, etc.
Cheers,
Brendan
For all things; perfection is, and will always remain, impossible to achieve in practice. However; by striving for perfection we create things that are as perfect as practically possible. Let the pursuit of perfection be our guide.
- max
- Member
- Posts: 616
- Joined: Mon Mar 05, 2012 11:23 am
- Libera.chat IRC: maxdev
- Location: Germany
- Contact:
Re: GUI - Implementing text components
Hey Brendan,
I did it that way. I wrote a "font manager" in my userspace library that wraps around freetype2 and caches glyphs when required + stores all their required sizing/kerning/placement information, next I'll write a layouting engine.
Thanks for your help, I'll drop some screenies in the Screenie-Thread when its done
I did it that way. I wrote a "font manager" in my userspace library that wraps around freetype2 and caches glyphs when required + stores all their required sizing/kerning/placement information, next I'll write a layouting engine.
Thanks for your help, I'll drop some screenies in the Screenie-Thread when its done