Search Unity

TextMesh Pro Making font from an image?

Discussion in 'UGUI & TextMesh Pro' started by tubswitch, Sep 2, 2019.

  1. tubswitch

    tubswitch

    Joined:
    Feb 25, 2016
    Posts:
    7
    Say I have an image that has all of the characters I want to type with on it. This one as an example. How would I go about converting that texture into a usable font in TextMeshPro?
     

    Attached Files:

  2. Stephan_B

    Stephan_B

    Joined:
    Feb 26, 2017
    Posts:
    6,595
    You would need to create a font asset, edit the Face Info and populate with sensible values. Then create glyph in the Glyph Table for each glyph in the texture and then create characters in the Character Table which reference those glyphs.

    The GlyphRect defines the position of the glyph in the texture. The GlyphMetrics define the layout behavior.

    Characters are assigned a Unicode value and reference a glyph index.
     
  3. tubswitch

    tubswitch

    Joined:
    Feb 25, 2016
    Posts:
    7
    You can't create a Font Asset from an image, which is what I'm trying to do, so I had to make oone from an unrelated TTF file then added the material. This is the result I get. The glyph settings in the font asset are set to these values and cannot be changed.

    The first character's bounds are at (3,6), (3,16), (11,6), (11x16). It is 8x8. Where do I now put those numbers in the font asset?
     

    Attached Files:

  4. Stephan_B

    Stephan_B

    Joined:
    Feb 26, 2017
    Posts:
    6,595
    I could have been clearer...

    Since the Face Info will need to be manually set, use any .ttf file to create a font asset. Select the font file and use the Context Menu Create - TextMesh Pro - Font Asset and this will create a dynamic font asset with Sampling point size of 90 and padding of 9 with texture size of 1024 X 1024. You could chose to rename the .ttf to match the name of whatever you want this new font to be called (optional)

    After the font asset is created, assign it to a text object and type the letter A. This is just to add one character and glyph to it.

    Next, select this font asset and change the Generation Settings to match / approximate whatever point size you think you font / character size are in that texture. Doesn't need to be precise. Make the Padding (sort of matches), Atlas Width and Height do match your texture.

    Then set this font asset to static.

    With the Inspector in normal mode, go to the A Glyph in the Glyph Table and change the GlyphRect to match the location of the A glyph in your texture. 0, 0 is bottom left of the texture.

    GlyphMetrics are related to layout where the width and height represent those typically mirror the GlyphRect width and height. Bearing X (BX) and Bearing Y (BY) define the position of the pen relative to the base line and previous advance value. Assuming the pen is at (0, 0). The bearing X would move the pen forward or backward and then bearing Y up to the top of the character. Then it draws it from top to bottom which is why bearing Y is usually close to the height of the character but not always. Advance is the how far should the pen advance after this character. Maybe you have those values for your font or maybe not. If not, you will need to play with those. Maybe your font is monospace :)

    Then make sure Character A in the Character Table still points to that glyph index

    Then create additional glyph and characters. Be sure to assign the correct unicode to each character and have them reference the correct glyph index.

    You will need to manually set the Face Info Ascender, Descender and Line Height ... Once you have characters on screen, type some text and start tweaking these values.

    P.S. When I have time (which I have very little these days) I will make some improvements to this workflow and make it work with external tools where you could use .fontsettings to create font assets as well. Or hope a TMP user creates a tool as most of the functionality needed to do this is (should) already be exposed.
     
    Last edited: Sep 3, 2019
  5. tubswitch

    tubswitch

    Joined:
    Feb 25, 2016
    Posts:
    7
    I set these to 640 and 520 using the Debug editor. They go blank in the normal editor when I do this though.

    You mean set Atlas Population Mode to static, right?

    Anyway, I did everything else you said and these were my results. At first I tried it without setting a material but it obviously didn't work and just output characters from the ttf I create the font asset from. I'm still not able to actually output a character from the source texture at all.
     

    Attached Files:

  6. Stephan_B

    Stephan_B

    Joined:
    Feb 26, 2017
    Posts:
    6,595
    Can you provide me with a link to your atlas texture?
     
  7. tubswitch

    tubswitch

    Joined:
    Feb 25, 2016
    Posts:
    7
    Its just the image I posted in the OP.
     

    Attached Files:

  8. wickedpopular

    wickedpopular

    Joined:
    Oct 29, 2016
    Posts:
    33
    Hello! I would really like to know this as well. Did you get a response to this? I was trying to do something similar in this thread but I kept running into errors. What I was doing was creating a regular fontsettings file like you'd use for the old UI and then trying to convert it over to a font asset. I was able to get the rects of the character but unfortunately was never able to get farther than that :(

    https://forum.unity.com/threads/invalid_file_format-error-when-attempting-to-create-tmp-font.732050/