# Chapter 4 of Part 2 Static Box Series Control Class ## Brief Introduction of Static Box Series Static box is used to display information of figure, literal and image etc. at specific locations of the window, such as company profile and company product trademark etc., and it is one of the most common controls. Generally speaking, control row of static box series does not need to conduct dynamic response to input of the users, that is to say, it is not necessary to receive any input (such as keyboard and mouse etc.), and there is no event of itself. | *Control Name* | *Control name (mStudio display name)* | *Purpose* | *NCS class name* | *Control window class ID* | | Static box | Label | Display single row or multiple rows of texts | mStatic | NCSCTRL_STATIC | | Image box | Image | Display image | mImage | NCSCTRL_IMAGE | | Rectangle box | Rectangle | Draw rectangles | mRect | NCSCTRL_RECTANGLE | | Group box | Group Box| Region control that can contain other controls | mGroupbox | NCSCTRL_GROUPBOX | | Button group | Button Group| Manage RadioButton, realize single selection function | mButtonGroup | NCSCTRL_BUTTONGROUP | | LED label | LEDLabel| Display LED characters | mLEDLabel | NCSCTRL_LEDLABEL | | Separator | Horz/Vert Separator | Separation line, realize regional division visually | mSeparator | NCSCTRL_SEPARATOR | The inheritance relations of static box series controls are as follows: - mStatic - mImage - mRect - mGroupbox * mButtonGroup - mLEDLabel - mSeparator Static box of each type inherits the property, event and method of the parent class, therefore, in the following introduction, the inheritance part will be ignored automatically. ## mStatic static_show.png - Function: mStatic is the static region control used to draw content including texts and images etc. - Parent class: mWidget - Direct child class: - mImage - mRect - mGroupbox - mLEDLabel - mSeparator ### Style of mStatic None ### Property of mStatic | *Property name* | *Type* | *Permission* | *Property explanation* | *Mode value* | | NCSP_STATIC_ALIGN | int | RW | Control content horizontal alignment mode | NCS_ALIGN_LEFT, NCS_ALIGN_RIGHT, NCS_ALIGN_CENTER | | NCSP_STATIC_VALIGN | int | RW | Control content vertical alignment mode | NCS_VALIGN_TOP, NCS_VALIGN_BOTTOM, NCS_VALIGN_CENTER | | NCSP_STATIC_AUTOWRAP | int | RW | Control content automatic wrap | 1, 0 | - NCSP_STATIC_ALIGN：Set control content as horizontal alignment mode, and there are three kinds of values - NCS_ALIGN_LEFT：left aligned, default value of horizontal alignment mode - 0 - NCS_ALIGN_RIGHT：right aligned – 1 - NCS_ALIGN_CENTER：center aligned – 2 - NCSP_STATIC_VALIGN：set control content as vertical alignment mode, and there are three kinds of values - NCS_VALIGN_TOP：top aligned – 0 - NCS_VALIGN_BOTTOM：bottom aligned, default value of vertical alignment mode – 1 - NCS_VALIGN_CENTER：center aligned – 2 - NCSP_STATIC_AUTOWRAP：set static box content as automatic wrap mode or not, 0 is single row mode, which is closing automatic wrap mode, and 1 is automatic wrap mode Developers can set the property of mStatic through the following methods ```cplusplus //static control property configuration static NCS_PROP_ENTRY static1_props [] = { { NCSP_STATIC_ALIGN, NCS_ALIGN_CENTER }, // Alignment mode {0, 0} }; ... static NCS_PROP_ENTRY static4_props [] = { { NCSP_STATIC_VALIGN, NCS_VALIGN_TOP }, {0, 0} }; ... static NCS_WND_TEMPLATE _ctrl_templ[] = { { NCSCTRL_STATIC, //Control name IDC_STATIC1+0, 10, 10, 160, 30, //Control location, size WS_BORDER | WS_VISIBLE, WS_EX_NONE, "Default Text", //Text content within the control NULL, //props, NULL, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, { NCSCTRL_STATIC, IDC_STATIC1+1, 10, 50, 160, 30, WS_BORDER | WS_VISIBLE, WS_EX_NONE, "Center Text", static1_props, //props, set property NULL, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, ... ``` ### Event of mStatic At present, the static box series controls don‘t respond to any event ### Method of mStatic None ### Renderer of mStatic None ### Example of mStatic This example demonstrates how to create static boxes of different modes to the users.
static.png

List p2c4-1 static.c

