Scrawl-canvas
Scrawl-canvas copied to clipboard
Add new Label entity
This PR work started as an investigation into handling non-alphabetic writing systems. See Discussion https://github.com/KaliedaRik/Scrawl-canvas/discussions/49 for details.
However, a couple of days into the work I got distracted/confused by the standards updates to the font metrics attribute - see Discussion https://github.com/KaliedaRik/Scrawl-canvas/discussions/32
This, alongside the decisions by the Standards body to expand the Canvas API's text handling capability (considered in Discussion https://github.com/KaliedaRik/Scrawl-canvas/discussions/50 and at the time marked as "won't fix"), gave me the idea that we could introduce a new Label
entity with the following functionality:
- For single lines of text only.
- The entity's line of text will be treated as a single string, with no effort to style glyphs within the string differently to the entity's overall settings.
- ~~Best efforts will be made to add in the new functionality mentioned in Discussion https://github.com/KaliedaRik/Scrawl-canvas/discussions/50~~ (Too much variation in browsers)
- (done) Make use of font measurements functionality for dimensions calculations as mentioned in Discussion https://github.com/KaliedaRik/Scrawl-canvas/discussions/32
- (done - via an enhanced handle attribute) Allow
Label
entitys to respect textBaseline settings -['top', 'hanging', 'middle', 'alphabetic', 'ideographic', 'bottom']
- possibly in addition to the normal['top', 'center', 'bottom']
handleY strings (Phrase
entitys completely ignores textBaseline). - No
textPath
functionality (which is part of thePhrase
entity), onlypath
functionality similar to all other entitys - ~~We can add in functionality to give
Label
entitys a background color and border, alongside padding between the border box and the text, as an integral part of the entity.~~ (Too complex. Create a block entity to mimic the Label instead) - (done) There may be a way to do underlined text in a saner way as part of the new entity's stamp functionality, using local globalCompositeOperation? Definitely worth investigating!