Glimmr Drawing Commands

version 2/101030 by Erik Temple

  • Home page
  • Beginning
  • Previous
  • Next



  • Section: Image-rendered strings

    Image-rendered strings are painted from individual image files. Each glyph in the font is saved as a separate PNG file. (JPEG files should be avoided--we will have far more flexibility if we save the image file as a transparent PNG. This will allow us, for example, to specify a background color--JPEG files are opaque, and will not permit us to see anything behind them.)

    We can scale image-rendered strings to any size we wish, though obviously some sizes will be better than others. This is done by providing a scaling factor, a ratio, always provided to the fourth decimal place. Here are some examples of the expression of the ratio:

        1.0000 = original size of image file
        0.5000 = 50% of original size
        0.1250 = 1/8 of original size
        2.0000 = twice the original size (scaling up is not recommended)

    Note that Glulx cannot affect the color of image files, so it is not possible to change the color of the glyphs in an image font. For this reason, there is no foreground color specification in the image text painting commands. If the font's image files are transparent PNGs, a background color can be supplied (similar to a highlight effect in Microsoft Word, or to the background-color CSS attribute for inline HTML text elements). For the short form commands, we can as usual specify the background color using the "current background-color" variable.

    If we provide a background color, we must also specify the width of a margin around the image files. This allows us to optimize the appearance of the background color rectangle. The number of pixels specified must be an integer and will be added to the size of the background color rectangle on each side. So, if the margin is 3, 3 pixels will be added at top, bottom, left, and right. The margin value is similar to the padding value in CSS. (The margin can be set to 0 if we like.)

        paint image-based text of <indexed text> in <window> at <origin> using <font> scaled at <scaling factor>

        paint image-based text of <indexed text> in <window> at <origin> using <font> scaled at <scaling factor> with background <color> and margin of <width> pixels

    With variable alignment:

        paint image-based text of <indexed text> in <window> at <origin> using <font> scaled at <scaling factor>, <alignment>

        paint image-based text of <indexed text> in <window> at <origin> using <font> scaled at <scaling factor> with background <color> and margin of <width> pixels, <alignment>

    Long forms:

        paint image-based text of "[the location]" in the graphics-window at {5, 5} using Glimmr Lucidex scaled at 0.4500.

        paint image-based text of "[the location]" in the graphics-window at {5, 5} using Glimmr Lucidex scaled at 0.4500 with background (g-LightGray) and margin of 3 pixels.

        paint image-based text of "[the location]" in the graphics-window at {5, 5} using Glimmr Lucidex scaled at 0.4500, right-aligned.

        paint image-based text of "[the location]" in the graphics-window at {5, 5} using Glimmr Lucidex scaled at 0.4500 with background (g-LightGray) and margin of 3 pixels, center-aligned.

    Short forms:

        image text "[the location]" at {5, 5} scale 0.4500.

        image text "[the location]" at {5, 5} scale 0.4500 margin 3 px.

        image text "[the location]" at {5, 5} scale 0.4500, right-aligned.

        image text "[the location]" at {5, 5} scale 0.4500 margin 3 px, center-aligned.

    The presence of the margin in the short form serves to indicate that we want a background color, and that color will be provided by the "current background-color" variable.

    Note that to use short forms for image-rendered strings, we must first set the "current font" global variable to the name of the font we wish to use. For the image font provided along with Glimmr (in the Glimmr Image Font extension), we would do this as follows:

        change the current font to Glimmr Lucidex;
        image text "Hello Sailor" at {35, 140} scale 0.3500 margin 2 px.

    Speed notes:

        A single image-based text command may display a large number of images to the screen at once. The speed is probably roughly equivalent to the speed required to draw the images individually. Image-based texts are likely to perform well in any interpreter that draws images quickly, and until interpreters' speed at drawing rectangles is improved, they will tend to be faster than bitmap-rendered strings. (The bleeding-edge versions of Gargoyle available as of summer 2010 may be exceptions to this.)