CEGUI Wiki - Crazy Eddie's GUI System (Open Source) - User contributions [en]

Overview of GUI files

2006-04-19T12:54:17Z

Baxissimo: link to api doc

There are a lot of files that go into creating a GUI with CEGUI. Here is an overview (thanks to lindquist for the original version). An expanded version of this brief overview would be quite useful.

==Overview of CEGUI resource files==
==='''.imageset Files'''===
An imageset is an xml file describing a set of images contained in an image file.
When an imageset is loaded, images from that file become available to the application via the [http://www.cegui.org.uk/api_reference/classCEGUI_1_1ImagesetManager.html ImagesetManager].

Editor: [http://www.cegui.org.uk/phpBB2/viewtopic.php?t=1346 CEImagesetEditor in the works by Martignasse.]

==='''[[Scheme files|.scheme Files]]'''===
A scheme file is an xml file describing the binding of widgets defined in a looknfeel file and the base Falagard widget set. Once loaded the components in the scheme file are available via the [http://www.cegui.org.uk/api_reference/classCEGUI_1_1WindowManager.html WindowManager]. A detailed description of [[Scheme files]] is also available.

Editor: none

==='''.looknfeel Files'''===
These are also xml files, which define the visual aspect of widgets declared in the scheme file.

Editor: none

==='''.layout Files'''===
A layout file is also in xml format. It describes a set of widgets to create and their positions, sizes, and other attributes. Basically this describes the final on-screen layout of your GUI, hence the name.

Editor: [[The_"official"_layout_editor]]

==='''.font Files'''===
These simple xml files give the location of a font file (like a TrueType .ttf file) and define a few extra properties about how CEGUI should use that font.

Editor:

==About [[%22Falagard%22_Skinning_System_Documentation | Falagard]]==
Falagard is the part of the API that makes it possible to create a completly new set of widgets (at the visual level) from xml files.

You can, with a looknfeel, describe a widget and make it appear as you want (by using images defined in some imageset) and finally bind it to one of the widgets from a Falagard Base widget set in a scheme file.

Link: [[%22Falagard%22_Skinning_System_Documentation | Falagard documentation]]

==Related Documents==
* [[XML File formats]] - Detailed documentation of the various XML file formats.

Overview of GUI files

2006-04-19T12:52:44Z

Baxissimo: Link to ImagesetManager API doc

There are a lot of files that go into creating a GUI with CEGUI. Here is an overview (thanks to lindquist for the original version). An expanded version of this brief overview would be quite useful.

==Overview of CEGUI resource files==
==='''.imageset Files'''===
An imageset is an xml file describing a set of images contained in an image file.
When an imageset is loaded, images from that file become available to the application via the [http://www.cegui.org.uk/api_reference/classCEGUI_1_1ImagesetManager.html ImagesetManager].

Editor: [http://www.cegui.org.uk/phpBB2/viewtopic.php?t=1346 CEImagesetEditor in the works by Martignasse.]

==='''[[Scheme files|.scheme Files]]'''===
A scheme file is an xml file describing the binding of widgets defined in a looknfeel file and the base Falagard widget set. Once loaded the component in the scheme file are available via the WindowManager. A detailed description of [[Scheme files]] is also available.

Editor: none

==='''.looknfeel Files'''===
These are also xml files, which define the visual aspect of widgets declared in the scheme file.

Editor: none

==='''.layout Files'''===
A layout file is also in xml format. It describes a set of widgets to create and their positions, sizes, and other attributes. Basically this describes the final on-screen layout of your GUI, hence the name.

Editor: [[The_"official"_layout_editor]]

==='''.font Files'''===
These simple xml files give the location of a font file (like a TrueType .ttf file) and define a few extra properties about how CEGUI should use that font.

Editor:

==About [[%22Falagard%22_Skinning_System_Documentation | Falagard]]==
Falagard is the part of the API that makes it possible to create a completly new set of widgets (at the visual level) from xml files.

You can, with a looknfeel, describe a widget and make it appear as you want (by using images defined in some imageset) and finally bind it to one of the widgets from a Falagard Base widget set in a scheme file.

Link: [[%22Falagard%22_Skinning_System_Documentation | Falagard documentation]]

==Related Documents==
* [[XML File formats]] - Detailed documentation of the various XML file formats.

XML File formats

2006-03-27T02:00:16Z

Baxissimo: more links to new straw man pages

*[[Scheme files]] - Reference manual for the scheme XML format.
*[[Layout files]] - Reference manual for the layout XML format.
*[[Imageset files]] - Reference manual for the layout XML format.
*[[Font files]] - Reference manual for the font XML format.
* Looknfeel files - ''not available yet''

===Related Documents===
* [[Overview of GUI files]] - an brief overview of what role each these xml files plays.

Layout files

2006-03-27T01:56:51Z

Baxissimo:

For the time being, this has been copy-and-pasted directly from "readme.txt" in the XMLRefSchema directory of the CEGUI source code. Some prettier formatting along the lines of '''[[Scheme files|this page]]''' would be nice.

<pre>
A GUI Layout defines a hierachy of Window based objects to be created and a property settings for each window.
The root element is GUILayout.

GUILayout Element
=================
GUILayout is the root element.
The GUILayout must contain a single Window element only.

GUILayout attributes
--------------------
Parent - Specifies the name of an existing window that this gui layout should be attached to (optional).

Window Element
==============
The Window element is used to specify a new window object to be created.
The Window element has attributes as described below and may contain any number of nested Window elements, any number of Property elements,
any number of LayoutImport elements, and any number of Event elements.

Window attributes
-----------------
Type - Specifies the type of Window object to be created (required).
Name - Specifies the unique name for the Window. If this is ommitted a name will be generated. If a window with the name already exists, an exception will be thrown. (optional).

Property Element
================
The Property element is used to set properties on the Window created by the containing Window element.
Property has no sub-elements, but has attributes as described below.

Property attributes
-------------------
Name - The name of the property to be set. If no such property exists for the target window, an exception may be thrown. (required).
Value - The value to be assigned to the property. This must be in a format expected by the property or an exception may be thrown. (required).

LayoutImport Element
====================
The LayoutImport element is used to reference (import) a layout file into another. The root window of the imported layout is attached to the Window where the import occurrs.
The LayoutImport element has attributes but no sub-elements.

LayoutImport attributes
-----------------------
Filename - Specifies the filename of the layout XML file to be imported.
ResourceGroup - The resource group identifier to pass to the resource provider when loading the file.

Event Element
=============
The Event element is used to create bindings between Gui elements and script functions.
The Event element has attributes but no sub-elements.

Event attributes
----------------
Name - Specifies the name of the target event.
Function - Specifies the name of the script function that is to be bound to the event.
</pre>

Imageset files

2006-03-27T01:56:43Z

Baxissimo:

For the time being, this has been copy-and-pasted directly from "readme.txt" in the XMLRefSchema directory of the CEGUI source code. Some prettier formatting along the lines of '''[[Scheme files|this page]]''' would be nice.

<pre>
Imagesets define one or more images on a larger image (texture).
The root element must be Imageset.

Imageset Element
================
Has attributes and a collection of one or more Image elements.

Imageset attributes
-------------------
Imagefile - path to the image file containing the graphics (required).
ResourceGroup - The resource group identifier to pass to the resource provider when loading the file.
Name - the name that will be assigned to the Imageset in the GUI system (required).
NativeHorzRes - The horizontal screen resolution that the images were are intended to be displayed at (optional, default=640).
NativeVertRes - The vertical screen resolution that the images were are intended to be displayed at (optional, default=480).
AutoScaled - Boolean, states whether to scale imagery so it appears the same size as any resolution (optional, default=false).

Image Element
=============
Has attributes defining an sub-image area. Can have no sub-elements.

Image attributes
----------------
Name - The name that will be used to identify the image within the Imageset. (required).
XPos - X pixel co-ordinate of the top-left corner of the image on the texture. (required).
YPos - Y pixel co-ordinate of the top-left corner of the image on the texture. (required).
Width - Width of this image in pixels. (required).
Height - Height of this image in pixels. (required).
XOffset - Horizontal offset to apply when rendering. (optional, default=0)
YOffset - Vertical offset to apply when rendering. (optional, default=0)

</pre>

Font files

2006-03-27T01:56:38Z

Baxissimo:

For the time being, this has been copy-and-pasted directly from "readme.txt" in the XMLRefSchema directory of the CEGUI source code. Some prettier formatting along the lines of '''[[Scheme files|this page]]''' would be nice.

<pre>
Font files can define one of two types of font; a static bitmapped font based on an Imageset stored on disc, or a dynamically created font made from a true-type font file (.ttf).

The Root element must be Font.

Font Element
============
Font is the root element, it has some attributes and optional 'Mapping', 'GlyphSet', 'GlyphRange', and 'Glyph' elements.
Mapping elements are only of importance for static / bitmap fonts, any Mapping elements defined for a dynamic font should be ignored.
GlyphSet, GlyphRange, and Glyph elements are only valid for dynamic fonts.

Font attributes
---------------
Name - the name that will be used to identify the Font within the system. (required).
Filename - filename for the font. For Static fonts this is an Imageset. For Dynamic fonts this is a .ttf file. (required).
ResourceGroup - The resource group identifier to pass to the resource provider when loading the file.
Type - Specifies the type of font. Valid options are 'Static' or 'Dynamic' (required).
Size - Specifies the point size for a dynamic font, ignored for Static fonts. (optional, default=12).
FirstCodepoint - Specifies the first codepoint to be available on the dynamic font. (optional, default=32).
LastCodepoint - Specifies the last codepoint to be available on the dynamic font. (optional, default=127).
NativeHorzRes - The horizontal screen resolution that the images were are intended to be displayed at (optional, default=640).
NativeVertRes - The vertical screen resolution that the images were are intended to be displayed at (optional, default=480).
AutoScaled - Boolean, states whether to scale imagery so it appears the same size at any resolution (optional, default=false).
AntiAlias - Boolean, states whether the font should be anti-aliased, applies to dynamic fonts only. (optional, default=true).

Mapping Element
===============
Used for static fonts only, defines a mapping between a code-point and a Image on the associated Imageset.
A Mapping must be supplied for every codepoint that the font is to have available. A Mapping has attributes but no sub-elements.

Mapping attributes
------------------
Codepoint - Unicode codepoint which should be mapped. (required).
Image - Name of the image to map. This image shold be defined for the Imageset specified in Filename for the Font.
HorzAdvance - Number of pixels to advance the 'pen' position after rendering. -1 indicates the values should be auto-calculated. (optional, default=-1).

GlyphSet Element
================
Used for dynamic fonts only. Defines a set of codepoints for which glyphs should be made available in the font.
Multiple GlyphSet elements may be specified. A GlyphSet element has attributes but no sub-elements.

GlyphSet attributes
-------------------
Glyphs - String defining the character / codepoint glyphs to be available.

GlyphRange Element
==================
Used for dynamic fonts only. Defines a range of codepoints for which glyphs should be made available in the font.
Multiple GlyphRange elements may be specified. A GlyphRange element has attributes but no sub-elements.

GlyphRange attributes
---------------------
StartCodepoint - U+ codepoint of the first glyph that is part of this range.
EndCodepoint - U+ codepoint of the last glyph that is part of this range.

Glyph Element
=============
Used for dynamic fonts only. Defines a singal codepoint for which a glyph should be made available in the font.
Multiple Glyph elements may be specified. A Glyph element has attributes but no sub-elements.

Glyph attributes
----------------
Codepoint - U+ codepoint of the glyph to be added to the font.

</pre>

Imageset files

2006-03-27T01:52:15Z

Baxissimo:

For the time being, this has been copy-and-pasted directly from "readme.txt" in the XMLRefSchema directory of the CEGUI source code. Some prettier formatting along the lines of [[Scheme files|this page]] would be nice.

<pre>
Imagesets define one or more images on a larger image (texture).
The root element must be Imageset.

Imageset Element
================
Has attributes and a collection of one or more Image elements.

Imageset attributes
-------------------
Imagefile - path to the image file containing the graphics (required).
ResourceGroup - The resource group identifier to pass to the resource provider when loading the file.
Name - the name that will be assigned to the Imageset in the GUI system (required).
NativeHorzRes - The horizontal screen resolution that the images were are intended to be displayed at (optional, default=640).
NativeVertRes - The vertical screen resolution that the images were are intended to be displayed at (optional, default=480).
AutoScaled - Boolean, states whether to scale imagery so it appears the same size as any resolution (optional, default=false).

Image Element
=============
Has attributes defining an sub-image area. Can have no sub-elements.

Image attributes
----------------
Name - The name that will be used to identify the image within the Imageset. (required).
XPos - X pixel co-ordinate of the top-left corner of the image on the texture. (required).
YPos - Y pixel co-ordinate of the top-left corner of the image on the texture. (required).
Width - Width of this image in pixels. (required).
Height - Height of this image in pixels. (required).
XOffset - Horizontal offset to apply when rendering. (optional, default=0)
YOffset - Vertical offset to apply when rendering. (optional, default=0)

</pre>

User talk:Baxissimo

2006-03-27T01:41:58Z

Baxissimo:

I'm interested in making CEGUI easier to use.

I'm currently mulling over how to provided a simplified interface to CEGUI that lets you get going trivially in a jiff.

For instance, I'm thinking you should be able to do something like this in your code:

<pre>
using namespace CEGUI_EZ;
CEGUI_EZ::Initialize();
EZGUI *gui = new EZGUI();
w = new Panel(gui, "Test GUI");
new Button(w, "Click me", buttoncb);
new Slider(w, "Frob me", slidercb);
Menu* m = new Menu(w,"Options",menucb);
new MenuItem(m, "Choice 1");
new MenuItem(m, "Choice 2");
new MenuItem(m, "Choice 3");
</pre>

And you'd have a usable GUI of some sort that calls the specified callback functions when something happens.

Help:Editing

2006-03-27T01:39:19Z

Baxissimo: link straight to wiki markup section

Hmm. There seems to be a real lack of help here...

I think CEGUI.org.uk is using a wiki similar to WikiPedia, so [http://en.wikipedia.org/wiki/Wikipedia:How_to_edit_a_page#Wiki_markup their documentation may be of help].

Help:Editing

2006-03-27T01:38:13Z

Baxissimo: Added a link to wikipedia's help.

Hmm. There seems to be a real lack of help here...

I think CEGUI.org.uk is using a wiki similar to WikiPedia, so [http://en.wikipedia.org/wiki/Wikipedia:How_to_edit_a_page their documentation may be of help].

Overview of GUI files

2006-03-27T01:32:34Z

Baxissimo: links mostly

There are a lot of files that go into creating a GUI with CEGUI. Here is an overview (thanks to lindquist for the original version). An expanded version of this brief overview would be quite useful.

==Overview of CEGUI resource files==
==='''.imageset Files'''===
An imageset is an xml file describing a set of images contained in an image file.
When an imageset is loaded, images from that file become available to the application via the ImagesetManager.

Editor: [http://www.cegui.org.uk/phpBB2/viewtopic.php?t=1346 Something in the works by Centipede?]

==='''[[Scheme files|.scheme Files]]'''===
A scheme file is an xml file describing the binding of widgets defined in a looknfeel file and the base Falagard widget set. Once loaded the component in the scheme file are available via the WindowManager. A detailed description of [[Scheme files]] is also available.

Editor: none

==='''.looknfeel Files'''===
These are also xml files, which define the visual aspect of widgets declared in the scheme file.

Editor: none

==='''.layout Files'''===
A layout file is also in xml format. It describes a set of widgets to create and their positions, sizes, and other attributes. Basically this describes the final on-screen layout of your GUI, hence the name.

Editor: [[The_"official"_layout_editor]]

==='''.font Files'''===
These simple xml files give the location of a font file (like a TrueType .ttf file) and define a few extra properties about how CEGUI should use that font.

Editor:

==About [[%22Falagard%22_Skinning_System_Documentation | Falagard]]==
Falagard is the part of the API that makes it possible to create a completly new set of widgets (at the visual level) from xml files.

You can, with a looknfeel, describe a widget and make it appear as you want (by using images defined in some imageset) and finally bind it to one of the widgets from a Falagard Base widget set in a scheme file.

Link: [[%22Falagard%22_Skinning_System_Documentation | Falagard documentation]]

==Related Documents==
* [[XML File formats]] - Detailed documentation of the various XML file formats.

XML File formats

2006-03-27T01:21:20Z

Baxissimo:

[[Scheme files]] - Reference manual for the scheme XML format.

===Related Documents===
* [[Overview of GUI files]] - an brief overview of what role each these xml files plays.

Overview of GUI files

2006-03-27T01:11:44Z

Baxissimo: added link to scheme files page

There are a lot of files that go into creating a GUI with CEGUI. Here is an overview (thanks to lindquist for the original version). An expanded version of this brief overview would be quite useful.

==Overview of CEGUI resource files==
==='''.imageset Files'''===
An imageset is an xml file describing a set of images contained in an image file.
When an imageset is loaded, images from that file become available to the application via the ImagesetManager.

Editor: [http://www.cegui.org.uk/phpBB2/viewtopic.php?t=1346 Something in the works by Centipede?]

==='''.scheme Files'''===
A scheme file is an xml file describing the binding of widgets defined in a looknfeel file and the base Falagard widget set. Once loaded the component in the scheme file are available via the WindowManager. A detailed description of [[Scheme files]] is also available.

Editor: none

==='''.looknfeel Files'''===
These are also xml files, which define the visual aspect of widgets declared in the scheme file.

Editor: none

==='''.layout Files'''===
A layout files is also in xml format. It describes a set of widgets to create and the positions, sizes, and other attributes those widgets should have. Basically this describes the final on-screen layout of your GUI.

Editor: [[The_"official"_layout_editor]]

==='''.font Files'''===
These simple xml files give the location of a font file (like a TrueType .ttf file) and define a few extra properties about how CEGUI should use that font.

Editor:

==About Falagard==
Falagard is the part of the API that makes it possible to create a completly new set of widgets (at the visual level) from xml files.

You can, with a looknfeel, describe a widget and make it appear as you want (by using images defined in some imageset) and finally bind it to one of the widgets from a Falagard Base widget set in a scheme file.

Tutorials

2006-03-27T01:09:48Z

Baxissimo: The "external links" category seemed unnecessary.

=== CrazyEddie's Beginner Guides ===
* [[The Beginner Guide to Getting CEGUI Rendering]] - How to initialise CEGUI to render properly.
* [[The Beginner Guide to Loading Data Files and Initialisation]] - How to load some data files and perform basic system initialisation.
* [[The Beginner Guide to Creating a CEGUI Window]] - How to create a simple window and get it on screen.
* [[The Beginner Guide to Injecting Inputs]] - How to inject inputs into CEGUI and get interactive.

=== Scripting with CEGUI ===
* [[Getting Started with Lua and CEGUI]] - How to initialise CEGUI with a Lua script module and configuration file.
* [[Handling Events from Lua]] - How to load Lua script files and bind CEGUI events to Lua functions.
* [[Writing CEGUI scripts]] - Code snippets
* [[Adding LuaScriptModule to Sample_FirstWindow]] - Experience adding scripting to an existing sample.
* [http://www.gpwiki.org/index.php/Crazy_Eddies_GUI_System:Tutorials:Creating_a_scriptable_interface_using_CEGUI Creating a scriptable interface using CEGUI]

=== Window System Examples ===
* [[Using CEGUI with SDL and OpenGL]] - Guidelines on how to get SDL, OpenGL and CEGUI running together.
* [[Using CEGUI with Producer and OpenGL]] - Guidelines on how to render and inject input to CEGUI from the Producer API.
* [http://artis.imag.fr/Membres/Xavier.Decoret/resources/CEGUI/ Using CEGUI with Qt/QGLViewer]

=== Extending CEGUI ===
* [[Using Expat XML parser within CEGUI]] - How to add support for another XML parser.

=== Skins - Tutorial For Artists ===
* [[Creating Skins]] - Extra notes for artists on how to create skins.
* [[The Beginners Guide to Falagard skinning - Part I]] - Learn by doing a Button.
* [[The Beginners Guide to Falagard skinning - Part II]] - More Falagard fun, this time with the Editbox.

=== Overviews ===
* [[Overview of GUI files]] - A quick introduction to all the XML files used by CEGUI.

Tutorials

2006-03-27T01:05:54Z

Baxissimo:

=== CrazyEddie's Beginner Guides ===
* [[The Beginner Guide to Getting CEGUI Rendering]] - How to initialise CEGUI to render properly.
* [[The Beginner Guide to Loading Data Files and Initialisation]] - How to load some data files and perform basic system initialisation.
* [[The Beginner Guide to Creating a CEGUI Window]] - How to create a simple window and get it on screen.
* [[The Beginner Guide to Injecting Inputs]] - How to inject inputs into CEGUI and get interactive.

=== Lua Scripting with CEGUI ===
* [[Getting Started with Lua and CEGUI]] - How to initialise CEGUI with a Lua script module and configuration file.
* [[Handling Events from Lua]] - How to load Lua script files and bind CEGUI events to Lua functions.
* [[Writing CEGUI scripts]] - Code snippets
* [[Adding LuaScriptModule to Sample_FirstWindow]] - Experience adding scripting to an existing sample.

=== Window System Examples ===
* [[Using CEGUI with SDL and OpenGL]] - Guidelines on how to get SDL, OpenGL and CEGUI running together.
* [[Using CEGUI with Producer and OpenGL]] - Guidelines on how to render and inject input to CEGUI from the Producer API.

=== Extending CEGUI ===
* [[Using Expat XML parser within CEGUI]] - How to add support for another XML parser.

=== Skins - Tutorial For Artists ===
* [[Creating Skins]] - Extra notes for artists on how to create skins.
* [[The Beginners Guide to Falagard skinning - Part I]] - Learn by doing a Button.
* [[The Beginners Guide to Falagard skinning - Part II]] - More Falagard fun, this time with the Editbox.

=== Overviews ===
* [[Overview of GUI files]] - A quick introduction to all the XML files used by CEGUI.

=== External Links ===
* [http://www.gpwiki.org/index.php/Crazy_Eddies_GUI_System:Tutorials:Creating_a_scriptable_interface_using_CEGUI Creating a scriptable interface using CEGUI]

* [http://artis.imag.fr/Membres/Xavier.Decoret/resources/CEGUI/ Using CEGUI with Qt/QGLViewer]

User talk:Baxissimo

2006-03-27T00:55:32Z

Baxissimo:

Howdy, I'm baxissimo.

I'm interested in making CEGUI easier to use.

I'm currently mulling over how to provided a simplified interface to CEGUI that lets you get going trivially in a jiff.

For instance, I'm thinking you should be able to do something like this in your code:

<pre>
using namespace CEGUI_EZ;
CEGUI_EZ::Initialize();
EZGUI *gui = new EZGUI();
w = new Panel(gui, "Test GUI");
new Button(w, "Click me", buttoncb);
new Slider(w, "Frob me", slidercb);
Menu* m = new Menu(w,"Options",menucb);
new MenuItem(m, "Choice 1");
new MenuItem(m, "Choice 2");
new MenuItem(m, "Choice 3");
</pre>

And you'd have a usable GUI of some sort that calls the specified callback functions when something happens.

Overview of GUI files

2006-03-27T00:43:15Z

Baxissimo: About GUI files

There are a lot of files that go into creating a GUI with CEGUI. Here is an overview (thanks to lindquist for the original version). An expanded version of this brief overview would be quite useful.

==Overview of CEGUI resource files==
==='''.imageset Files'''===
An imageset is an xml file describing a set of images contained in an image file.
When an imageset is loaded, images from that file become available to the application via the ImagesetManager.

Editor: [http://www.cegui.org.uk/phpBB2/viewtopic.php?t=1346 Something in the works by Centipede?]

==='''.scheme Files'''===
A scheme file is an xml file describing the binding of widgets defined in a looknfeel file and the base Falagard widget set. Once loaded the component in the scheme file are available via the WindowManager.

Editor: none

==='''.looknfeel Files'''===
These are also xml files, which define the visual aspect of widgets declared in the scheme file.

Editor: none

==='''.layout Files'''===
A layout files is also in xml format. It describes a set of widgets to create and the positions, sizes, and other attributes those widgets should have. Basically this describes the final on-screen layout of your GUI.

Editor: [[The_"official"_layout_editor]]

==='''.font Files'''===
These simple xml files give the location of a font file (like a TrueType .ttf file) and define a few extra properties about how CEGUI should use that font.

Editor:

==About Falagard==
Falagard is the part of the API that makes it possible to create a completly new set of widgets (at the visual level) from xml files.

You can, with a looknfeel, describe a widget and make it appear as you want (by using images defined in some imageset) and finally bind it to one of the widgets from a Falagard Base widget set in a scheme file.