Glossy Serpent Skin / Theme for CEGUI 0.7

[dezGusty]

New release
Version 0.5:
~~~~~~~~~~~~
New widgets/windows:
- ListboxTransparent

Fixes:
- tooltip border shape corrected
- replaced tooltip colors (both font and background) to allow (nicer looking) multicolor text.

Miscellaneous:
- added sample application. Based on the standard CEGUI sample application "Demo8". Uses Lua.


Also updated the wiki page, which includes a donation page now.

[sabby7890]

Whoa. This is awesome! I've just added it to my project and it looks really cool!

Here are some suggestions though:
- It looks very nice with OpenSans 9pt font.
- You could give some padding to group box caption
- Since it shouldn't be that hard, you can release few variations of the theme (blue, yellow, orange, green) - just tint the imageset

Anyway, this theme is brilliant!

[dezGusty]

Hi sabby, thank you for the feedback and suggestions. I will try them soon, as I already started making a couple of small changes for the next minor version of the skin.
Colour variations of the theme is planned, but will not be available very soon

[dezGusty]

Hello everyone,
I am happy to announce a new release of the skin.

Version 0.6:
~~~~~~~~~~~~
Removed widgets/windows:
- SimpleTransparentPanel: redundant due to new property on SimplePanel widget (TransparencyColour)
- to get the same effect as before, use the property as <Property Name="BackgroundPictureColour" Value="AFFFFFFFF" />

New widgets/windows:
- Checkbox32: identical to the old Checkbox (the new checkbox underwent minor changes)
- Checkbox: modified look and feel so that it can be used with smaller sizes. (The imagery is basically the same, but projects like MMiX.Me which use small widgets will look crisper now).
- SerpentPanel: similar to SimplePanel, but using a different set of pictures, with some snake figures in the corner. Having widgets such as this one was the goal of the skin from the very beginning.

Miscellaneous:
- FrameWindow: decreased minimum relative size from 0.1 to 0.01. The reason behind this is that the frame window (being more of a base widget) is used by many for generic purposes, so 0.1 was too large in some cases.
- Small changes to the (text) selection brushes. They are "smoother" now.
- Group Box supports an offset for the caption (property: CaptionOffset; default: 10). Thanks to sabby7890 for the suggestion.
- SimplePanel has a transparent middle content by default and a non-transparent border.
- You can set the background to be non-transparent using the property <Property Name="BackgroundPictureColour" Value="FFFFFFFFF" />
- Transparency of source pictures removed for SimplePanel, FrameWindow. Now transparency is controlled in the code.
- Minor changes to the inner shadow of SimplePanel and FrameWindow.

You can get the new files from the project's sourceforge page: https://sourceforge.net/projects/glossyserpent/files/

[dezGusty]

Hello everyone,
The winter holiday is here, with time away from work. So I am happy to announce a new release of the skin.

Version 0.7:
~~~~~~~~~~~~
Removed widgets/windows:
- Checkbox32: no longer needed. Simple checkbox can be used instead.

Miscellaneous:
- Added support for custom colouring of items via code. Many images were redone to be gray-scale and have colorized information applied to them via XML. The default theme look might have a somewhat different feel as a result.
- Progressbar: added a leading part and one extra layer. The widget should look much nicer now.
- Button32, Button32_4C, ProgressBar: added extra layers to reduce cut-out of items when resized under the source image size.
- RadioButton: now using the checkbox widget entirely.
- FrameWindow: added glyph support.

The colour information is stored in the "*.looknfeel" files. "Default", "Amber" and "Jade" looknfeel files are available. Just rename them to the GlossySerpent.looknfeel to test them.

Screenshots:



The new data files (along with a sample) are available here: https://sourceforge.net/projects/glossyserpent/files/

[Montred]

This is amazing. I'm using this theme for my game, your dedication is awesome, thanks for another version. In fact the fact that your theme existed was the reason I decided to use CEGUI as opposed to Gwen, as I thought it would save me a lot of time. I've been using it since you released it (almost a year I think?)

Consider placing a donation button in your sourceforge project. I'd make a donation.

As feedback, I would suggest to up the detail of the theme by two, and use a 1024x1024 imageset, 512 doesn't cut it nowadays, imho. I tried upscaling it myself adding some detail and then multiplying all the numbers on the imageset by 2, but I hit the problem that some of the elements are expressed as offsets and not relative, so things got broken.

So I would suggest either getting rids of offsets and making everything relative (that would be awesome, but I don't think CEGUI would allow it) or upscaling everything by two (that's assuming you have photoshop sources that would give us more detail, otherwise this would do nothing). CEGUI is a very old project, and by the time it was released a typical resolution was 800x600, but now a typical resolution is double than that.

[dezGusty]

Hi Montred, thanks for the feedback, it's appreciated.

Donating is enabled, but it's not so easy to find: http://sourceforge.net/p/glossyserpent/wiki/Donating/

One thing I should mention: I am currently working on adapting the version to the CEGUI 1.0 format. I am concentrating my engineering efforts on that.

I understand perfectly what you mean by the issue of the default 800x600 resolution. The initial plan was to have 2 versions of the skin: one for HD (1366x768) and one for full HD (1920x1080). However, maintaining them means hard work, so for the time being, only the first is developed. As soon as things get stable, I will also release a version designed for high resolution displays.
Getting rid of the offsets however is not technically possible, due to the approach I started with.

All the best,
dezGusty

[dezGusty]

