Taking Suggestions for Bitmapped Font object

This forum is currently in read-only mode.
0 favourites
From the Asset Store
This is a single chapter from the "Construct Starter Kit Collection". It is the Student Workbook for its Workshop.
  • I'm going to be making a Bitmapped font object, also known 'round these here parts as a Text Blitter:

    for those who don't know, this is where you have a separate sprite for each letter, so you can type some text, and have it come on screen like this:

    <img src="http://www.zone38.net/font/bmpfonts.png">

    I want it to be as easy as possible and as powerful as possible to use. The purpose of this thread is to take suggestions, and release the most complete solution possible. It will be easier to build it correctly the first time, than to add features later.

    so far, these are the features I'd like to include, and how some of it will work. If the operations I suggest sound annoying or tedious, please feel free to suggest a better workflow.

    First you need to get your letter images into construct.

    I have two methods I have thought of that seem like the simplest to me. I plan for the plugin to support both. If I have missed an input method you would like to see, please reply and suggest.

    first is a fontstrip, you would choose a sprite like this:

    <img src="http://cg.scs.carleton.ca/~luc/IpsumPlanet-Barcoda-new-font3-2006.jpg">

    Only the extra words at the bottom would be cut off, so it would just be the list of characters

    you tell construct how many letters across and down, and then specify the order of the letters

    I think there should be a few methods to do this,

    1.in ASCII order. Many font strips you see will be in this order anyway. And you can specify a range...for instance if you had a font strip just for 0-9

    you would choose the action

    Get Font From Font Strip,

    tell the x size,

    the y size,

    then there would be a drop down list of the first Character, where you could select 0

    and the last character, where you could select 9

    and that would be it for the first method

    the second would be to specify a list of all the characters, so basically, you call the action, and type in:

    "ABCDEFGHIJKLM"

    etc., that way if the one perfect font just isn't on an ascii ordered strip, you can specify your own order.

    also, you should be able to combine imported fonts, so if you imported 0-9, and A-Z, separately, you can tell the object that this is still one font.

    you can define an offset if you want them to be spaced closer or further than the borders of each sprite when you type

    the other way to import the sprites for your font strip would be through the animation editor

    you have a directory with one sprite per character, import those into the frames, call the action as above, except you wouldn't specify x and y values for an imported animation.

    with this method you could have vastly different sizes for each character. you will be able to specify the spacing with an imagepoint to override the spacing that you set. Also, you should be able to set the spacing at the borders of the sprites,

    or from the hotspot, so you can easily make cursive or graffiti style fonts that overlap uniformly

    you will be able to set the size, of course, (and rescale it nonuniformly, to squash or stretch the "fonts") and the angle. as well as whether text is centered, left, or right justified. I will try to make the first version realtime editable, so a player can type in their name for instance, and it will appear as they type, along with backspace. This will take longer than the other features, though, so it may come later. Another thing I'd like to have is being able to set the width of the typing space, so you can have automatic word wrap...

    anyway, when it's all ready and done, you use the TextBlit Action "Hello, World" at 40,500,200

    and it would type it to screen with your bitmaps instead at xy 40,500, and at zdepth 200

    please feel free to make suggestions, especially if you have a good idea to streamline the way you set what sprites you want for fonts. Don't worry about how it will work, or if it can work, just tell me what would be easiest

    Also, I'm trying to develop any plugin I can to add general functionality to Construct. Like the Custom Keys plugin, this is a feature that can be used by almost anyone, and is used in a large number of polished titles. If you can think of any type of basic useful functionality you'd like to see in construct, that is not already planned by the devs, and is generally useful to anyone trying to make a finished game, please suggest it here. As a disclaimer, I will say, I can't do things like make an online plugin. Think of things you can already do with construct, but would take forever, and cause you to have to slow down the breakneck pace that Construct usually let's you develop in

    I will be developing plugins to fill those gaps.

    Edit: Mods and Devs, please let me know if this is the wrong forum to post this. Plugins forum is mostly frequented by plugin devs, and aspiring plugin devs, and I wasn't sure if

    Feature requests: Suggest and discuss specific additions to Construct and to plugins

    would be appropriate. I want make this a complete and useful plugin, for as many users as possible, but I don't want to impose, botlike, upon the wrong forum, because there will probably be a handful of plugins in the Useful Series.

  • Does it have to be text blitter? Wouldn't it make sense to have an universal blitter, which could be used for text and imagesets alike?

    I know blitting is probably a little ineffective, having to read the same big image for each smaller bit of graphics to be blitted seems ineffective compared to just drawing smaller independent images. Perhaps it would be better if it was an one-time thingy; load an imageset, chop 'em up and store each piece into their own textures, which would then be referred for the remainder of session (or until dumped).

    Well, anyway, I'm not an expert and blitting feature is not so strongly requested, since there are alternative methods of drawing graphical text. I'm sure others will digress, though.

  • [quote:1g6tljjb]blitting feature is not so strongly requested, since there are alternative methods of drawing graphical text. I'm sure others will digress, though.

    Actually, it's been requested a bunch. I know I'd like to have a text blitter.

    Just one thought though, and it's not all that important... how about instead of calling it "Text Blitter Object" it's called "Bitmap Font Object?" Text Blitter is what it's called in MMF.

    I know, I'm being nitpicky

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • ok, done deadeye.

    I was thinking of changing the name anyway since too many people don't thinking of text blitting in the nonstraightforward nostalgic sense anyway.

    Mipey

    seems a little redundant, since you can split up images in the animation importer. but if enough people agree it's a needed feature, it shouldn't be a problem. splitting up a bunch of sprites into smaller ones doesn't seem like a problem you'd have unless you're using retro sprites you found already that way on the internets, so no as you said, it's probably not needed much.

    but although there are ways of drawing graphical text, aside from importing sprites of every word you want, or tediously placing all the letter and number sprites in order, or making this plugin out of events. Any of those three methods takes enough time, to make it a small project in itself.

    with this you can have scores that change dynamically, names that pop up above characters

    or button setup screens, stories scrolling up the screen, without giving a second thought to it, the way you would if it was a text object. As I said before, most games polished enough to be released commercially have something like this, somewhere in them

  • One thing I think is cool about bitmapped fonts is you have the ability to create all kinds of text effects, like scrolling text, etc. One thing that might be interesting is if it was set up to make these effects easier, perhaps programmable, and shareable.... ehh that might just have to be a separate plug.

  • I had a look into making one, but had a lot of work to do at the time. I was going to use BMFont for it.

  • Dude! nice!

    Okay my requests for bitmapped font (brace for wall-of-text):

    -Unicode support! I need �'s and ����� and I'm sure others will need other codes. Unicode is nicely mapped too so it's no biggie I think. Just index using UTF16 as a key.

    -Kerning: Kerning is the distance between two glyphs, you just need a table with kerning between each pair of existing glyphs. I know typographically inclined people go NUTS over this and it differentiates a mediocre font renderer from a beautiful one. Just default to 0 (monospaced). The nice thing about this is that you can have variable size glyphs regardless of actual glyph size. Also, it makes measuring string lenght hell (ok not so bad, but it's not a simple mult anymore).

    -resulting text alignment: left, center, right, up, middle, bottom.

    -baseline: vertical position of glyphs is defined relative to a baseline. This allows for j's that drop below among other aesthetically pleasing glyphs.

    I don't care for bold and italics. They can be a separate font like in every single existing system today.

    I don't care for effects. I had to design a font object once and would up dropping effects altogether as they were making the design explode in complexity. If you already have this figured out then great.

  • Awesome! One feature that's really needed - accurate word wrap. The current text object will write a sentence, and if a period gets wrapped, it doesn't wrap the word with it - like this

    .

    Ashley said it's an issue with direct x that they can't do anything about, so it would be really nice if your plugin wraps correctly.

  • ok

    it's still a little ways off, mostly because I'm busy...it really doesn't take too long to make a plugin

    these are the features that will go in, if all works out:

    actions:

    • choose sprite, there won't be any special setup options, because splitting up tiles, and importing several frames, is very easy with the builtin features in construct, so you import your font sprites into one animation in construct
    • Set Animation Range: here you will be able to set up a range of characters to go with a range of frames, so if your font only has 0-9, and a-z, you would call this action once for each range, you choose which animation frames go with which range of characters
      • Frame Start
      • Frame End
      • Character Start
      • Character End
    • Set Spacing: this will set how far the next character will be placed from the last, you will be able to set whether the space is from an imagepoint or from the edge of the sprite
      • from imagepoint/from edge - edge is default
      • all / per character - apply spacing to all, or override "all" setting for one character - setting for one character, decides how far the next character will be from it
      • spacing - a number, 0 would be touching, negative positive corresponds to left/right number of pixels offset
    • set wrap width - set the width the words wrap in. I will do my best to follow any wrapping conventions I'm aware of, but I don't have the time to research, and I'm not an expert on formatting, but I did read yours arima, and that will be observed
    • set display width - this is to be able to put your text into a box and scroll through it, it will make some of the other actions possible, and save the user from having to make a mask everytime they want to do this
    • set alignment - left/right/centered
    • set justified -
      • on/off
      • method
        • between word spacing - justify the normal way, by spacing words apart
        • per character spacing- justify by spacing each character
        • by character width - justify by setting the width of each character
    • attach to object -sets height and width to an object
      • border left
      • border right
      • border top
      • border bottom
    • set all/per character width Absolute/ or ratio (to the original character size)
    • set all/per character height Absolute/ or ratio (to the original character size)
    • set capital/lowercase size - allows you to make capital of lowercase letters, by adjusting the size ratio x/y
    • set scroll x/y ( relative/absolute) - offset from phrase position
    • set rotation (of entire phrase)
    • set position (of entire phrase)
    • set circular x/y (on/off) - this makes it so a letter scrolling off the left side, comes back out the right side if you scroll beyond the end of the phrase
    • set phrase width - sets the width ratio of the letters, so they all fit into this width

    now I will have to be careful with the naming of actions, because you will be able to do this per character meaning "a", so every "a" is set to a certain width or per character, to be used with the following condition:

    • For each character in phrase - which could do all of the above functions, but per character in phrase (in order regardless of what letter it is), this will make it possible to do all the crazy stuff you'd want to do with bouncy swirly, zigzaggy text, text wrapped in a circle, it's up to you to come up with the algorithms, using the actions, and the following conditions: (most of the "get" conditions will also have a "get previous" and "get next" but I don't want to write all that out)
    • get character x/y
    • get character position in phrase
    • get character distance from left/right/top/bottom edge (of text display width)

    oh yes, and of course actions to put the text to the screen

    please let me know if I missed anything.

    edit: davio added request for outputting character by character one at a time, and a corresponding "on character typed" condition to add typewriter sounds for instance

    also, letting users use your text as an edit box, is a feature I plan to add later, after a stable build (of this plugin)

  • This might sound a bit weird, but wouldn't the effects like swirls, zigzag, etc be better in a behavior you could attach to any object? I'm thinking the behavior could run off of for each object(ordered) in a family. Then the behavior could have several types of movements built in.

  • This might sound a bit weird, but wouldn't the effects like swirls, zigzag, etc be better in a behavior you could attach to any object? I'm thinking the behavior could run off of for each object(ordered) in a family. Then the behavior could have several types of movements built in.

    it would be easier to just build them into the plugin, but that would also be limiting, since I would be deciding what things you could or couldn't to do with your text.

    but if you give me an example of something you'd like to see text do, I can show you how it's easy to do with very few actions, conditions, and expressions.

  • sorry for the repost, but it's on second page now, and no one would see this

    it's still a little ways off, mostly because I'm busy...it really doesn't take too long to make a plugin

    these are the features that will go in, if all works out:

    actions:

    • choose sprite, there won't be any special setup options, because splitting up tiles, and importing several frames, is very easy with the builtin features in construct, so you import your font sprites into one animation in construct
    • Set Animation Range: here you will be able to set up a range of characters to go with a range of frames, so if your font only has 0-9, and a-z, you would call this action once for each range, you choose which animation frames go with which range of characters
      • Frame Start
      • Frame End
      • Character Start
      • Character End
    • Set Spacing: this will set how far the next character will be placed from the last, you will be able to set whether the space is from an imagepoint or from the edge of the sprite
      • from imagepoint/from edge - edge is default
      • all / per character - apply spacing to all, or override "all" setting for one character - decides how far the next character will be from it
      • spacing - a number, 0 would be touching, negative positive corresponds to left/right number of pixels offset
    • set wrap width - set the width the words wrap in. I will do my best to follow any wrapping conventions I'm aware of, but I don't have the time to research, and I'm not an expert on formatting, but I did read yours arima, and that will be observed
    • set display width - this is to be able to put your text into a box and scroll through it, it will make some of the other actions possible, and save the user from having to make a mask everytime they want to do this
    • set alignment - left/right/centered
    • set justified -
      • on/off
      • method
        • between word spacing - justify the normal way, by spacing words apart
        • per character spacing- justify by spacing each character
        • by character width - justify by setting the width of each character
    • attach to object -sets height and width to an object
      • border left
      • border right
      • border top
      • border bottom
    • set all/per character width Absolute/ or ratio (to the original character size)
    • set all/per character height Absolute/ or ratio (to the original character size)
    • set capital/lowercase size - allows you to make capital of lowercase letters, by adjusting the size ratio x/y
    • set scroll x/y ( relative/absolute) - offset from phrase position
    • set rotation (of entire phrase)
    • set position (of entire phrase)
    • set circular x/y (on/off) - this makes it so a letter scrolling off the left side, comes back out the right side if you scroll beyond the end of the phrase
    • set phrase width - sets the width ratio of the letters, so they all fit into this width

    now I will have to be careful with the naming of actions, because you will be able to do this per character meaning "a", so every "a" is set to a certain width or per character, to be used with the following condition:

    • For each character in phrase - which could do all of the above functions, but per character in phrase (in order regardless of what letter it is), this will make it possible to do all the crazy stuff you'd want to do with bouncy swirly, zigzaggy text, text wrapped in a circle, it's up to you to come up with the algorithms, using the actions, and the following expressions: (most of the "get" conditions will also have a "get previous" and "get next" but I don't want to write all that out)
    • get character x/y
    • get character position in phrase
    • get character distance from left/right/top/bottom edge (of text display width)

    oh yes, and of course actions to put the text to the screen

    please let me know if I missed anything.

    edit: davio added request for outputting character by character one at a time, and a corresponding "on character typed" condition to add typewriter sounds for instance

    also, letting users use your text as an edit box, is a feature I plan to add later, after a stable build (of this plugin)

  • Please! spacing specified by character PAIR as you wouldn't place AM the same distance apart than AV

    that's kerning, by character pair!

  • Well, that all depends on the font. But yeah, it would be nice.

    Most games have monospaced fonts or fonts that are spaced solely on character width, so such a feature would be quite the perk.

  • would you be able to load an external image during runtime?

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)