C++界面库：Graphic Element Template实现

C++界面库：Graphic Element Template实现

    这篇文章描述的一个图形元素模板终于通过了冒烟测试。下面将展示模板的XML代码、调用模板的代码以及截图。

    下面的XML描述了一个黑变蓝底的长方形里面居中一个文字。

 1  <? xml version="1.0" encoding="utf-8"  ?>
 2  < irconfig  xmlns ="http://tempuri.org/irconfig.xsd" >
 3     < resources >
 4       < brush  name ="blue_brush"  kind ="solid" >
 5         < main_color  r ="128"  g ="255"  b ="255"  a ="255"   />
 6       </ brush >
 7       < brush  name ="black_brush"  kind ="solid" >
 8         < main_color  r ="0"  g ="0"  b ="0"  a ="255" />
 9       </ brush >
10       < pen  name ="border_pen"  brush ="black_brush"  endcap ="round"  join ="round"  weight ="5" />
11       < font  name ="text_font"  face ="微软雅黑"  size ="96" />
12     </ resources >
13     < templates >
14       < template  name ="display" >
15         < properties >
16           < property  name ="x"  type ="int"  default ="0" />
17           < property  name ="y"  type ="int"  default ="0" />
18           < property  name ="w"  type ="int"  default ="100" />
19           < property  name ="h"  type ="int"  default ="100" />
20           < property  name ="content"  type ="str"  default ="" />
21         </ properties >
22         < content >
23           < rectangle  x ="$x"  y ="$y"  width ="$w"  height ="$h"  pen ="border_pen"  brush ="blue_brush" >
24             < text
25               font ="text_font"
26              brush ="black_brush"
27              x ="($w-this.width)/2"
28              y ="($h-this.height)/2"
29              text ="$content"
30               />
31           </ rectangle >
32         </ content >
33       </ template >
34     </ templates >
35  </ irconfig >
36 

    于是我们可以把模板“display”创建之后，设置x、y、w、h、content，然后显示在一个窗口上：

 1  class  ConfigForm :  public  VL_WinForm
 2  {
 3  protected :
 4      IVL_IrFactory::Ptr                FFactory;
 5      IVL_IrCanvas::Ptr                FCanvas;
 6      VL_IrConfigLoader::Ptr            FLoader;
 7      VL_IrConfig::Ptr                FConfig;
 8      VL_IrTemplateInstance::Ptr        FInstance;
 9  public :
10      ConfigForm():VL_WinForm( true )
11      {
12          SetBorder(vwfbSingle);
13          SetMinimizeBox( false );
14          SetMaximizeBox( false );
15          SetClientWidth( 800 );
16          SetClientHeight( 600 );
17          SetText(L " Vczh Interaction Renderer Template Test " );
18 
19          FFactory = CreateInteractionFactory(L " GDI " );
20          FCanvas = FFactory -> CreateCanvas( this );
21          FLoader = new  VL_IrConfigLoader(FFactory);
22          FConfig = FLoader -> Load(VFileName(GetApplication() -> GetAppName()).MakeAbsolute(L " ..\\Renderer\\IrConfig_Test.xml " ).GetStrW());
23 
24 
25          VL_IrBrushRec WhiteBrushRec;
26          WhiteBrushRec.BrushKind = VL_IrBrushRec::bkSolid;
27          WhiteBrushRec.MainColor = VL_IrColor( 255 , 255 , 255 );
28          IVL_IrBrush::Ptr WhiteBrush = FFactory -> CreateBrush(WhiteBrushRec);
29 
30          IVL_IrRectangle::Ptr Root = FFactory -> CreateRectangle();
31          Root -> Properties() -> SetBrush(WhiteBrush);
32          Root -> Update(VL_IrPoint( 0 , 0 ),VL_IrPoint( 800 , 600 ));
33          FCanvas -> SetRootElement(Root);
34 
35          FInstance = FConfig -> FindTemplate(L " display " ) -> CreateInstance();
36           for (VInt i = 0 ;i < FInstance -> GetRootElements().GetCount();i ++ )
37          {
38              Root -> Container() -> AddChild(FInstance -> GetRootElements()[i]);
39          }
40 
41          FInstance -> GetInts()[L " x " ] = 100 ;
42          FInstance -> GetInts()[L " y " ] = 100 ;
43          FInstance -> GetInts()[L " w " ] = 600 ;
44          FInstance -> GetInts()[L " h " ] = 400 ;
45          FInstance -> GetStrs()[L " content " ] = L " Template " ;
46          FInstance -> Update();
47 
48          FCanvas -> Render();
49      }
50  };

    于是打开这个窗口，就变成了这样：

    以后可以方便地为各种控件设计皮肤了。接下来是模板的测试，然后开始设计控件的架构。