Hello,
a new release of the skin is out ( https://sourceforge.net/projects/glossyserpent/files/ )
I tried to do more things this time, but could not do all of them. As expected, adding more options, increases the needed time dramatically. So instead of waiting until it's completely done, I chose to release the current work as 0.8 and to complete everything else for 0.9.
Most important addition: by popular demand, a higher resolution version of the skin.
As a comparison, this is the basic skin: https://docs.google.com/file/d/0Byx-8I_NSC6-UVlhTktGNUFxMHc/edit?usp=sharing
And this is the FHD skin: https://docs.google.com/file/d/0Byx-8I_NSC6-dEdwakxjTUJzeU0/edit?usp=sharing

There are also some datafiles that can be used with the CEGUI 1.0 branch. Only experimental for now.

Version 0.8:
~~~~~~~~~~~~
Removed widgets/windows:
- Radiobutton: removed from looknfeel file. Still present in the scheme file, where it is mapped to a checkbox.

Miscellaneous:
- Minor improvements to the used sizes and images for combo-boxes.
- Added FHD (Full HD) variant of the theme, in which all widget pictures have an increased size, to offer higher details on high resolutions. It's typically recommended to use at least 1920x1080 for these. The FHD variant is called "GlossySerpentFHD" and comes with its own data files. Cursors are not yet brought to the FHD size.
- Removed un-needed code (minor cleanup of used files: imageset and looknfeel)
- Added intermediate datafiles that can be used with the CEGUI 1.0 specification. In case you were transforming the skin from CEGUI 0.7 to CEGUI 1.0 specs, you can try this to see if it works better. Currently available only for the base skin.

All the best,
dezGusty

[CrazyEddie]

Just one word: Awesome!

CE.

[Visse]

Hi
First of I want to say that this is a awesome skin.
The second thing is that I think that I found a nasty little bug, that could in worst case crash your program :/

in GlossySerpent.scheme:

Code: Select all

   <FalagardMapping WindowType="GlossySerpent/SimplePanel"      TargetType="DefaultWindow"  Renderer="Falagard/Button"       LookNFeel="GlossySerpent/SimplePanel" />
   <FalagardMapping WindowType="GlossySerpent/SerpentPanel"      TargetType="DefaultWindow"  Renderer="Falagard/Button"       LookNFeel="GlossySerpent/SerpentPanel" />


Notice the 'Renderer' attribute, I think that it should say 'Falagard/Default', and not 'Falagard/Button'.

A quick fix is to change the renderer and change the 'StateImagery' from 'Normal' to 'Enabled' for 'SimplePanel' & 'SerpentPanel' in GlossySerpent.looknfeel:

Code: Select all

<WidgetLook name="GlossySerpent/SimplePanel">
    [...]
    <StateImagery name="Enabled">
        [...]
    </StateImagery>
</WidgetLook>


[dezGusty]

Hi Visse,

thanks for dropping by and sharing the fix. I can see it could be an issue, but I did not encounter a problem so far. (If you encountered a crash in you application, could you help me out with a some steps that may help in reproducing it? I would like to verify the other widgets in the skin as well )

I will try however to bring this change in the next release.

Thanks again,
dezGusty.

[Visse]

If you encountered a crash in you application, could you help me out with a some steps that may help in reproducing it? I would like to verify the other widgets in the skin as well )

Luckily I didn't experience any crashes that was caused by this bug, but since the 'Falagard/Button' downcast the window to 'ButtonBase', it could have caused a segfault. Regarding how I detected it, it was then I tried to debug my application with valgrind, it showed a couple of warnings regarding conditional jump depending on uninitialized variable in 'FalagardButton::render()'

Keep up with the good work

[Visse]

Hi, I just added support for 'Menubar', 'PopupMenu' & 'MenuItem', and I thought that I would share it , it's basically just a copy of TaharezLook, but I hope it will be use full for someone.

looknfeel:

