Home › Blogs › Paul's blog

Tesseract and TIM

Wed, 02/14/2007 - 21:10 — Paul

The Tesseract GUI library is a C# assembly allowing the easy creation of GUIs which support theme engines, a variety of different controls and cross platform capabilities. Written in C#, the assembly can be used from any CLR-based language (eg. VB.net, Managed C++, IronPython etc).

TIM (Tesseract Interface Markup) is a part of Tesseract which enables GUIs to be defined using an XML file rather than by creating all controls in code. Take the following example, a simple GUI consisting of 2 buttons and an event hooked up to one of the buttons (Screenshot Attached). To create this GUI using Tesseract and C# code, the following code is necessary:


public static void Main(string[] args)
{
Core.Initialize();

Window wnd = new Window("Tesseract Test Application", 300, 300, 1);

Button btn = new Button("Btn 1");
btn.MouseClicked += new EventHandler<ButtonEventArgs>(
delegate(object sender, ButtonEventArgs e)
{
MessageBox.Show("Button 1 Clicked");
});
wnd.Children.Add(btn);

btn = new Button("Btn 2");
btn.Path = new Rectangle(10, 45, 150, 50);
btn.FontSize = 18;
btn.FontWeight = FontWeight.Bold;
btn.TextColor = 255000000255;
wnd.Children.Add(btn);

Core.Run(wnd);
Core.Cleanup();
}

That is a large amount of code for a simple GUI with 2 buttons and an event, and its not a problem specific to Tesseract, all GUI libraries face a similar problem (and some solve it with a similar method). Cleaning up this messy code is a big priority in Tesseract, and that is where TIM comes in. With TIM, the code becomes this:


public static void Main(string[] args)
{
Core.Initialize();
Window wnd = TIM.Load<MyClass>("../../GUI.xml");
Core.Run(wnd);
Core.Cleanup();
}

public void btn1Clicked(object sender, ButtonEventArgs e)
{
MessageBox.Show("Button 1 Clicked");
}

Where are the buttons? They're in GUI.xml, shown below:


<?xml version="1.0" encoding="utf-8"?>
<TIM xmlns:controls="Tesseract.Controls, Tesseract"
xmlns:shapes="Tesseract.Geometry.Shapes, Tesseract">

Tesseract Test Application
<Path><shapes:Rectangle W="300" H="300"/></Path>

<controls:Button>Btn 1
<MouseClicked>btn1Clicked</MouseClicked>
</controls:Button>

<controls:Button>Btn 2
<Path><shapes:Rectangle X="10" Y="45" W="150" H="50"/></Path>
<FontSize>18</FontSize>
<FontWeight>Bold</FontWeight>
<TextColor>255000000255</TextColor>
</controls:Button>
</TIM>

This offers a number of advantages over the original code based GUI:

  • The code is neater & easier to read
  • The GUI is easy to modify without changing the code
  • The XML can be kept outside of the executable, allowing changes without recompiling (It will also be compilable as a resource)

Note that Tesseract is still being developed so the above may change a little (or a lot). More information about Tesseract along with the code is coming soon.