Display Items in Group Box Item

Hello,

In my DialogBox, I want to group dialog items like text-inputs, labels and buttons. The Group Box Item can draw a rectangle around a group of dialog items.

How am I able to group dialog items, so that they are shown in the box.

My Code:

DialogBoxRsc DIALOGID_ViewInfo = {
    DIALOGATTR_DEFAULT | DIALOGATTR_SINKABLE | DIALOGATTR_GROWABLE,
    WIDTH, HEIGHT, NOHELP, MHELP,
    HOOKDIALOGID_ViewInfo, NOPARENTID,
    TXT_DialogTitle,
	{
	BEGIN_VSTACK_LAYOUT(VSTACKLAYOUTID_Main,"")
		BEGIN_HSTACK_LAYOUT(HSTACKLAYOUTID_LabeledItem, "")

					LAYOUT_LABEL_NEXT_LEFT(0, "")
					{{11*XC,   1*YC, 0,  0},		OptionButton,   OPTIONBUTTONID_ViewNo,			ON, 0,							"",					""},
					STRETCH(1)
					{{AUTO_XY,BUTTON_LARGEWIDTH,0},	PushButton,		PUSHBUTTONID_Update,			ON, 0,							"",					""},

		END_LAYOUT
		BEGIN_VSTACK_LAYOUT(VSTACKLAYOUTID_LabeledItem,"")

					{AUTO_XYWH,						Label,			0,								ON,	LABEL_LINKNEXT | ALIGN_LEFT,"",					""},
					{AUTO_XYWH,                     MLText,			MLTEXTID_ViewInfoDescription,	ON, 0,							"",					""},
					SPACING(YC)

		END_LAYOUT

					{AUTO_XYWH,						GroupBox,		0,								ON,	GROUPBOXATTR_BAR,			TXT_SetAcsGroup,	""},

		BEGIN_VSTACK_LAYOUT(0,"")
			BEGIN_HSTACK_LAYOUT(0,"")

					{AUTO_XYWH,						GroupBox,		0,								ON,	0,							TXT_AcsOrigin,		""},
					
				BEGIN_VSTACK_LAYOUT(VSTACKLAYOUTID_Inner,"")

					{AUTO_XYWH,						Text,			TEXTID_AcsOriginX,				ON, 0,							"",					""},
					{AUTO_XYWH,						Text,			TEXTID_AcsOriginY,				ON, 0,							"",					""},
					{AUTO_XYWH,						Text,			TEXTID_AcsOriginZ,				ON, 0,							"",					""},

				END_LAYOUT		
				
					{AUTO_XYWH,						GroupBox,		0,								ON,	0,							TXT_AcsCp,			""},

				BEGIN_VSTACK_LAYOUT(VSTACKLAYOUTID_Inner,"")
									
					{AUTO_XYWH,						Text,			TEXTID_AcsCpX,					ON, 0,							"",					""},
					{AUTO_XYWH,						Text,			TEXTID_AcsCpY,					ON, 0,							"",					""},
					{AUTO_XYWH,						Text,			TEXTID_AcsCpZ,					ON, 0,							"",					""},

				END_LAYOUT
					
				STRETCH(1)
			
			END_LAYOUT
			BEGIN_HSTACK_LAYOUT(HSTACKLAYOUTID_DialogButtons,"")

					STRETCH(1)
					{{AUTO_XY,BUTTON_LARGEWIDTH,0},	PushButton,		PUSHBUTTONID_Acs,				ON, 0,							"",					""},
			
			END_LAYOUT
		END_LAYOUT
	END_LAYOUT
	}
};

The border of the Group Box Item  "Ursprung" should have the text-inputs x,y,z and labels in it. Is using the VSTACK- and HSTACK-Layout a problem here?