```cplusplus %INCLUDE{"%ATTACHURL%/static.c.txt"}% ``` ## mImage image_show.png
- Function: load display image control in a region - Inherited from mStatic - Direct child class: none ### Property of mImage | *Property Name* | *Type* | *Permission* | *Property explanation* | *Value* | | NCSP_IMAGE_IMAGE | PBITMAP | RW | image control content image id, corresponds to pbmp image file pointer in mimage | None | | NCSP_IMAGE_IMAGEFILE | char* | RW | image control content image name id, corresponds to name pointer of pbmp image | None | | NCSP_IMAGE_DRAWMODE | enum | RW | image control drawing mode, corresponds to mImageDrawMode | NCS_DM_NORMAL, NCS_DM_SCALED, NCS_DM_SCALED | | NCSP_STATIC_ALIGN | int | RW | Set horizontal alignment mode of image control content | NCS_ALIGN_LEFT, NCS_ALIGN_RIGHT, NCS_ALIGN_CENTER | | NCSP_STATIC_VALIGN | int | RW | Set vertical alignment mode of image control content | NCS_VALIGN_TOP, NCS_VALIGN_BOTTOM, NCS_VALIGN_CENTER | - NCSP_IMAGE_DRAWMODE：set image drawing mode, and there are three modes. - NCS_DM_NORMAL：display image according to the original condition, and default value of the drawing mode – 0 - NCS_DM_SCALED：stretch, stretch the image to cover the whole static box-1 - NCS_DM_TILED：tile, display the image repeatedly in the whole static box-2 - NCSP_STATIC_ALIGN：refer to mStatic - NCSP_STATIC_VALIGN：refer to mStatic The following codes demonstrate how to set properties such as drawing mode etc. ```cplusplus static BITMAP icon; static BITMAP bitmap; static void set_icon_info(mWidget* self, int id, PBITMAP pbmp, int align_id, int align) { mImage *img; img = (mImage *)ncsGetChildObj(self->hwnd, id); if(img){ _c(img)->setProperty(img, NCSP_IMAGE_IMAGE, (DWORD)pbmp); _c(img)->setProperty(img, align_id, align); } } static BOOL mymain_onCreate(mWidget* self, DWORD add_data) { //TODO : initialize mImage *img; LoadBitmapFromFile(HDC_SCREEN, &bitmap, "image_test.jpg"); LoadBitmapFromFile(HDC_SCREEN, &icon, "icon.png"); set_icon_info(self, IDC_IMAGE1, &icon, NCSP_STATIC_ALIGN, NCS_ALIGN_LEFT); set_icon_info(self, IDC_IMAGE2, &icon, NCSP_STATIC_ALIGN, NCS_ALIGN_CENTER); set_icon_info(self, IDC_IMAGE3, &icon, NCSP_STATIC_ALIGN, NCS_ALIGN_RIGHT); set_icon_info(self, IDC_IMAGE4, &icon, NCSP_STATIC_VALIGN, NCS_VALIGN_TOP); set_icon_info(self, IDC_IMAGE5, &icon, NCSP_STATIC_VALIGN, NCS_VALIGN_CENTER); set_icon_info(self, IDC_IMAGE6, &icon, NCSP_STATIC_VALIGN, NCS_VALIGN_BOTTOM); img = (mImage *)ncsGetChildObj(self->hwnd, IDC_IMAGE7); if(img){ _c(img)->setProperty(img, NCSP_IMAGE_IMAGE, (DWORD)&bitmap); _c(img)->setProperty(img, NCSP_IMAGE_DRAWMODE, NCS_DM_SCALED); } img = (mImage *)ncsGetChildObj(self->hwnd, IDC_IMAGE8); if(img){ _c(img)->setProperty(img, NCSP_IMAGE_IMAGE, (DWORD)&bitmap); _c(img)->setProperty(img, NCSP_IMAGE_DRAWMODE, NCS_DM_TILED); } return TRUE; } ``` ### Event of mImage None ### Method of mImage None ### Example of mImage This example demonstrates how to display and create image static boxes of different drawing modes to the users
image.png

List p2c4-2 image.c

