Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bitmap label cuts off part of text #201

Open
jepler opened this issue Dec 20, 2023 · 3 comments
Open

bitmap label cuts off part of text #201

jepler opened this issue Dec 20, 2023 · 3 comments

Comments

@jepler
Copy link
Member

jepler commented Dec 20, 2023

Compare the rendering of some text in the "font_league_script_number_one_webfont_72_latin1" (from the circuitpython font bundle) using bitmap and traditional label:
PXL_20231220_021126591 mp4_exported_1700
PXL_20231220_021126591 mp4_exported_5067

Code for test (qualia + 320x820 bar display)
import gc
import sys
import time

import terminalio
from adafruit_display_text.bitmap_label import Label as BitmapLabel
from adafruit_display_text.label import Label
from adafruit_qualia import Qualia
from adafruit_qualia.graphics import Displays
from font_league_script_number_one_webfont_72_latin1 import FONT

# Create the PyPortal object
qualia = Qualia(Displays.BAR320X820, rotation=270)

tx1 = qualia.add_text(
    text_position=(20, 20),  # location
    text_scale=3,  # text size
    text_color=0xFFFFFF,
    text="",
)

while True:
    for constructor_name, constructor in [
        ("label", Label),
        ("bitmap_label", BitmapLabel),
    ]:
        qualia.set_text(constructor_name, tx1)
        specimen = None
        specimen = constructor(
            font=FONT,
            text="AaBbCcGgYyQq",
            anchor_point=(0.0, 1.0),
            anchored_position=(0, qualia.display.height * 3 // 4),
            base_alignment=True,
            color=0xFFFFFF,
        )
        qualia.splash.append(specimen)
        qualia.display.auto_refresh=True
        time.sleep(4)
        qualia.display.auto_refresh=False
        qualia.splash.remove(specimen)
        del specimen
        gc.collect()
@jepler
Copy link
Member Author

jepler commented Dec 20, 2023

the text also shifts, which is clearer with an animated gif. It's likely that fixing the bounding box(?) problem will fix the text shift problem, but that's just a guess.
ezgif com-optimize(4)

@kmatch98
Copy link
Contributor

Of course could just be garden variety bugs, but I’ll take a guess here, since I thought I dealt with many of the issues with ascenders and descenders (see discord discussion about typeface “Fayette” from Prof. Mia Connelly at Univ Kentucky).

First thing to check is whether the font header information that sets up the dimensions is accurate for the typeface glyphs in the file.

@jepler
Copy link
Member Author

jepler commented Dec 20, 2023

This fixes the bounding box, but not the shift:

diff --git a/adafruit_display_text/bitmap_label.py b/adafruit_display_text/bitmap_label.py
index d25b3fd..5dd5bd6 100755
--- a/adafruit_display_text/bitmap_label.py
+++ b/adafruit_display_text/bitmap_label.py
@@ -290,13 +290,17 @@ class Label(LabelBase):
     ) -> Tuple[int, int, int, int, int, int]:
         # pylint: disable=too-many-locals
 
-        ascender_max, descender_max = self._ascent, self._descent
+        bbox = font.get_bounding_box()
+        print(bbox, self._ascent, self._descent)
+        if len(bbox) == 4:
+            ascender_max, descender_max = bbox[1], -bbox[3]
+        else:
+            ascender_max, descender_max = self._ascent, self._descent
 
         lines = 1
 
-        xposition = (
-            x_start
-        ) = yposition = y_start = 0  # starting x and y position (left margin)
+        # starting x and y position (left margin)
+        xposition = x_start = yposition = y_start = 0
 
         left = None
         right = x_start

From what I can tell there's a distinction between the ascent/descent of a font and the bounding box of the glyphs. ascent/descent help you lay out text in rows, but a font can exceed the ascent & descent values. As Microsoft puts it, "if it proves convenient, portions of glyphs may extend outside the em square"

Microsoft's example (the top and bottom bounds are understood to be the font's ascent and descent):
image

the if/else is necessary because terminalio.FONT has a 2-tuple for its bounding box.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants