CELayoutEditor and New ImageSets for BACKGROUNDs

[Chewe]

Hi all.

It's been two hard weeks learning ogre3d and cegui.

Right now i'm trying to build a menu with CELayout. It's amazingly easy to grow from there. But right now i'm stucked trying to build a menu (based on Taharez base) with an ImageBackground.

I've learnt trhough skineditors how to modify imagesets. And thanks to StuntRacer SourceCode that it should be possible to add on taharezscheme a new ImageSet.

But as i said i'm stucked trying to mix all concepts.

How should i setup CELayout to add newimagesets to load them as backgrounds for menus? Is it possible?

Thanks for all.

Salut.

[scriptkid]

Hi Chewe,

welcome to CEGUI Thanks for checking it out!

With the (current) layout editor it is not possible to use / access imagesets directly. Although it will load each imageset which is mentioned in your .scheme files, they are only used by cegui itself to render the widgets correctly.

There are ideas to merge our toolset in the future, but that won't be tomorrow

My suggestion ATM would be to define StaticImages in the layout editor, set their position and size, and then manually open them with a texteditor and fill in the images propeties.

HTH and good luck with your project(s)!

[Chewe]

Thx for the advice!!!

I'm following your great tutorial trying to adapt the info to my code...

http://www.cegui.org.uk/wiki/index.php/ ... #Imagesets

But it seems that i'm just on the ABC learning curve...

Right now i'm using a layout created by CELayoutEditor for CEGUI 0.4 and ogre1.2.

I've created on GUI directory two files: Old-paper.png (with alpha) and Old-paper.imageset

Code: Select all

<?xml version="1.0" ?>
<Imageset Name="Old-paper" Imagefile="Old-paper.png" NativeHorzRes="1024" NativeVertRes="768" AutoScaled="true" ResourceGroup="General">
   <Image Name="Logo" XPos="0" YPos="0" Width="452" Height="616" />
</Imageset>

I've added also this line on my code to load the imageset.

Code: Select all

  CEGUI::ImagesetManager::getSingletonPtr()->createImageset( "Old-paper.imageset");

Then I edited the code output from CELayout to look like this

Code: Select all

<Window Type="TaharezLook/StaticImage" Name="bg" >
<Property Name="Size" Value="w:1 h:1" />
<Property Name="Image" Value="set:Old-paper image:Old-paper" />
<Property Name="UnifiedAreaRect" Value="{{0.313750,0.000000},{0.166667,0.000000},{0.628750,0.000000},{0.756666,0.000000}}" />
<Property Name="UnifiedMaxSize" Value="{{1.000000,0.000000},{1.000000,0.000000}}" />

the code output from CELayout was

Code: Select all

<Window Type="TaharezLook/StaticImage" Name="bg" >
<Property Name="BackgroundImage" Value="set:TaharezLook image:StaticBackdrop" />
<Property Name="BottomFrameImage" Value="set:TaharezLook image:StaticBottom" />
<Property Name="BottomLeftFrameImage" Value="set:TaharezLook image:StaticBottomLeft" />
<Property Name="BottomRightFrameImage" Value="set:TaharezLook image:StaticBottomRight" />
<Property Name="LeftFrameImage" Value="set:TaharezLook image:StaticLeft" />
<Property Name="RightFrameImage" Value="set:TaharezLook image:StaticRight" />
<Property Name="TopFrameImage" Value="set:TaharezLook image:StaticTop" />
<Property Name="TopLeftFrameImage" Value="set:TaharezLook image:StaticTopLeft" />
<Property Name="TopRightFrameImage" Value="set:TaharezLook image:StaticTopRight" />
<Property Name="UnifiedAreaRect" Value="{{0.313750,0.000000},{0.166667,0.000000},{0.628750,0.000000},{0.756666,0.000000}}" />
<Property Name="UnifiedMaxSize" Value="{{1.000000,0.000000},{1.000000,0.000000}}" />

After all this steps it still loads the layout, but it looks exactly the same as if I left .layout unedited.

Can you help me to find my spell errors?

[Chewe]

My bad.

