Embed one custom gui in another gui

[celludriel 79]

Hey,

 

A few weeks back I made a custom gui control that I wanted to reuse in other projects here is the definition

class BalanceBar{
    name         = "BalanceBar";
    idd          = BALANCE_BAR_CONTAINER_ID;
    fadein       = 0;
    duration     = 99999999999;
    fadeout      = 0;
    movingEnable = 1;
    onLoad       = "uiNamespace setVariable ['BalanceBar',_this select 0];";
    onUnload     = "uiNamespace setVariable ['BalanceBar', objNull]";
    onDestroy    = "uiNamespace setVariable ['BalanceBar', objNull]";    
    class Controls{
        class LoseBackground: ProgressBaseTextHUD{
            idc = BALANCE_BAR_LOSE_BACKGROUND_ID;

            x = safezoneX + (safeZoneW * BALANCE_BAR_X);
            y = safeZoneY + (safeZoneH * BALANCE_BAR_Y);
            w = BALANCE_BAR_SIZE * 3 / 4;
            h = BALANCE_BAR_HEIGHT;
            colorBackground[] = {1,0,0,1};
        };
        class WinBackground: ProgressBaseTextHUD{
            idc = BALANCE_BAR_WIN_BACKGROUND_ID;

            x = (safezoneX + (safeZoneW * BALANCE_BAR_X)) + (BALANCE_BAR_SIZE * 3 / 4);
            y = safeZoneY + (safeZoneH * BALANCE_BAR_Y);
            w = BALANCE_BAR_SIZE * 3 / 4;
            h = BALANCE_BAR_HEIGHT;
            colorBackground[] = {0,0,0,1};
        };
        class LoseProgress: RscProgressBar{
            idc = BALANCE_BAR_LOSE_PROGRESS_ID;

            x = safezoneX + (safeZoneW * BALANCE_BAR_X);
            y = safeZoneY + (safeZoneH * BALANCE_BAR_Y);
            w = BALANCE_BAR_SIZE * 3 / 4;
            h = BALANCE_BAR_HEIGHT;
            colorBar[] = {0,0,0,1};
        };
        class WinProgress: RscProgressBar{
            idc = BALANCE_BAR_WIN_PROGRESS_ID;

            x = (safezoneX + (safeZoneW * BALANCE_BAR_X)) + (BALANCE_BAR_SIZE * 3 / 4);
            y = safeZoneY + (safeZoneH * BALANCE_BAR_Y);
            w = BALANCE_BAR_SIZE * 3 / 4;
            h = BALANCE_BAR_HEIGHT;
            colorBar[] = {0,0,1,1};
        };
    };
};

So I'm now at a point where I want to reuse this in another gui component I'm creating with following definition.  Mind you this one is still work in progress and probably won't work yet.

class TugDisplayContainer{
    name         = "TugDisplayContainer";
    idd          = TUG_DISPLAY_CONTAINER_ID;
    fadein       = 0;
    duration     = 99999999999;
    fadeout      = 0;
    movingEnable = 1;
    onLoad       = "uiNamespace setVariable ['TugDisplayContainer',_this select 0];";
    onUnload     = "uiNamespace setVariable ['TugDisplayContainer', objNull]";
    onDestroy    = "uiNamespace setVariable ['TugDisplayContainer', objNull]"; 
    class Controls{
        class TugDisplayControl: IGUIBack
        {
            idc = 2200;
            x = 0.195781 * safezoneW + safezoneX;
            y = 0.016 * safezoneH + safezoneY;
            w = 0.20625 * safezoneW;
            h = 0.066 * safezoneH;
            colorBackground[] = {0,0,0,0.3};
        };
        class TugBalanceBar: BalanceBar
        {
            //add stuff here to import my other gui element
        }
        class WarchestValueText: RscText
        {
            idc = 1000;
            text = "Warchest: 0"; //--- ToDo: Localize;
            x = 0.267969 * safezoneW + safezoneX;
            y = 0.049 * safezoneH + safezoneY;
            w = 0.061875 * safezoneW;
            h = 0.022 * safezoneH;
            colorText[] = {1,1,1,1};
        };        
    };
};

As you can see I'm stuck where I put the comment.  I want my BalanceBar to be part of TugDisplayContainer as my own custom control but considering BalanceBar has an idd and not an idc I'm worried it is not reusable at all.  Can any GUI guru tell me how this could work ... if it could work ?

