Changing font in Glide

Hi

I’m new to Glide, and struggles to find out how I can use a custom font.

I have used the Tinyfont GUI app, and used tfconvert.exe to make the font.
And then imported the font into ressources in my project.

But then what?

I have used Glide designer to create some text and buttons.
And now I want to tell Glide to use this font.
How do I do that?

Thanks in advance.

Kaare

(all my limited glide experience is with generated windows and not the XML)

Is your new font showing up in the resource enumeration?

Resources.GetFont(Resources.FontResources.CustomFontHere);

Yes, my font appears OK.

But I don’t know how to use it, to tell Glide to change Font.

In the Glide designer, I can choose between some predefined fonts.
And I have found an example on how to do it with a simple text in NETMF.
But nothing on how to use it with Glide controls.

br
Kåre

I’m not in a position to test it at the minute, but I see that the fonts listed in the Glide designer bear no resemblance to the ones used on Gadgeteer, and the output XML from the designer refers to the fonts by number - have you tried hand-editing this number, to maybe see if it might correspond to your enumerated font resources? I’d have thought changing that number to e.g. 0 or 1 or 2 might either select from your local font resources (if Glide’s using them), or have no effect at all (if Glide’s ignoring them).

That’s correct. I have noticed the same, but have not figured out the relation between font in Glide designer, font in NETMF/Visual Studio, and the Font number in the HTML file generated by Glide Designer.
I have to do some real work, so right now, I don’t have time to do the fun work :o).
I will test when I get time.

Glide comes with predefined fonts to help the end user. The font you choose in the designer simply corresponds to the proper FontType in Glide. You can however change the Font of some controls via the Font property.


Font customFont = Resources.GetFont(Resources.FontResources.CustomFontHere);
Dropdown.Font = customFont;
TextBlock.Font = customFont;
...

You would want to do this before the window is drawn. Otherwise you’ll want to Invalidate.

Is it safe to assume that it’s also possible to use the custom font name in XML based window definitions?

The Font attribute in the XML is parsed into an int and used to look up the FontType. Having a string here wouldn’t work.

Hmmm…

Josh: I have seen that way to change font to an object.
But in my case, I have defined a window with several objects (text field, buttons…), in Glide, with the HTML file.

I load the windows into an array:

        guiWindows[0] = GlideLoader.LoadWindow(Resources.GetString(Resources.StringResources.WindowAdd));

And show this window:

        Glide.MainWindow = guiWindows[0];

Where should I change the font?
This is not possible:

         Glide.MainWindow.Font_something

Any idea?

br
Kåre

If I understand Josh correctly (no guarantee of that ) you could specify the Font enumeration value (the underlying int value) in your XML window description.

In their “Simple” example (http://www.ghielectronics.com/glide/example/3/) They have this in the XML:

This is being set in C#:

xml += "<TextBlock Name=\"title\" X=\"0\" Y=\"104\" Width=\"320\" Height=\"32\" Alpha=\"255\" Text=\"Simple Example\" TextAlign=\"Center\" TextVerticalAlign=\"Middle\" Font=\"6\" FontColor=\"000000\" BackColor=\"000000\" ShowBackColor=\"False\"/>";

Notice this part → Font="6"

So you would need to replace the 6 with your custom font’s value.

Another of their examples (webcam - http://www.ghielectronics.com/glide/example/1/)

This is being set in a resource string (which looks like what you are doing as well):

<Glide Version="x.x.x">
  <Window Name="window" Width="320" Height="240" BackColor="dce3e7">
    <Image Name="webcam" X="80" Y="40" Width="160" Height="120" Alpha="255"/>
    <Button Name="toggleBtn" X="80" Y="170" Width="160" Height="32" Alpha="255" Text="Start" Font="4" FontColor="000000"/>
  </Window>
</Glide>

Same again with the Font=“4” in the Button.

I tried to change the fon, even though I don’t know where the font is extracted.
But now I know: when I choose a font in the html file that don’t exist, an exception is thrown in “FontManager.cs”.
This is a file under Glide.

    /// Returns a font resource specified by a font type.
    /// </summary>
    /// <param name="type"></param>
    /// <returns></returns>
    public static Font GetFont(FontType type)
    {
        switch (type)
        {
            case FontType.droid_reg08:
                return Resources.GetFont(Resources.FontResources.droid_reg08);
              ...
             case FontType.droid_reg24:
                return Resources.GetFont(Resources.FontResources.droid_reg24);
            default:
                throw new ArgumentException("No such font exists.");
        }
    }

I believe it should be pretty easy to add my font here, quick and dirty…
But I am concerned if this is they right way of doing it?
If I change a Glide source file, and want to update Glide with new version, my own changes will be gone.

br
Kåre

Yeah I guess you would need to change it fit your needs. That’s what I did in my project - I updated my listbox to use different background colors in the listbox items.

But I guess Josh would need to answer this specific question.

**

As I see it:

If you need ultimate flexibility - then you can write your own display manager.
If you want more flexibility from an existing library - then you can use WPF.
If you want a project that is optimized from these devices and that can be “easily” customized - then you can use Glide.

You have two choices.

  1. Modify the Glide code. Place a new constant within public enum FontType. Add a case within GetFont’s switch to catch the new constant and return the resource you added. If you added a constant after all the droid ones, its value in the XML would be 10 (which increases for each font you add). This would allow you to specify the fonts for each component within the XML.
/// <summary>
/// Different types of fonts/sizes.
/// </summary>
public enum FontType
{
    customFont1
}

/// <summary>
/// Returns a font resource specified by a font type.
/// </summary>
/// <param name="type"></param>
/// <returns></returns>
public static Font GetFont(FontType type)
{
    switch (type)
    {
        case FontType.customFont1:
            return Resources.GetFont(Resources.FontResources.customFont1);
    }
}
  1. Don’t modify Glide code. Call a function to initialize the window before setting Glide.MainWindow. This will only need to be done once before the window(s) are shown.
static void InitWin1()
{
    // Do this for every component you want changed
    Button button = (Button)_windows[0].GetChildByName("btn");
    button.Font = Resources.GetFont(Resources.FontResources.customFont1);
}

Thanks Josh!

#2 worked right away. But I found out it is a bit inconvenient to do it this way. If I just want to use the same font all over the application, #1 is the solution.

#1 now works, after a bit struggle, but not much.
Solution:

  1. Add the new font in the Glide project, as you showed.
  2. Add the font as a resource.
  3. And recompile it, to get the new dll
  4. Change the ressource in you rproject to this new Glide dll.
  5. Change the html Font to the new enum

I was a bit confused first. Changed the source, but did not realize at first that I should do the changes in Glide and recompile to get the dll.
And then it still did not work when recompiling app code. But I think I just messed something up, so I still used the old dll.
OK, no big deal. 1½ hour work, and now it works :o)

Thanks for all the help!

br
Kåre

Have you tried to add the Glide project to a solution also containing your project? If you do this remove the reference to the Glide dll, and then add a reference to your modified project.

It’s similar in concept to the wiki on modifying module drivers.