Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

TextSize() inaccuracies

in Questions Posts: 166

I’m using textsize() to write text to an image but it seems to clip the text for some fonts. Even if I make the image larger than the returned width and height it still seems to clip. I found other threads mentioning this, but no solution.

I tried peeking at the fontMetrics but that didn’t seem to offer a solution either.

Any ideas on how to reduce or remove these clipping problems?
I’m using lot’s of imported fonts using the anyfonts app.

Comments

  • dave1707dave1707 Mod
    Posts: 6,935

    @Kirl Can you show the font and the width and height that’s being returned. How are you writing the text to the image. Too many unknowns to give an answer.

  • dave1707dave1707 Mod
    Posts: 6,935

    @Kirl I tried several different fonts and the w,h size was always large enough to hold the text in an image of size w,h. So I guess I need an example to know why you’re having trouble.

  • dave1707dave1707 Mod
    Posts: 6,935

    @Kirl Here’s an example of adding text to an image.

    function setup()
        img=readImage("Cargo Bot:Starry Background")
        iw=img.width  
    
        font("Baskerville-BoldItalic")    
        str="This is a test string."
    
        setContext(img)
        fill(255)
        text(str,iw/2,15)
        setContext()    
    end
    
    function draw()
        background(40, 40, 50)
        sprite(img,WIDTH/2,HEIGHT/2)
    end
    
    
    
  • dave1707dave1707 Mod
    Posts: 6,935

    @Kirl Here’s another example that uses a white background for the text added to an image.

    function setup()
        rectMode(CENTER)
        img=readImage("Cargo Bot:Starry Background")
        iw=img.width  
    
        font("Zapfino")    
        str="This is a test string."
        tw,th=textSize(str)
    
        setContext(img)
        fill(255)
        rect(iw/2,th/2,tw,th)
        fill(255, 0, 0, 255)
        text(str,iw/2,th/2)
        setContext()    
    end
    
    function draw()
        background(40, 40, 50)
        sprite(img,WIDTH/2,HEIGHT/2)
    end
    
  • Posts: 166

    I attached an image which shows the problem. I printed the name of various fonts on images which ought to be exactly the size of the text + an extra 10 pix on all sides.

    Besides the huge differences in height and y position (fishfingers and razing are quite high up), the B’s of badaboom are clipped at the start and end as well as the T of sf comic script.

    Code below, most fonts are probably from dafont.com.

    function setup()
        fonts = {"Comic Book", "Badaboom bb", "fishfingers", "sf comic script", "otaku rant", "razing", "yikes"}
        txtImgs = {}
    
        for i, f in pairs(fonts) do
            font(f)
            fontSize(80)
            local tw, th = textSize(f)
            local img = image(tw+20, th+20)
    
            setContext(img)
            fill(math.random(255),math.random(255),math.random(255))
            text(f, img.width/2, img.height/2)
    
            stroke(fill())
            fill(0,0)
            strokeWidth(3)
            rect(0,0, img.width, img.height)
            setContext()
    
            table.insert(txtImgs, img)
        end
    end
    
    function draw()
        background(0, 0, 0, 255)
    
        for i, img in pairs(txtImgs) do
            sprite(img, WIDTH/2, i*110 -50)
        end
    end
    
  • dave1707dave1707 Mod
    Posts: 6,935

    @Kirl I wonder if Codea can’t give you the exact size you need because those aren’t built in Codea fonts. I don’t know how Codea calculates the font sizes, so the only suggestion I can give if you want to use those fonts is to create another table with values that you either add or subtract from tw and th to compensate for the differences you need by font.

  • Posts: 166

    Thanks dave, I guess I’ll go the manual route... =/

Sign In or Register to comment.