After a few beers with friends i sit down to check it again and I've found that on the ImageName of the Old-paper.imageset it was LOGO, while it should be Old-paper.

Now everything works fine. Except a few things.

Now it displays a blackwindow with taharez border on it, and inside i get the old-paper.png with alpha.

My problem is now to get rid of the staticimage look window so it's only old-paper as window. Is it possible?

Thankyou so much for you Main-page tutorial and your advice.

[scriptkid]

Hi,

good to hear you found it. The power of alcoholics

To set one thing clear: i didn't write the tutorial. I'm not even sure who did, but it's a nice one indeed

About the black window and border, you can try adding these properties to your image definition (in the layout):

Code: Select all

<Property Name="FrameEnabled" Value="false" />
<Property Name="BackgroundEnabled" Value="false" />

HTH.

[Chewe]

GREAT!!!!!

At first i added False tags on Taharez scheme... so it's been a nice update to remember that properties can be modified through the same layout...

It's wonderfull to see how the alpha is displayed crisp and clear, better than using overlays.

Now i'm trying to finish the menu. I want to setup it as several sheets. For example Options button should lead to another sheet with game options.

From ogregui.layout i've discovered a "defaultGuiSheet" and TabControl.

Code: Select all

<?xml version="1.0" ?>
<GUILayout>
<Window Type="DefaultGUISheet" Name="root">
    <Window Type="DefaultGUISheet" Name="OgreGuiDemo">
      <Property Name="Size" Value="w:0.25 h:1" />

        <Window Type="TaharezLook/TabControl" Name="OgreGuiDemo/TabCtrl">
            <Property Name="Position" Value="x:0.0 y:0.0" />
            <Property Name="Size" Value="w:1 h:0.5" />

            <Window Type="DefaultGUISheet" Name="OgreGuiDemo/TabCtrl/Page1">
                <Property Name="Text" Value="File" />
                <Window Type="TaharezLook/Button" Name="OgreGuiDemo/TabCtrl/Page1/NewButton">
                    <Property Name="Position" Value="x:0.1 y:0.1" />
                    <Property Name="Size" Value="w:0.8 h:0.07" />
                    <Property Name="Text" Value="New" />
                </Window>
                <Window Type="TaharezLook/Button" Name="OgreGuiDemo/TabCtrl/Page1/LoadButton">
                    <Property Name="Position" Value="x:0.1 y:0.2" />
                    <Property Name="Size" Value="w:0.8 h:0.07" />
                    <Property Name="Text" Value="Load Test Layout" />
                </Window>
                <Window Type="TaharezLook/Button" Name="OgreGuiDemo/TabCtrl/Page1/QuitButton">
                    <Property Name="Position" Value="x:0.1 y:0.3" />
                    <Property Name="Size" Value="w:0.8 h:0.07" />
                    <Property Name="Text" Value="Quit" />
                </Window>
            </Window>
            <Window Type="DefaultGUISheet" Name="OgreGuiDemo/TabCtrl/Page2">
                <Property Name="Text" Value="Objects" />
                <Window Type="TaharezLook/Combobox" Name="OgreGuiDemo/TabCtrl/Page2/ObjectTypeList">
                    <Property Name="Position" Value="x:0.1 y:0.1" />
                    <Property Name="Size" Value="w:0.8 h:0.5" />
                    <Property Name="Text" Value="Select Type" />
                    <Property Name="ClippedByParent" Value="false" />
                    <Property Name="ReadOnly" Value="true" />
                </Window>
            </Window>
        </Window>
  </Window>
</Window>

</GUILayout>


Here is the layout i'm using right now.

Code: Select all

<?xml version="1.0" encoding="UTF-8"?>
<GUILayout>
<Window Type="DefaultWindow" Name="Root" >
<Property Name="UnifiedAreaRect" Value="{{0.000000,0.000000},{0.000000,0.000000},{1.000000,0.000000},{1.000000,0.000000}}" />
<Property Name="UnifiedMaxSize" Value="{{1.000000,0.000000},{1.000000,0.000000}}" />