Code: Select all

   
    <!--
    ***************************************************
        GlossySerpent/Menubar
        (based on the Taharez Look)
    ***************************************************
    -->
    <WidgetLook name="GlossySerpent/Menubar">
        <PropertyDefinition name="BackgroundColours" initialValue="tl:FFFFFFFF tr:FFFFFFFF bl:FFFFFFFF br:FFFFFFFF" redrawOnWrite="true" />
        <PropertyDefinition name="BorderWidth" initialValue="5" layoutOnWrite="true" />
        <NamedArea name="ItemRenderArea">
            <Area>
                <Dim type="LeftEdge" >
                    <ImageDim imageset="GlossySerpent" image="TabContentPaneLeft" dimension="Width">
                        <DimOperator op="Add">
                            <PropertyDim name="BorderWidth" />
                        </DimOperator>
                    </ImageDim>
                </Dim>
                <Dim type="TopEdge" >
                    <ImageDim imageset="GlossySerpent" image="TabContentPaneUpper" dimension="Height">
                        <DimOperator op="Add">
                            <PropertyDim name="BorderWidth" />
                        </DimOperator>
                    </ImageDim>
                </Dim>
                <Dim type="RightEdge" >
                    <UnifiedDim scale="1" type="RightEdge">
                        <DimOperator op="Subtract">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneRight" dimension="Width">
                                <DimOperator op="Add">
                                    <PropertyDim name="BorderWidth" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </UnifiedDim>
                </Dim>
                <Dim type="BottomEdge" >
                    <UnifiedDim scale="1" type="BottomEdge">
                        <DimOperator op="Subtract">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneLower" dimension="Height">
                                <DimOperator op="Add">
                                    <PropertyDim name="BorderWidth" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </UnifiedDim>
                </Dim>
            </Area>
        </NamedArea>
        <ImagerySection name="frame">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" ><UnifiedDim scale="1" type="Width" /></Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image type="TopLeftCorner" imageset="GlossySerpent" image="TabContentPaneUpperLeft" />
                <Image type="TopRightCorner" imageset="GlossySerpent" image="TabContentPaneUpperRight" />
                <Image type="BottomLeftCorner" imageset="GlossySerpent" image="TabContentPaneLowerLeft" />
                <Image type="BottomRightCorner" imageset="GlossySerpent" image="TabContentPaneLowerRight" />
                <Image type="LeftEdge" imageset="GlossySerpent" image="TabContentPaneLeft" />
                <Image type="RightEdge" imageset="GlossySerpent" image="TabContentPaneRight" />
                <Image type="TopEdge" imageset="GlossySerpent" image="TabContentPaneUpper" />
                <Image type="BottomEdge" imageset="GlossySerpent" image="TabContentPaneLower" />
                <Image type="Background" imageset="GlossySerpent" image="TabContentPaneMiddle" />
            </FrameComponent>
        </ImagerySection>
        <StateImagery name="Enabled">
            <Layer>
                <Section section="frame">
                    <ColourRectProperty name="BackgroundColours" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="Disabled">
            <Layer>
                <Section section="frame">
                    <Colours topLeft="FF7F7F7F" topRight="FF7F7F7F" bottomLeft="FF7F7F7F" bottomRight="FF7F7F7F" />
                </Section>
            </Layer>
        </StateImagery>
    </WidgetLook>
   
   
    <!--
    ***************************************************
        GlossySerpent/Menubar
        (based on the Taharez Look)
    ***************************************************
    -->
    <WidgetLook name="GlossySerpent/PopupMenu">
        <PropertyDefinition name="BackgroundColours" initialValue="tl:FFFFFFFF tr:FFFFFFFF bl:FFFFFFFF br:FFFFFFFF" redrawOnWrite="true" />
        <PropertyDefinition name="BorderWidth" initialValue="0" layoutOnWrite="true" />
        <NamedArea name="ItemRenderArea">
            <Area>
                <Dim type="LeftEdge" >
                    <ImageDim imageset="GlossySerpent" image="PanelBackground_L" dimension="Width">
                        <DimOperator op="Add">
                            <PropertyDim name="BorderWidth" />
                        </DimOperator>
                    </ImageDim>
                </Dim>
                <Dim type="TopEdge" >
                    <ImageDim imageset="GlossySerpent" image="PanelBackground_T" dimension="Height">
                        <DimOperator op="Add">
                            <PropertyDim name="BorderWidth" />
                        </DimOperator>
                    </ImageDim>
                </Dim>
                <Dim type="RightEdge" >
                    <UnifiedDim scale="1" type="RightEdge">
                        <DimOperator op="Subtract">
                            <ImageDim imageset="GlossySerpent" image="PanelBackground_R" dimension="Width">
                                <DimOperator op="Add">
                                    <PropertyDim name="BorderWidth" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </UnifiedDim>
                </Dim>
                <Dim type="BottomEdge" >
                    <UnifiedDim scale="1" type="BottomEdge">
                        <DimOperator op="Subtract">
                            <ImageDim imageset="GlossySerpent" image="PanelBackground_B" dimension="Height">
                                <DimOperator op="Add">
                                    <PropertyDim name="BorderWidth" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </UnifiedDim>
                </Dim>
            </Area>
        </NamedArea>
        <ImagerySection name="frame">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" ><UnifiedDim scale="1" type="Width" /></Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image type="TopLeftCorner" imageset="GlossySerpent" image="PanelBackground_TL" />
                <Image type="TopRightCorner" imageset="GlossySerpent" image="PanelBackground_TR" />
                <Image type="BottomLeftCorner" imageset="GlossySerpent" image="PanelBackground_BL" />
                <Image type="BottomRightCorner" imageset="GlossySerpent" image="PanelBackground_BR" />
                <Image type="LeftEdge" imageset="GlossySerpent" image="PanelBackground_L" />
                <Image type="RightEdge" imageset="GlossySerpent" image="PanelBackground_R" />
                <Image type="TopEdge" imageset="GlossySerpent" image="PanelBackground_T" />
                <Image type="BottomEdge" imageset="GlossySerpent" image="PanelBackground_B" />
                <Image type="Background" imageset="GlossySerpent" image="PanelBackground_M" />
            </FrameComponent>
        </ImagerySection>
        <ImagerySection name="border">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" ><UnifiedDim scale="1" type="Width" /></Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image type="TopLeftCorner" imageset="GlossySerpent" image="ComboboxButtonBorder_TL" />
                <Image type="TopRightCorner" imageset="GlossySerpent" image="ComboboxButtonBorder_TR" />
                <Image type="BottomLeftCorner" imageset="GlossySerpent" image="ComboboxButtonBorder_BL" />
                <Image type="BottomRightCorner" imageset="GlossySerpent" image="ComboboxButtonBorder_BR" />
                <Image type="LeftEdge" imageset="GlossySerpent" image="ComboboxButtonBorder_L" />
                <Image type="RightEdge" imageset="GlossySerpent" image="ComboboxButtonBorder_R" />
                <Image type="TopEdge" imageset="GlossySerpent" image="ComboboxButtonBorder_T" />
                <Image type="BottomEdge" imageset="GlossySerpent" image="ComboboxButtonBorder_B" />
                <Image type="Background" imageset="GlossySerpent" image="ComboboxButtonBorder_M" />
            </FrameComponent>
        </ImagerySection>
        <StateImagery name="Enabled">
            <Layer>
                <Section section="frame">
                    <ColourRectProperty name="BackgroundColours" />
                </Section>
                <Section section="border">
                    <ColourRectProperty name="BackgroundColours" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="Disabled">
            <Layer>
                <Section section="frame">
                    <Colours topLeft="FF7F7F7F" topRight="FF7F7F7F" bottomLeft="FF7F7F7F" bottomRight="FF7F7F7F" />
                </Section>
                <Section section="border">
                    <Colours topLeft="FF7F7F7F" topRight="FF7F7F7F" bottomLeft="FF7F7F7F" bottomRight="FF7F7F7F" />
                </Section>
            </Layer>
        </StateImagery>
    </WidgetLook>

   
    <!--
    ***************************************************
        GlossySerpent/MenuItem
        (based on the Taharez Look)
    ***************************************************
    -->
    <WidgetLook name="GlossySerpent/MenuItem">
        <PropertyDefinition name="NormalTextColour" initialValue="FFFFFFFF" redrawOnWrite="true" />
        <PropertyDefinition name="DisabledTextColour" initialValue="FF7F7F7F" redrawOnWrite="true" />
        <PropertyDefinition name="HoverColour" initialValue="FFFFFFFF" redrawOnWrite="true" />
        <PropertyDefinition name="PushedColour" initialValue="FFFFFFFF" redrawOnWrite="true" />
        <PropertyDefinition name="OpenedColour" initialValue="FFFFFFFF" redrawOnWrite="true" />
        <Property name="WantsMultiClickEvents" value="False" />
        <NamedArea name="ContentSize">
            <Area>
                <Dim type="LeftEdge"><AbsoluteDim value="0" /></Dim>
                <Dim type="TopEdge"><AbsoluteDim value="0" /></Dim>
                <Dim type="Width">
                    <FontDim type="HorzExtent">
                        <DimOperator op="Add">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneLeft" dimension="Width">
                                <DimOperator op="Add">
                                    <ImageDim imageset="GlossySerpent" image="TabContentPaneRight" dimension="Width" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </FontDim>
                </Dim>
                <Dim type="Height">
                    <FontDim type="LineSpacing">
                        <DimOperator op="Add">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneUpper" dimension="Height">
                                <DimOperator op="Add">
                                    <ImageDim imageset="GlossySerpent" image="TabContentPaneLower" dimension="Height" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </FontDim>
                </Dim>
            </Area>
        </NamedArea>
        <NamedArea name="HasPopupContentSize">
            <Area>
                <Dim type="LeftEdge"><AbsoluteDim value="0" /></Dim>
                <Dim type="TopEdge"><AbsoluteDim value="0" /></Dim>
                <Dim type="Width">
                    <FontDim type="HorzExtent">
                        <DimOperator op="Add">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneLeft" dimension="Width">
                                <DimOperator op="Add">
                                    <ImageDim imageset="GlossySerpent" image="TabContentPaneRight" dimension="Width">
                                        <DimOperator op="Add">
                                            <ImageDim imageset="GlossySerpent" image="GlyphArrowLeft" dimension="Width"/>
                                        </DimOperator>
                                    </ImageDim>
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </FontDim>
                </Dim>
                <Dim type="Height">
                    <FontDim type="LineSpacing">
                        <DimOperator op="Add">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneUpper" dimension="Height">
                                <DimOperator op="Add">
                                    <ImageDim imageset="GlossySerpent" image="TabContentPaneLower" dimension="Height" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </FontDim>
                </Dim>
            </Area>
        </NamedArea>
        <ImagerySection name="label">
            <TextComponent>
                <Area>
                    <Dim type="LeftEdge" ><ImageDim imageset="GlossySerpent" image="TabContentPaneLeft" dimension="Width" /></Dim>
                    <Dim type="TopEdge" ><ImageDim imageset="GlossySerpent" image="TabContentPaneUpper" dimension="Height" /></Dim>
                    <Dim type="RightEdge" >
                        <UnifiedDim scale="1" type="RightEdge">
                            <DimOperator op="Subtract">
                                <ImageDim imageset="GlossySerpent" image="TabContentPaneRight" dimension="Width" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                    <Dim type="BottomEdge" >
                        <UnifiedDim scale="1" type="BottomEdge">
                            <DimOperator op="Subtract">
                                <ImageDim imageset="GlossySerpent" image="TabContentPaneLower" dimension="Height" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                </Area>
                <VertFormat type="CentreAligned" />
                <HorzFormat type="LeftAligned" />
            </TextComponent>
        </ImagerySection>
        <ImagerySection name="frame">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" ><UnifiedDim scale="1" type="Width" /></Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image type="TopLeftCorner" imageset="GlossySerpent" image="TabContentPaneUpperLeft" />
                <Image type="TopRightCorner" imageset="GlossySerpent" image="TabContentPaneUpperRight" />
                <Image type="BottomLeftCorner" imageset="GlossySerpent" image="TabContentPaneLowerLeft" />
                <Image type="BottomRightCorner" imageset="GlossySerpent" image="TabContentPaneLowerRight" />
                <Image type="LeftEdge" imageset="GlossySerpent" image="TabContentPaneLeft" />
                <Image type="RightEdge" imageset="GlossySerpent" image="TabContentPaneRight" />
                <Image type="TopEdge" imageset="GlossySerpent" image="TabContentPaneUpper" />
                <Image type="BottomEdge" imageset="GlossySerpent" image="TabContentPaneLower" />
                <Image type="Background" imageset="GlossySerpent" image="TabContentPaneMiddle" />
            </FrameComponent>
        </ImagerySection>
        <ImagerySection name="popup_arrow_right">
            <ImageryComponent>
                <Area>
                    <Dim type="LeftEdge" >
                        <UnifiedDim scale="1" type="Width">
                            <DimOperator op="Subtract">
                                <ImageDim imageset="GlossySerpent" image="GlyphArrowRight" dimension="Width" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" >
                        <ImageDim imageset="GlossySerpent" image="GlyphArrowRight" dimension="Width" />
                    </Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image imageset="GlossySerpent" image="GlyphArrowRight" />
                <VertFormat type="CentreAligned" />
                <HorzFormat type="RightAligned" />
            </ImageryComponent>
        </ImagerySection>
        <ImagerySection name="popup_arrow_left">
            <ImageryComponent>
                <Area>
                    <Dim type="LeftEdge" >
                        <UnifiedDim scale="1" type="Width">
                            <DimOperator op="Subtract">
                                <ImageDim imageset="GlossySerpent" image="GlyphArrowLeft" dimension="Width" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" >
                        <ImageDim imageset="GlossySerpent" image="GlyphArrowLeft" dimension="Width" />
                    </Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image imageset="GlossySerpent" image="GlyphArrowLeft" />
                <VertFormat type="CentreAligned" />
                <HorzFormat type="RightAligned" />
            </ImageryComponent>
        </ImagerySection>
        <StateImagery name="EnabledNormal">
            <Layer>
                <Section section="label">
                    <ColourProperty name="NormalTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="EnabledHover">
            <Layer>
                <Section section="frame">
                    <ColourProperty name="HoverColour" />
                </Section>
                <Section section="label">
                    <ColourProperty name="NormalTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="EnabledPushed">
            <Layer>
                <Section section="frame">
                    <ColourProperty name="PushedColour" />
                </Section>
                <Section section="label">
                    <ColourProperty name="NormalTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="EnabledPopupOpen">
            <Layer>
                <Section section="frame">
                    <ColourProperty name="OpenedColour" />
                </Section>
                <Section section="label">
                    <ColourProperty name="NormalTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="DisabledNormal">
            <Layer>
                <Section section="label">
                    <ColourProperty name="DisabledTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="DisabledHover">
            <Layer>
                <Section section="frame">
                    <Colours topLeft="FF7F7F7F" topRight="FF7F7F7F" bottomLeft="FF7F7F7F" bottomRight="FF7F7F7F" />
                </Section>
                <Section section="label">
                    <ColourProperty name="DisabledTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="DisabledPushed">
            <Layer>
                <Section section="frame">
                    <Colours topLeft="FF7F7F7F" topRight="FF7F7F7F" bottomLeft="FF7F7F7F" bottomRight="FF7F7F7F" />
                </Section>
                <Section section="label">
                    <ColourProperty name="DisabledTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="DisabledPopupOpen">
            <Layer>
                <Section section="frame">
                    <Colours topLeft="FF7F7F7F" topRight="FF7F7F7F" bottomLeft="FF7F7F7F" bottomRight="FF7F7F7F" />
                </Section>
                <Section section="label">
                    <ColourProperty name="DisabledTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="PopupClosedIcon">
            <Layer>
                <Section section="popup_arrow_right" />
            </Layer>
        </StateImagery>
        <StateImagery name="PopupOpenIcon">
            <Layer>
                <Section section="popup_arrow_left" />
            </Layer>
        </StateImagery>
    </WidgetLook>