```cplusplus %INCLUDE{"%ATTACHURL%/image.c.txt"}% ``` ## mRect rect_show.png
- Function: this control provides the function of drawing rectangles to the users. Through the method of setting properties, rectangles with features of fill color, round corner and border etc. can be drawn conveniently and rapidly - Inherited from mStatic - Direct child class: none ### Property of mRect | *Property name* | *Type* | *Permission* | *Explanation* || | NCSP_RECT_BORDERSIZE | int | RW | Thickness of rect control border, border thickness of the corresponding rectangle control, and the type is int | | NCSP_RECT_BORDERCOLOR | dword | RW | Color of rect control border, border color of corresponding rectangle control, and the type is dword | | NCSP_RECT_FILLCOLOR | dword | RW | Fill color of rect control, fill color of corresponding rectangle control, and the type is dword | | NCSP_RECT_XRADIUS | int | RW | Round corner horizontal x radius of rect control, round corner radius of corresponding rectangle control, and the type is int | | NCSP_RECT_YRADIUS | int | RW | Round corner vertical y radius of rect control, round corner radius of corresponding rectangle control, and the type is int | | NCSP_RECT_FILLCLR_RED | | | | | NCSP_RECT_FILLCLR_GREEN | | | | | NCSP_RECT_FILLCLR_BLUE | | | | | NCSP_RECT_FILLCLR_ALPHA | | | | | NCSP_RECT_BRDCLR_RED | | | | | NCSP_RECT_BRDCLR_GREEN | | | | | NCSP_RECT_BRDCLR_BLUE | | | | | NCSP_RECT_BRDCLR_ALPHA | | | | The following codes demonstrate how to set the properties of rectangles ```cplusplus //Propties for static NCS_PROP_ENTRY rect1_props [] = { {NCSP_RECTANGLE_BORDERSIZE, 3}, {NCSP_RECTANGLE_BORDERCOLOR, 0xFFFF0000}, {NCSP_RECTANGLE_FILLCOLOR, 0x00000000}, {0, 0} }; static NCS_PROP_ENTRY rect2_props [] = { {NCSP_RECTANGLE_BORDERSIZE, 2}, {NCSP_RECTANGLE_BORDERCOLOR, 0xFFFFFFF}, {NCSP_RECTANGLE_FILLCOLOR, 0xFF0F0F0F}, {0, 0} }; static NCS_PROP_ENTRY rect3_props [] = { {NCSP_RECTANGLE_BORDERSIZE, 0}, {NCSP_RECTANGLE_BORDERCOLOR, 0xFF0C0000}, {NCSP_RECTANGLE_FILLCOLOR, 0xFF00FFFF}, {0, 0} }; static NCS_PROP_ENTRY rect4_props [] = { {NCSP_RECTANGLE_BORDERSIZE, 5}, {NCSP_RECTANGLE_BORDERCOLOR, 0xFF0000FF}, {NCSP_RECTANGLE_FILLCOLOR, 0xFF00FF00}, {NCSP_RECTANGLE_XRADIUS, 4}, {NCSP_RECTANGLE_YRADIUS, 4}, {0, 0} }; //Controls static NCS_WND_TEMPLATE _ctrl_templ[] = { ... { NCSCTRL_RECTANGLE, ID_RECT1, 110, 10, 80, 40, WS_VISIBLE, WS_EX_NONE, "", rect1_props, //props, NULL, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, ... { NCSCTRL_RECTANGLE, ID_RECT2, 110, 60, 80, 40, WS_VISIBLE, WS_EX_NONE, "", rect2_props, //props, NULL, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, ... { NCSCTRL_RECTANGLE, ID_RECT3, 110, 110, 80, 40, WS_VISIBLE, WS_EX_NONE, "", rect3_props, //props, NULL, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, ... { NCSCTRL_RECTANGLE, ID_RECT4, 110, 160, 80, 40, WS_VISIBLE, WS_EX_NONE, "", rect4_props, //props, NULL, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, }; ``` ### Event of mRect None ### Method of mRect None ### Example of mRect This example demonstrate how to draw all kinds of rectangles to the users
rect.png

List p2c4-3 rectangle.c

```cplusplus %INCLUDE{"%ATTACHURL%/rectangle.c.txt"}% ``` ## mGroupbox groupbox_show.png
- Function: group box, this control is used to provide recognizable groups for the other controls. Normally, group box is used to subdivide the forms according to functions, and grouping all the options in the group box can provide logicalized visible prompt to the users. - Inherited from mStatic - Direct child class: - mButtongroup ### Property of mGroupbox None ### Event of mGroupbox None ### Method of mGroupbox None ### Renderer of mGroupbox groupbox_rdr.png
Users can set classic, fit and fashion renderers as shown in the figure above for group box conveniently, and for the concrete method, see the codes below, ```cplusplus ... static NCS_RDR_INFO grp_rdr_info[] = { {"fashion", "fashion", NULL} // {"flat", "flat", NULL} // {"classic", "classic", NULL} }; //Controls static NCS_WND_TEMPLATE _ctrl_templ[] = { { NCSCTRL_GROUPBOX , ID_GROUP, 10, 10, 280, 180, WS_VISIBLE, WS_EX_NONE, "groupbox", NULL, //props, grp_rdr_info, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, }; ... ``` ### Example of mGroupbox groupbox.png
This example demonstrate how to generate group box with renderers to the users

List p2c4-4 groupbox.c