[Heeeere's johnny! 51]

Well, I don't know what "BalanceBar" is or where it comes from. But the thing is, you can technically create two "dialogs" at the same time, one using "createDialog" and the other one using "cutRsc". I don't know about interactivity though, but I reckon "cutRsc" GUIs are not interactive.

 

But either way, if you don't find a solution for embedding your stuff, try aligning them so you can spawn them simultaniously, so they appear embedded.

[celludriel 79]

That is my fallback to make them appear embedded, thing is if I ever want to make my gui component moveable well then embedding will be hard.  BalanceBar is my other custom gui component.  But I'm getting the feeling I can't embed two dialogs inside eachother.

[Heeeere's johnny! 51]

Probably it would be reasonable to generalize things a bit. Instead of having two standalone GUIs, how about making them groups of GUI elements and put these groups into a "container" which then would be the dialog? That way, you'd also preserve yourself the possibility of future additions and expansions.

[celludriel 79]

Well I had to be flexible it is not exactly what I wanted but this is what I came up with

 

for my BalanceBar gui

class ProgressBaseTextHUD{
    access = 0;
    type = CT_STATIC;
    style = ST_CENTER;
    idc = -1;
    colorBackground[] = {0,0,0,0};
    colorText[] = {1,1,1,0.8};
    text = "";
    fixedWidth = 0;
    x = 0;
    y = 0;
    h = 0;
    w = 0;
    shadow = 2;
    font = GUI_FONT_NORMAL;
    sizeEx = "0.035";
};

class RscProgressBar{
    type    = CT_PROGRESS;
    style   = ST_HORIZONTAL;
    texture = "";
    shadow  = 2;
    colorFrame[] = {0.8,0.48,0,1};
    colorBar[] = {"(profilenamespace getvariable ['GUI_BCG_RGB_R',0.3843])", "(profilenamespace getvariable ['GUI_BCG_RGB_G',0.7019])", "(profilenamespace getvariable ['GUI_BCG_RGB_B',0.8862])", "(profilenamespace getvariable ['GUI_BCG_RGB_A',0.7])"};
};

class BalanceBarLoseBackground: ProgressBaseTextHUD{
    x = safezoneX + (safeZoneW * BALANCE_BAR_X);
    y = safeZoneY + (safeZoneH * BALANCE_BAR_Y);
    w = BALANCE_BAR_SIZE * 3 / 4;
    h = BALANCE_BAR_HEIGHT;
    colorBackground[] = {1,0,0,1};
};

class BalanceBarWinBackground: ProgressBaseTextHUD{
    x = (safezoneX + (safeZoneW * BALANCE_BAR_X)) + (BALANCE_BAR_SIZE * 3 / 4);
    y = safeZoneY + (safeZoneH * BALANCE_BAR_Y);
    w = BALANCE_BAR_SIZE * 3 / 4;
    h = BALANCE_BAR_HEIGHT;
    colorBackground[] = {0,0,0,1};
};

class BalanceBarLoseProgress: RscProgressBar{
    x = safezoneX + (safeZoneW * BALANCE_BAR_X);
    y = safeZoneY + (safeZoneH * BALANCE_BAR_Y);
    w = BALANCE_BAR_SIZE * 3 / 4;
    h = BALANCE_BAR_HEIGHT;
    colorBar[] = {0,0,0,1};
};

class BalanceBarWinProgress: RscProgressBar{
    x = (safezoneX + (safeZoneW * BALANCE_BAR_X)) + (BALANCE_BAR_SIZE * 3 / 4);
    y = safeZoneY + (safeZoneH * BALANCE_BAR_Y);
    w = BALANCE_BAR_SIZE * 3 / 4;
    h = BALANCE_BAR_HEIGHT;
    colorBar[] = {0,0,1,1};
};

class BalanceBar{
    name         = "BalanceBar";
    idd          = BALANCE_BAR_CONTAINER_ID;
    fadein       = 0;
    duration     = 99999999999;
    fadeout      = 0;
    movingEnable = 1;
    onLoad       = "uiNamespace setVariable ['BalanceBar', _this select 0];";
    onUnload     = "uiNamespace setVariable ['BalanceBar', objNull]";
    onDestroy    = "uiNamespace setVariable ['BalanceBar', objNull]";
    class Controls{
        class LoseBackground: BalanceBarLoseBackground{
            idc = BALANCE_BAR_LOSE_BACKGROUND_ID;
        };
        class WinBackground: BalanceBarWinBackground{
            idc = BALANCE_BAR_WIN_BACKGROUND_ID;
        };
        class LoseProgress: BalanceBarLoseProgress{
            idc = BALANCE_BAR_LOSE_PROGRESS_ID;
        };
        class WinProgress: BalanceBarWinProgress{
            idc = BALANCE_BAR_WIN_PROGRESS_ID;
        };
    };
};

and for my composite gui

///////////////////////////////////////////////////////////////////////////
/// Base Classes
///////////////////////////////////////////////////////////////////////////
class IGUIBack
{
    type = 0;
    idc = 124;
    style = 128;
    text = "";
    colorText[] =
    {
        0,
        0,
        0,
        0
    };
    font = "PuristaMedium";
    sizeEx = 0;
    shadow = 0;
    x = 0.1;
    y = 0.1;
    w = 0.1;
    h = 0.1;
    colorbackground[] =
    {
        "(profilenamespace getvariable ['IGUI_BCG_RGB_R',0])",
        "(profilenamespace getvariable ['IGUI_BCG_RGB_G',1])",
        "(profilenamespace getvariable ['IGUI_BCG_RGB_B',1])",
        "(profilenamespace getvariable ['IGUI_BCG_RGB_A',0.8])"
    };
};
class RscText
{
    deletable = 0;
    fade = 0;
    access = 0;
    type = 0;
    idc = -1;
    colorBackground[] =
    {
        0,
        0,
        0,
        0
    };
    colorText[] =
    {
        1,
        1,
        1,
        1
    };
    text = "";
    fixedWidth = 0;
    x = 0;
    y = 0;
    h = 0.037;
    w = 0.3;
    style = 0;
    shadow = 1;
    colorShadow[] =
    {
        0,
        0,
        0,
        0.5
    };
    font = "PuristaMedium";
    SizeEx = "(((((safezoneW / safezoneH) min 1.2) / 1.2) / 25) * 1)";
    linespacing = 1;
    tooltipColorText[] =
    {
        1,
        1,
        1,
        1
    };
    tooltipColorBox[] =
    {
        1,
        1,
        1,
        1
    };
    tooltipColorShade[] =
    {
        0,
        0,
        0,
        0.65
    };
};

////////////////////////////////////////////////////////
// GUI EDITOR OUTPUT START (by Sunspot, v1.063, #Hakiqi)
////////////////////////////////////////////////////////

class TugDisplayContainer{
    name         = "TugDisplayContainer";
    idd          = TUG_DISPLAY_CONTAINER_ID;
    fadein       = 0;
    duration     = 99999999999;
    fadeout      = 0;
    movingEnable = 1;
    onLoad       = "uiNamespace setVariable ['TugDisplayContainer',_this select 0];";
    onUnload     = "uiNamespace setVariable ['TugDisplayContainer', objNull];";
    onDestroy    = "uiNamespace setVariable ['TugDisplayContainer', objNull];";
    class Controls{
        class TugDisplayControl: IGUIBack
        {
            idc = TUG_DISPLAY_CONTAINER_ID;
            x = 0.195781 * safezoneW + safezoneX;
            y = 0.016 * safezoneH + safezoneY;
            w = 0.20625 * safezoneW;
            h = 0.066 * safezoneH;
            colorBackground[] = {0,0,0,0.3};
        };
        class LoseBackground: BalanceBarLoseBackground{
            idc = BALANCE_BAR_LOSE_BACKGROUND_ID;
        };
        class WinBackground: BalanceBarWinBackground{
            idc = BALANCE_BAR_WIN_BACKGROUND_ID;
        };
        class LoseProgress: BalanceBarLoseProgress{
            idc = BALANCE_BAR_LOSE_PROGRESS_ID;
        };
        class WinProgress: BalanceBarWinProgress{
            idc = BALANCE_BAR_WIN_PROGRESS_ID;
        };
        class WarchestValueText: RscText
        {
            idc  = TUG_DISPLAY_WARCHEST_ID;
            text = "Warchest: 0";
            x    = 0.267969 * safezoneW + safezoneX;
            y    = 0.049 * safezoneH + safezoneY;
            w    = 0.061875 * safezoneW;
            h    = 0.022 * safezoneH;
            colorText[] = {1,1,1,1};
        };
    };
};

////////////////////////////////////////////////////////
// GUI EDITOR OUTPUT END
////////////////////////////////////////////////////////

I would have loved to put the four controls of the BalanceBar into one class, but whenever I tried that nothing appeared.  Seems you can't do something like

 

Controls: MyOtherControlGroup {

};

 

You have to have something inside the class.

[dreadedentity 278]

You might be interested in creating a controls group