scheme:

Code: Select all

  <FalagardMapping WindowType="GlossySerpent/Menubar"   TargetType="CEGUI/Menubar"   Renderer="Falagard/Menubar"   LookNFeel="GlossySerpent/Menubar" />
  <FalagardMapping WindowType="GlossySerpent/PopupMenu" TargetType="CEGUI/PopupMenu" Renderer="Falagard/PopupMenu" LookNFeel="GlossySerpent/PopupMenu" />
  <FalagardMapping WindowType="GlossySerpent/MenuItem"  TargetType="CEGUI/MenuItem"  Renderer="Falagard/MenuItem"  LookNFeel="GlossySerpent/MenuItem" />


[dezGusty]

Wow, thanks!
Definitely useful

[Visse]

Fixed theme colours & added a menubar without frame & background.

looknfeel:

Code: Select all

    <!--
    ***************************************************
        GlossySerpent/Menubar
        (based on the Taharez Look)
    ***************************************************
    -->
    <WidgetLook name="GlossySerpent/Menubar">
        <PropertyDefinition name="BorderWidth" initialValue="5" layoutOnWrite="true" />
       
        <PropertyDefinition name="GS_DarkerThemeColour" initialValue="FF940000" redrawOnWrite="true" />
        <PropertyDefinition name="GS_LighterThemeColour" initialValue="FFFF0101" redrawOnWrite="true" />
        <PropertyDefinition name="GS_MainThemeColour" initialValue="FFDC5F5F" redrawOnWrite="true" />
        <PropertyDefinition name="GS_ShineColour" initialValue="B0FFFFFF" redrawOnWrite="true" />
       
        <NamedArea name="ItemRenderArea">
            <Area>
                <Dim type="LeftEdge" >
                    <ImageDim imageset="GlossySerpent" image="TabContentPaneLeft" dimension="Width">
                        <DimOperator op="Add">
                            <PropertyDim name="BorderWidth" />
                        </DimOperator>
                    </ImageDim>
                </Dim>
                <Dim type="TopEdge" >
                    <ImageDim imageset="GlossySerpent" image="TabContentPaneUpper" dimension="Height">
                        <DimOperator op="Add">
                            <PropertyDim name="BorderWidth" />
                        </DimOperator>
                    </ImageDim>
                </Dim>
                <Dim type="RightEdge" >
                    <UnifiedDim scale="1" type="RightEdge">
                        <DimOperator op="Subtract">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneRight" dimension="Width">
                                <DimOperator op="Add">
                                    <PropertyDim name="BorderWidth" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </UnifiedDim>
                </Dim>
                <Dim type="BottomEdge" >
                    <UnifiedDim scale="1" type="BottomEdge">
                        <DimOperator op="Subtract">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneLower" dimension="Height">
                                <DimOperator op="Add">
                                    <PropertyDim name="BorderWidth" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </UnifiedDim>
                </Dim>
            </Area>
        </NamedArea>
        <ImagerySection name="frame">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" ><UnifiedDim scale="1" type="Width" /></Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image type="TopLeftCorner" imageset="GlossySerpent" image="StaticTopLeft" />
                <Image type="TopRightCorner" imageset="GlossySerpent" image="StaticTopRight" />
                <Image type="BottomLeftCorner" imageset="GlossySerpent" image="StaticBottomLeft" />
                <Image type="BottomRightCorner" imageset="GlossySerpent" image="StaticBottomRight" />
                <Image type="LeftEdge" imageset="GlossySerpent" image="StaticLeft" />
                <Image type="RightEdge" imageset="GlossySerpent" image="StaticRight" />
                <Image type="TopEdge" imageset="GlossySerpent" image="StaticTop" />
                <Image type="BottomEdge" imageset="GlossySerpent" image="StaticBottom" />
            </FrameComponent>
        </ImagerySection>
        <ImagerySection name="background">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" ><UnifiedDim scale="1" type="Width" /></Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image type="Background" imageset="GlossySerpent" image="StaticBackdrop" />
            </FrameComponent>
        </ImagerySection>
        <StateImagery name="Enabled">
            <Layer>
                <Section section="background">
                </Section>
                <Section section="frame"/>
            </Layer>
        </StateImagery>
        <StateImagery name="Disabled">
            <Layer>
                <Section section="background">
                    <ColourRectProperty name="GS_MainThemeColour" />
                </Section>
                <Section section="frame"/>
            </Layer>
        </StateImagery>
    </WidgetLook>
   
    <!--
    ***************************************************
        GlossySerpent/Menubar
        (based on the Taharez Look)
    ***************************************************
    -->
    <WidgetLook name="GlossySerpent/MenubarTransparent">
        <PropertyDefinition name="BorderWidth" initialValue="5" layoutOnWrite="true" />
       
        <NamedArea name="ItemRenderArea">
            <Area>
                <Dim type="LeftEdge" >
                    <ImageDim imageset="GlossySerpent" image="TabContentPaneLeft" dimension="Width">
                        <DimOperator op="Add">
                            <PropertyDim name="BorderWidth" />
                        </DimOperator>
                    </ImageDim>
                </Dim>
                <Dim type="TopEdge" >
                    <ImageDim imageset="GlossySerpent" image="TabContentPaneUpper" dimension="Height">
                        <DimOperator op="Add">
                            <PropertyDim name="BorderWidth" />
                        </DimOperator>
                    </ImageDim>
                </Dim>
                <Dim type="RightEdge" >
                    <UnifiedDim scale="1" type="RightEdge">
                        <DimOperator op="Subtract">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneRight" dimension="Width">
                                <DimOperator op="Add">
                                    <PropertyDim name="BorderWidth" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </UnifiedDim>
                </Dim>
                <Dim type="BottomEdge" >
                    <UnifiedDim scale="1" type="BottomEdge">
                        <DimOperator op="Subtract">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneLower" dimension="Height">
                                <DimOperator op="Add">
                                    <PropertyDim name="BorderWidth" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </UnifiedDim>
                </Dim>
            </Area>
        </NamedArea>
        <StateImagery name="Enabled" />
        <StateImagery name="Disabled" />
    </WidgetLook>
   
   
    <!--
    ***************************************************
        GlossySerpent/Menubar
        (based on the Taharez Look)
    ***************************************************
    -->
    <WidgetLook name="GlossySerpent/PopupMenu">
        <PropertyDefinition name="BorderWidth" initialValue="0" layoutOnWrite="true" />
       
        <PropertyDefinition name="GS_DarkerThemeColour" initialValue="FF940000" redrawOnWrite="true" />
        <PropertyDefinition name="GS_LighterThemeColour" initialValue="FFFF0101" redrawOnWrite="true" />
        <PropertyDefinition name="GS_MainThemeColour" initialValue="FFDC5F5F" redrawOnWrite="true" />
        <PropertyDefinition name="GS_ShineColour" initialValue="B0FFFFFF" redrawOnWrite="true" />
       
        <NamedArea name="ItemRenderArea">
            <Area>
                <Dim type="LeftEdge" >
                    <ImageDim imageset="GlossySerpent" image="PanelBackground_L" dimension="Width">
                        <DimOperator op="Add">
                            <PropertyDim name="BorderWidth" />
                        </DimOperator>
                    </ImageDim>
                </Dim>
                <Dim type="TopEdge" >
                    <ImageDim imageset="GlossySerpent" image="PanelBackground_T" dimension="Height">
                        <DimOperator op="Add">
                            <PropertyDim name="BorderWidth" />
                        </DimOperator>
                    </ImageDim>
                </Dim>
                <Dim type="RightEdge" >
                    <UnifiedDim scale="1" type="RightEdge">
                        <DimOperator op="Subtract">
                            <ImageDim imageset="GlossySerpent" image="PanelBackground_R" dimension="Width">
                                <DimOperator op="Add">
                                    <PropertyDim name="BorderWidth" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </UnifiedDim>
                </Dim>
                <Dim type="BottomEdge" >
                    <UnifiedDim scale="1" type="BottomEdge">
                        <DimOperator op="Subtract">
                            <ImageDim imageset="GlossySerpent" image="PanelBackground_B" dimension="Height">
                                <DimOperator op="Add">
                                    <PropertyDim name="BorderWidth" />
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </UnifiedDim>
                </Dim>
            </Area>
        </NamedArea>
        <ImagerySection name="frame">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" ><UnifiedDim scale="1" type="Width" /></Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image type="TopLeftCorner" imageset="GlossySerpent" image="StaticTopLeft" />
                <Image type="TopRightCorner" imageset="GlossySerpent" image="StaticTopRight" />
                <Image type="BottomLeftCorner" imageset="GlossySerpent" image="StaticBottomLeft" />
                <Image type="BottomRightCorner" imageset="GlossySerpent" image="StaticBottomRight" />
                <Image type="LeftEdge" imageset="GlossySerpent" image="StaticLeft" />
                <Image type="RightEdge" imageset="GlossySerpent" image="StaticRight" />
                <Image type="TopEdge" imageset="GlossySerpent" image="StaticTop" />
                <Image type="BottomEdge" imageset="GlossySerpent" image="StaticBottom" />
            </FrameComponent>
        </ImagerySection>
        <ImagerySection name="background">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" ><UnifiedDim scale="1" type="Width" /></Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image type="Background" imageset="GlossySerpent" image="StaticBackdrop" />
            </FrameComponent>
        </ImagerySection>
        <StateImagery name="Enabled">
            <Layer>
                <Section section="background">
                    <ColourRectProperty name="GS_MainThemeColour" />
                </Section>
                <Section section="frame"/>
            </Layer>
        </StateImagery>
        <StateImagery name="Disabled">
            <Layer>
                <Section section="background">
                    <ColourRectProperty name="GS_MainThemeColour" />
                </Section>
                <Section section="frame"/>
            </Layer>
        </StateImagery>
    </WidgetLook>

   
    <!--
    ***************************************************
        GlossySerpent/MenuItem
        (based on the Taharez Look)
    ***************************************************
    -->
    <WidgetLook name="GlossySerpent/MenuItem">
        <PropertyDefinition name="NormalTextColour" initialValue="FFFFFFFF" redrawOnWrite="true" />
        <PropertyDefinition name="HoverTextColour" initialValue="FFFFFFFF" redrawOnWrite="true" />
        <PropertyDefinition name="PushedTextColour" initialValue="FFFFFFFF" redrawOnWrite="true" />
        <PropertyDefinition name="DisabledTextColour" initialValue="FF7F7F7F" redrawOnWrite="true" />
       
        <PropertyDefinition name="BorderWidth" initialValue="7" layoutOnWrite="true" />
       
        <PropertyDefinition name="GS_DarkerThemeColour" initialValue="FF940000" redrawOnWrite="true" />
        <PropertyDefinition name="GS_LighterThemeColour" initialValue="FFFF0101" redrawOnWrite="true" />
        <PropertyDefinition name="GS_MainThemeColour" initialValue="FFDC5F5F" redrawOnWrite="true" />
        <PropertyDefinition name="GS_ShineColour" initialValue="B0FFFFFF" redrawOnWrite="true" />
       
        <Property name="WantsMultiClickEvents" value="False" />
        <NamedArea name="ContentSize">
            <Area>
                <Dim type="LeftEdge"><AbsoluteDim value="0" /></Dim>
                <Dim type="TopEdge"><AbsoluteDim value="0" /></Dim>
                <Dim type="Width">
                    <FontDim type="HorzExtent">
                        <DimOperator op="Add">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneLeft" dimension="Width">
                                <DimOperator op="Add">
                                    <ImageDim imageset="GlossySerpent" image="TabContentPaneRight" dimension="Width">
                                        <DimOperator op="Add">
                                            <PropertyDim name="BorderWidth">
                                                <DimOperator op="Multiply">
                                                    <AbsoluteDim value="2" />
                                                </DimOperator>
                                            </PropertyDim>
                                        </DimOperator>
                                    </ImageDim>
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </FontDim>
                </Dim>
                <Dim type="Height">
                    <FontDim type="LineSpacing">
                        <DimOperator op="Add">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneUpper" dimension="Height">
                                <DimOperator op="Add">
                                    <ImageDim imageset="GlossySerpent" image="TabContentPaneLower" dimension="Height">
                                        <DimOperator op="Add">
                                            <PropertyDim name="BorderWidth" />
                                        </DimOperator>
                                    </ImageDim>
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </FontDim>
                </Dim>
            </Area>
        </NamedArea>
        <NamedArea name="HasPopupContentSize">
            <Area>
                <Dim type="LeftEdge"><AbsoluteDim value="0" /></Dim>
                <Dim type="TopEdge"><AbsoluteDim value="0" /></Dim>
                <Dim type="Width">
                    <FontDim type="HorzExtent">
                        <DimOperator op="Add">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneLeft" dimension="Width">
                                <DimOperator op="Add">
                                    <ImageDim imageset="GlossySerpent" image="TabContentPaneRight" dimension="Width">
                                        <DimOperator op="Add">
                                            <ImageDim imageset="GlossySerpent" image="GlyphArrowLeft" dimension="Width">
                                                <DimOperator op="Add">
                                                    <PropertyDim name="BorderWidth">
                                                        <DimOperator op="Multiply">
                                                            <AbsoluteDim value="2" />
                                                        </DimOperator>
                                                    </PropertyDim>
                                                </DimOperator>
                                            </ImageDim>
                                        </DimOperator>
                                    </ImageDim>
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </FontDim>
                </Dim>
                <Dim type="Height">
                    <FontDim type="LineSpacing">
                        <DimOperator op="Add">
                            <ImageDim imageset="GlossySerpent" image="TabContentPaneUpper" dimension="Height">
                                <DimOperator op="Add">
                                    <ImageDim imageset="GlossySerpent" image="TabContentPaneLower" dimension="Height">
                                        <DimOperator op="Add">
                                            <PropertyDim name="BorderWidth"/>
                                        </DimOperator>
                                    </ImageDim>
                                </DimOperator>
                            </ImageDim>
                        </DimOperator>
                    </FontDim>
                </Dim>
            </Area>
        </NamedArea>
        <ImagerySection name="label">
            <TextComponent>
                <Area>
                    <Dim type="LeftEdge" ><ImageDim imageset="GlossySerpent" image="TabContentPaneLeft" dimension="Width" /></Dim>
                    <Dim type="TopEdge" ><ImageDim imageset="GlossySerpent" image="TabContentPaneUpper" dimension="Height" /></Dim>
                    <Dim type="RightEdge" >
                        <UnifiedDim scale="1" type="RightEdge">
                            <DimOperator op="Subtract">
                                <ImageDim imageset="GlossySerpent" image="TabContentPaneRight" dimension="Width" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                    <Dim type="BottomEdge" >
                        <UnifiedDim scale="1" type="BottomEdge">
                            <DimOperator op="Subtract">
                                <ImageDim imageset="GlossySerpent" image="TabContentPaneLower" dimension="Height" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                </Area>
                <VertFormat type="CentreAligned" />
                <HorzFormat type="CentreAligned" />
            </TextComponent>
        </ImagerySection>
        <ImagerySection name="frame">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" ><UnifiedDim scale="1" type="Width" /></Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image type="TopLeftCorner" imageset="GlossySerpent" image="Button32_2C_TL" />
                <Image type="TopRightCorner" imageset="GlossySerpent" image="Button32_2C_TR" />
                <Image type="BottomLeftCorner" imageset="GlossySerpent" image="Button32_2C_BL" />
                <Image type="BottomRightCorner" imageset="GlossySerpent" image="Button32_2C_BR" />
                <Image type="LeftEdge" imageset="GlossySerpent" image="Button32_2C_L" />
                <Image type="TopEdge" imageset="GlossySerpent" image="Button32_2C_T" />
                <Image type="RightEdge" imageset="GlossySerpent" image="Button32_2C_R" />
                <Image type="BottomEdge" imageset="GlossySerpent" image="Button32_2C_B" />
                <Image type="Background" imageset="GlossySerpent" image="Button32_2C_M" />
            </FrameComponent>
        </ImagerySection>
        <ImagerySection name="background_section">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge">
                        <AbsoluteDim value="2" />
                    </Dim>
                    <Dim type="TopEdge" >
                        <AbsoluteDim value="2" />
                    </Dim>
                    <Dim type="Width" >
                        <UnifiedDim scale="1" type="Width">
                            <DimOperator op="Subtract">
                                <AbsoluteDim value="4" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                    <Dim type="Height" >
                        <UnifiedDim scale="1" type="Height">
                            <DimOperator op="Subtract">
                                <AbsoluteDim value="4" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                </Area>
                <Image type="Background" imageset="GlossySerpent" image="Button32_4D_Background" />
            </FrameComponent>
        </ImagerySection>
        <ImagerySection name="background_highlight">
            <FrameComponent>
                <Area>
                    <Dim type="LeftEdge">
                        <AbsoluteDim value="2" />
                    </Dim>
                    <Dim type="TopEdge" >
                        <AbsoluteDim value="2" />
                    </Dim>
                    <Dim type="Width" >
                        <UnifiedDim scale="1" type="Width">
                            <DimOperator op="Subtract">
                                <AbsoluteDim value="4" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                    <Dim type="Height" >
                        <UnifiedDim scale="1" type="Height">
                            <DimOperator op="Subtract">
                                <AbsoluteDim value="4" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                </Area>
                <Image type="Background" imageset="GlossySerpent" image="Button32_4D_BackgHighlight" />
            </FrameComponent>
        </ImagerySection>
       
        <ImagerySection name="popup_arrow_right">
            <ImageryComponent>
                <Area>
                    <Dim type="LeftEdge" >
                        <UnifiedDim scale="1" type="Width">
                            <DimOperator op="Subtract">
                                <ImageDim imageset="GlossySerpent" image="GlyphArrowRight" dimension="Width" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" >
                        <ImageDim imageset="GlossySerpent" image="GlyphArrowRight" dimension="Width" />
                    </Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image imageset="GlossySerpent" image="GlyphArrowRight" />
                <VertFormat type="CentreAligned" />
                <HorzFormat type="RightAligned" />
            </ImageryComponent>
        </ImagerySection>
        <ImagerySection name="popup_arrow_left">
            <ImageryComponent>
                <Area>
                    <Dim type="LeftEdge" >
                        <UnifiedDim scale="1" type="Width">
                            <DimOperator op="Subtract">
                                <ImageDim imageset="GlossySerpent" image="GlyphArrowLeft" dimension="Width" />
                            </DimOperator>
                        </UnifiedDim>
                    </Dim>
                    <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
                    <Dim type="Width" >
                        <ImageDim imageset="GlossySerpent" image="GlyphArrowLeft" dimension="Width" />
                    </Dim>
                    <Dim type="Height" ><UnifiedDim scale="1" type="Height" /></Dim>
                </Area>
                <Image imageset="GlossySerpent" image="GlyphArrowLeft" />
                <VertFormat type="CentreAligned" />
                <HorzFormat type="RightAligned" />
            </ImageryComponent>
        </ImagerySection>
        <StateImagery name="EnabledNormal">
            <Layer>
                <Section section="background_section">
                    <ColourProperty name="GS_MainThemeColour" />
                </Section>
                <Section section="background_highlight">
                    <ColourProperty name="GS_ShineColour" />
                </Section>
                <Section section="frame"/>
                <Section section="label">
                    <ColourProperty name="NormalTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="EnabledHover">
            <Layer>
                <Section section="background_section">
                    <ColourProperty name="GS_LighterThemeColour" />
                </Section>
                <Section section="background_highlight">
                    <ColourProperty name="GS_ShineColour" />
                </Section>
                <Section section="frame"/>
                <Section section="label">
                    <ColourProperty name="HoverTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="EnabledPushed">
            <Layer>
                <Section section="background_section">
                    <ColourProperty name="GS_DarkerThemeColour" />
                </Section>
                <Section section="background_highlight">
                    <ColourProperty name="GS_ShineColour" />
                </Section>
                <Section section="frame"/>
                <Section section="label">
                    <ColourProperty name="PushedTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="EnabledPopupOpen">
            <Layer>
                <Section section="background_section">
                    <ColourProperty name="GS_DarkerThemeColour" />
                </Section>
                <Section section="background_highlight">
                    <ColourProperty name="GS_ShineColour" />
                </Section>
                <Section section="frame"/>
                <Section section="label">
                    <ColourProperty name="PushedTextColour" />
                </Section>
            </Layer>
        </StateImagery>
       
        <!-- the following states is not implementend correcly :( -->
        <StateImagery name="DisabledNormal">
            <Layer>
                <Section section="label">
                    <ColourProperty name="DisabledTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="DisabledHover">
            <Layer>
                <Section section="frame">
                    <Colours topLeft="FF7F7F7F" topRight="FF7F7F7F" bottomLeft="FF7F7F7F" bottomRight="FF7F7F7F" />
                </Section>
                <Section section="label">
                    <ColourProperty name="DisabledTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="DisabledPushed">
            <Layer>
                <Section section="frame">
                    <Colours topLeft="FF7F7F7F" topRight="FF7F7F7F" bottomLeft="FF7F7F7F" bottomRight="FF7F7F7F" />
                </Section>
                <Section section="label">
                    <ColourProperty name="DisabledTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="DisabledPopupOpen">
            <Layer>
                <Section section="frame">
                    <Colours topLeft="FF7F7F7F" topRight="FF7F7F7F" bottomLeft="FF7F7F7F" bottomRight="FF7F7F7F" />
                </Section>
                <Section section="label">
                    <ColourProperty name="DisabledTextColour" />
                </Section>
            </Layer>
        </StateImagery>
        <StateImagery name="PopupClosedIcon">
            <Layer>
                <Section section="popup_arrow_right" />
            </Layer>
        </StateImagery>
        <StateImagery name="PopupOpenIcon">
            <Layer>
                <Section section="popup_arrow_left" />
            </Layer>
        </StateImagery>
    </WidgetLook>


scheme:

Code: Select all

  <FalagardMapping WindowType="GlossySerpent/Menubar"   TargetType="CEGUI/Menubar"   Renderer="Falagard/Menubar"   LookNFeel="GlossySerpent/Menubar" />
  <FalagardMapping WindowType="GlossySerpent/MenubarTransparent"   TargetType="CEGUI/Menubar"   Renderer="Falagard/Menubar"   LookNFeel="GlossySerpent/MenubarTransparent" />
  <FalagardMapping WindowType="GlossySerpent/PopupMenu" TargetType="CEGUI/PopupMenu" Renderer="Falagard/PopupMenu" LookNFeel="GlossySerpent/PopupMenu" />
  <FalagardMapping WindowType="GlossySerpent/MenuItem"  TargetType="CEGUI/MenuItem"  Renderer="Falagard/MenuItem"  LookNFeel="GlossySerpent/MenuItem" />


I also found another typo, line 218 in 'GlossySerpent.imageset':

Code: Select all

   <Image Name="CheckboxBorder_B" XPos="349" YPos="323s" Width="24" Height="4" />


Notice the '323s'.