```cplusplus %INCLUDE{"%ATTACHURL%/groupbox.c.txt"}% ``` ## mButtonGroup buttongroup_show.png
- Function: this control is used to manage a group of radioButton, enabling the group of RadioButton to mutually exclude, thus realizing single selection function. - Inherited from mGroupbox - Direct child class: none ### Property of mButtonGroup | *Property Name* | *Type* | *Permission* | *Property explanation* | | NCSP_BTNGRP_SELID | int | RW | Currently selected radioButton ID number | | NCSP_BTNGRP_SELIDX | idx | RW | Currently selected radioButton index number | | NCSP_BTNGRP_SELOBJ | mWidget* | RW | Currently selected radioButton pointer | ### Method of mButtonGroup ```cplusplus BOOL (*addButton)(clsName *group, mWidget *radio); ``` - Function: add a radioButton - Returned value: BOOL ```cplusplus BOOL (*checkBtn)(clsName *group, mWidget *btn_to_check); ``` - Function: select a radioButton - Returned value: BOOL ### Example of mButtonGroup buttongroup.png
Please refer to mRadioButton in [Chapter 5 Button Series Control Class](Products/MStudioMGNCSV1dot0PGENP2C5#m_RadioButton). ## mLEDLabel ledstatic_show.png
- Function: mLEDLabel class is the static box imitating LED digital nixie tube, which is used to display LED characters and can be used in multiple fields such as industrial control etc. - Inherited from mStatic - Direct child class: none ### Property of mLEDLabel | *Property name* | *Type* | *Permission* | *Property explanation* | | NCSP_LEDLBL_COLOR | DWORD | RW | Set the color of LED font, such as red is 0xFF0000FF | | NCSP_LEDLBL_WIDTH | int | RW | Set the width of LED font | | NCSP_LEDLBL_HEIGHT | int | RW | Set the height of LED font | Users can use the following method to set the properties: ```cplusplus //Propties for static NCS_PROP_ENTRY static1_props [] = { { NCSP_LEDLBL_COLOR, 0xFF0000FF}, { NCSP_LEDLBL_WIDTH, 10}, { NCSP_LEDLBL_HEIGHT, 15}, { NCSP_STATIC_ALIGN, NCS_ALIGN_RIGHT }, { NCSP_STATIC_AUTOWRAP, 0 }, {0, 0} }; static NCS_PROP_ENTRY static2_props [] = { { NCSP_LEDLBL_COLOR, 0xFF0000FF}, { NCSP_LEDLBL_WIDTH, 60}, { NCSP_LEDLBL_HEIGHT, 90}, { NCSP_STATIC_VALIGN, NCS_VALIGN_CENTER }, { NCSP_STATIC_ALIGN, NCS_ALIGN_CENTER }, {0, 0} }; //Controls static NCS_WND_TEMPLATE _ctrl_templ[] = { { NCSCTRL_LEDLABEL , IDC_LEDLBL1+0, 10, 10, 160, 50, WS_BORDER | WS_VISIBLE, WS_EX_NONE, "ABC 123", NULL, //props, take the default property NULL, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, { NCSCTRL_LEDLABEL , IDC_LEDLBL1+2, 10, 70, 160, 30, WS_BORDER | WS_VISIBLE, WS_EX_NONE, "2 4 6 8 0 ", static1_props, //props, NULL, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, { NCSCTRL_LEDLABEL , IDC_LEDLBL1+5, 180, 10, 100, 100, WS_BORDER | WS_VISIBLE, WS_EX_NONE, "4", static2_props, //props, NULL, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, }; ``` ### Style of mLEDLabel None ### Method of mLEDLabel None ### Renderer of mLEDLabel None ### Example of mLEDLabel ledlabel.png
This example demonstrates how to display LED characters to the users ```cplusplus %INCLUDE{"%ATTACHURL%/ledlabel.c.txt"}% ``` ## mSeparator separator_show.png
- Function: used to separate the item controls and conduct horizontal or vertical separation lines of region division - Inherited from mStatic - Direct child class: none ### Property of mSeparator None ### Style of mSeparator | *Property name* | *Explanation* | | NCSS_SPRTR_VERT | Set as vertical separation line, default by default | Users can use the following method to set the style: ```cplusplus ... static NCS_WND_TEMPLATE _ctrl_templ[] = { ..., { NCSCTRL_SEPARATOR , ID_GROUP, 100, 20, 5, 200, WS_VISIBLE|NCSS_SPRTR_VERT, //Set vertical style WS_EX_NONE, "groupbox", NULL, //props, NULL, //rdr_info NULL, //handlers, NULL, //controls 0, 0 //add data }, }; ``` ### Event of mSeparator None ### Method of mSeparator None ### Renderer of mSeparator None ### Example of mSeparator separator.png
This example demonstrates how to generate horizontal and vertical separation lines to the users ```cplusplus %INCLUDE{"%ATTACHURL%/separator.c.txt"}% ``` [Next](MStudioMGNCSV1dot0PGENP2C3][Previous]] < [[MStudioMGNCSV1dot0PGEN][Index]] > [[MStudioMGNCSV1dot0PGENP2C5) -- Main.XiaodongLi - 24 Feb 2010