[Connect Update 15 C++]

  • Hello again,

    I optimized my code with using the VSTACK_LAYOUT. By tabbing through the input fields, I'm now able to go from x -> y -> z and then to the next Group Box with again x -> y -> z. With my last code it was x -> x -> y -> y -> z -> z (of the two Group Boxes).

    DialogBoxRsc DIALOGID_ViewInfo = {
        DIALOGATTR_DEFAULT | DIALOGATTR_SINKABLE | DIALOGATTR_GROWABLE,
        WIDTH, HEIGHT, NOHELP, MHELP,
        HOOKDIALOGID_ViewInfo, NOPARENTID,
        TXT_DialogTitle,
    	{
    	BEGIN_VSTACK_LAYOUT(VSTACKLAYOUTID_Main,"")
    		BEGIN_HSTACK_LAYOUT(HSTACKLAYOUTID_LabeledItem, "")
    
    					LAYOUT_LABEL_NEXT_LEFT(0, "")
    					{{11*XC,   1*YC, 0,  0},		OptionButton,   OPTIONBUTTONID_ViewNo,			ON, 0,							"",					""},
    					STRETCH(1)
    					{{AUTO_XY,BUTTON_LARGEWIDTH,0},	PushButton,		PUSHBUTTONID_Update,			ON, 0,							"",					""},
    
    		END_LAYOUT
    		BEGIN_VSTACK_LAYOUT(VSTACKLAYOUTID_LabeledItem,"")
    
    					{AUTO_XYWH,						Label,			0,								ON,	LABEL_LINKNEXT | ALIGN_LEFT,"",					""},
    					{AUTO_XYWH,                     MLText,			MLTEXTID_ViewInfoDescription,	ON, 0,							"",					""},
    					SPACING(YC)
    
    		END_LAYOUT
    
    					{AUTO_XYWH,						GroupBox,		0,								ON,	GROUPBOXATTR_BAR,			TXT_SetAcsGroup,	""},
    
    		BEGIN_HSTACK_LAYOUT(0,"")
    			BEGIN_GRID_LAYOUT(GRIDLAYOUTID_2ColumnsInner,"")
    
    				GRID_ROW(0,"")
    					{AUTO_XYWH,						GroupBox,		0,								ON,	0,							TXT_AcsOrigin,		"rowSpan='2',colSpan='1'"},
    					{AUTO_XYWH,						GroupBox,		0,								ON,	0,							TXT_AcsCp,			"rowSpan='2',column='1',colSpan='1'"},
    
    				END_ROW
    				GRID_ROW(0,"")
    					
    					BEGIN_VSTACK_LAYOUT(0,"")
    
    					{AUTO_XYWH,						Text,			TEXTID_AcsOriginX,				ON, 0,							"",					"margin='20,7,5,0'"},
    					{AUTO_XYWH,						Text,			TEXTID_AcsOriginY,				ON, 0,							"",					"margin='20,0,5,0'"},
    					{AUTO_XYWH,						Text,			TEXTID_AcsOriginZ,				ON, 0,							"",					"margin='20,0,5,5'"},
    
    					END_LAYOUT
    					BEGIN_VSTACK_LAYOUT(0,"")
    
    					{AUTO_XYWH,						Text,			TEXTID_AcsCpX,					ON, 0,							"",					"margin='20,7,5,0'"},
    					{AUTO_XYWH,						Text,			TEXTID_AcsCpY,					ON, 0,							"",					"margin='20,0,5,0'"},
    					{AUTO_XYWH,						Text,			TEXTID_AcsCpZ,					ON, 0,							"",					"margin='20,0,5,5'"},
    
    					END_LAYOUT
    				END_ROW
    			END_LAYOUT
    
    			STRETCH(1)
    			
    		END_LAYOUT
    
    		BEGIN_HSTACK_LAYOUT(HSTACKLAYOUTID_DialogButtons,"")
    
    			STRETCH(1)
    			{{AUTO_XY,BUTTON_LARGEWIDTH,0},	PushButton,		PUSHBUTTONID_Acs,				ON, 0,							"",					""},
    			
    		END_LAYOUT
    	END_LAYOUT
    	}
    };

    Good evening.

    Answer Verified By: Ole Gottwald 

  • I wanted to share my result

    Five gold stars for perseverance and ingenuity!

     
    Regards, Jon Summers
    LA Solutions

  • I wanted to share my result and here it is.

    I used the Grid_Layout, "rowSpan" and the "margin" attribute. As allways, if you do something different and can explain why, it would be nice to hear from you.

    It's realy hard to find in the documentation..

    DialogBoxRsc DIALOGID_ViewInfo = {
        DIALOGATTR_DEFAULT | DIALOGATTR_SINKABLE | DIALOGATTR_GROWABLE,
        WIDTH, HEIGHT, NOHELP, MHELP,
        HOOKDIALOGID_ViewInfo, NOPARENTID,
        TXT_DialogTitle,
    	{
    	BEGIN_VSTACK_LAYOUT(VSTACKLAYOUTID_Main,"")
    		BEGIN_HSTACK_LAYOUT(HSTACKLAYOUTID_LabeledItem, "")
    
    					LAYOUT_LABEL_NEXT_LEFT(0, "")
    					{{11*XC,   1*YC, 0,  0},		OptionButton,   OPTIONBUTTONID_ViewNo,			ON, 0,							"",					""},
    					STRETCH(1)
    					{{AUTO_XY,BUTTON_LARGEWIDTH,0},	PushButton,		PUSHBUTTONID_Update,			ON, 0,							"",					""},
    
    		END_LAYOUT
    		BEGIN_VSTACK_LAYOUT(VSTACKLAYOUTID_LabeledItem,"")
    
    					{AUTO_XYWH,						Label,			0,								ON,	LABEL_LINKNEXT | ALIGN_LEFT,"",					""},
    					{AUTO_XYWH,                     MLText,			MLTEXTID_ViewInfoDescription,	ON, 0,							"",					""},
    					SPACING(YC)
    
    		END_LAYOUT
    
    					{AUTO_XYWH,						GroupBox,		0,								ON,	GROUPBOXATTR_BAR,			TXT_SetAcsGroup,	""},
    
    		BEGIN_HSTACK_LAYOUT(0,"")
    			BEGIN_GRID_LAYOUT(GRIDLAYOUTID_4ColumnsInner,"")
    
    				GRID_ROW(0,"")
    					{AUTO_XYWH,						GroupBox,		0,								ON,	0,							TXT_AcsOrigin,		"rowSpan='4',colSpan='2'"},
    					{AUTO_XYWH,						GroupBox,		0,								ON,	0,							TXT_AcsCp,			"rowSpan='4',column='2',colSpan='2'"},
    
    				END_ROW
    				GRID_ROW(0,"")
    					
    					{AUTO_XYWH,						Label,			0,								ON,	LABEL_LINKNEXT | ALIGN_LEFT,"",					"margin='5,7,0,0'"},
    					{AUTO_XYWH,						Text,			TEXTID_AcsOriginX,				ON, 0,							"",					"margin='0,7,5,0'"},
    
    					{AUTO_XYWH,						Label,			0,								ON,	LABEL_LINKNEXT | ALIGN_LEFT,"",					"margin='5,7,0,0'"},
    					{AUTO_XYWH,						Text,			TEXTID_AcsCpX,					ON, 0,							"",					"margin='0,7,5,0'"},
    
    				END_ROW
    				GRID_ROW(0,"")
    
    					{AUTO_XYWH,						Label,			0,								ON,	LABEL_LINKNEXT | ALIGN_LEFT,"",					"marginLeft='5'"},
    					{AUTO_XYWH,						Text,			TEXTID_AcsOriginY,				ON, 0,							"",					"marginRight='5'"},
    
    					{AUTO_XYWH,						Label,			0,								ON,	LABEL_LINKNEXT | ALIGN_LEFT,"",					"marginLeft='5'"},
    					{AUTO_XYWH,						Text,			TEXTID_AcsCpY,					ON, 0,							"",					"marginRight='5'"},
    
    				END_ROW
    				GRID_ROW(0,"")
    
    					{AUTO_XYWH,						Label,			0,								ON,	LABEL_LINKNEXT | ALIGN_LEFT,"",					"margin='5,0,0,5'"},
    					{AUTO_XYWH,						Text,			TEXTID_AcsOriginZ,				ON, 0,							"",					"margin='0,0,5,5'"},
    
    					{AUTO_XYWH,						Label,			0,								ON,	LABEL_LINKNEXT | ALIGN_LEFT,"",					"margin='5,0,0,5'"},
    					{AUTO_XYWH,						Text,			TEXTID_AcsCpZ,					ON, 0,							"",					"margin='0,0,5,5'"},
    					
    				END_ROW			
    					
    			END_LAYOUT
    			STRETCH(1)
    			
    		END_LAYOUT
    
    		BEGIN_HSTACK_LAYOUT(HSTACKLAYOUTID_DialogButtons,"")
    
    			STRETCH(1)
    			{{AUTO_XY,BUTTON_LARGEWIDTH,0},	PushButton,		PUSHBUTTONID_Acs,				ON, 0,							"",					""},
    			
    		END_LAYOUT
    
    		
    
    	END_LAYOUT
    	}
    };
    

    Have a great day!

  • I hoped, that you can make a VSTACK_LAYOUT part of a GroupBox

    I too would like to understand the VSTACK_XXX macros better.  It's only by chance that I found the hidden documentation that I posted.

    We're spoiled by the great UI tools available for Windows Forms and Windows Presentation Foundation for C#.  It would be wonderful to be able to do something similar with the MicroStationAPI.

     
    Regards, Jon Summers
    LA Solutions

  • Ok, thanks!

    A GroupBox is a visual container, not a logical one.  That is, a GroupBox doesn't 'know' that it contains other dialog items.

    I hoped, that you can make a VSTACK_LAYOUT part of a GroupBox, or to make "dialog items groups", which behaves in a different way.

    Place a GroupBox with your width and height, then manually add dialog items with coordinates that place them within that GroupBox.

    I found some examples, so I will be able to try it like you said.

    Regards Ole

  • How am I able to group dialog items

    A GroupBox is a visual container, not a logical one.  That is, a GroupBox doesn't 'know' that it contains other dialog items.

    Unless someone can explain how to use the BEGIN_VSTACK_LAYOUT and BEGIN_HSTACK_LAYOUT macros, I prefer to keep it simple.  There are no examples delivered with the SDK.  If you search MicroStationAPI help for BEGIN_VSTACK_LAYOUT, you will find article APIIntroductionMDL.h.  That has a literal HTML description of automatic layouts, which for whatever reason didn't make it into the formatted API help.

    I've edited that help article so that it displays as best it can in a web browser: see here.

    Place a GroupBox with your width and height, then manually add dialog items with coordinates that place them within that GroupBox.

     
    Regards, Jon Summers
    LA Solutions