<Window Type="TaharezLook/StaticImage" Name="bg" >
<Property Name="Size" Value="w:1 h:1" />
<Property Name="Image" Value="set:Old-paper image:Old-paper" />
<Property Name="FrameEnabled" Value="false" />
<Property Name="BackgroundEnabled" Value="false" />
<Property Name="UnifiedAreaRect" Value="{{0.313750,0.000000},{0.166667,0.000000},{0.628750,0.000000},{0.756666,0.000000}}" />
<Property Name="UnifiedMaxSize" Value="{{1.000000,0.000000},{1.000000,0.000000}}" />

<Window Type="TaharezLook/Button" Name="play" >
<Property Name="MouseCursorImage" Value="set:TaharezLook image:MouseArrow" />
<Property Name="Text" Value="Play" />
<Property Name="UnifiedAreaRect" Value="{{0.175397,0.000000},{0.142373,0.000000},{0.830158,0.000000},{0.234180,0.000000}}" />
<Property Name="UnifiedMaxSize" Value="{{1.000000,0.000000},{1.000000,0.000000}}" />
</Window>

<Window Type="TaharezLook/Button" Name="Options" >
<Property Name="Font" Value="Commonwealth-10" />
<Property Name="MouseCursorImage" Value="set:TaharezLook image:MouseArrow" />
<Property Name="Text" Value="Options" />
<Property Name="UnifiedAreaRect" Value="{{0.175397,0.000000},{0.303390,0.000000},{0.830159,0.000000},{0.395197,0.000000}}" />
<Property Name="UnifiedMaxSize" Value="{{1.000000,0.000000},{1.000000,0.000000}}" />
</Window>

</Window>
</Window>
</GUILayout>


Now i'm a bit confused. Is it possible to assign a newsheet on a taharez/Button rather than using falagard/tabctrl? Any advice?[/quote]

[Chewe]

Hi all.

I'm trying to preload multiple layouts for a MENU.

Let's say i've got two: Main.layout, Options.layout

From this posts, i've been able to grow a bit.

http://www.cegui.org.uk/phpBB2/viewtopi ... ght=layout

http://www.cegui.org.uk/phpBB2/viewtopi ... ight=sheet

So i wrote this code

Code: Select all


  // CEGUI Setup
     mGUIRenderer = new CEGUI::OgreCEGUIRenderer(mWindow,
         Ogre::RENDER_QUEUE_OVERLAY, false, 3000, mSceneMgr);
      mGUISystem = new CEGUI::System(mGUIRenderer);
      CEGUI::Logger::getSingleton().setLoggingLevel(CEGUI::Informative);

  // load scheme and set up defaults
      CEGUI::SchemeManager::getSingleton().loadScheme(
         (CEGUI::utf8*)"TaharezLookSkin.scheme");
     mGUISystem->setDefaultMouseCursor(
      (CEGUI::utf8*)"TaharezLook", (CEGUI::utf8*)"MouseArrow");
      mGUISystem->setDefaultFont((CEGUI::utf8*)"BlueHighway-12");

// Sheet root?
     CEGUI::Window* sheet = CEGUI::WindowManager::getSingleton().createWindow( (CEGUI::utf8*)"DefaultWindow", (CEGUI::utf8*)"root_wnd" );
     CEGUI::System::getSingleton().setGUISheet( sheet );

// Ready to load layouts

   using namespace CEGUI;
   WindowManager& wMgr = WindowManager::getSingleton();
   Window* main = wMgr.getWindow((utf8*)"root_wnd");
    main->addChildWindow( CEGUI::WindowManager::getSingleton().loadWindowLayout((CEGUI::utf8*)"main.layout") );
   main->setVisible(false);

// From here it crashes, let's say that would be options.layout
   
   WindowManager& wMgr = WindowManager::getSingleton();
   Window* main2 = wMgr.getWindow((utf8*)"root_wnd");
   main2->addChildWindow( CEGUI::WindowManager::getSingleton().loadWindowLayout((CEGUI::utf8*)"main2.layout") );
   main2->setVisible(true);



I'm quite stuck right now. How would be the correct syntax to preload multiple layouts?