（9）uniGUI for C++ builder下如何使用UniPageControl控件做成WEB多页面系统界面框架？
(中行雷威2018.3.9)
（同一个世界，同一个梦想，交流学习C++Builder XE10，传承c++builder的魅力！欢迎各地朋友加入我的QQ群484979943,进群密码“BCB”，同时也请将该群号广为宣传，希望能够广集各方高手，共同进步。如需下载开发工具及源代码请加入我的QQ群）
【阅读倡议】
1、有问题请留言;
2、没问题请点赞;
3、看连载请加群;
4、下源码请加群;
【开发工具】
1、C++Builder10.2.2tokyo
2、FMSoft_uniGUI_Complete_Professional_1.0.0.1424_Trial
本文将简单介绍如何开发一个WEB应用系统的主界面，一般WEB应用系统的主界面由左边的树结构功能菜单UniTreeView控件和右边的多页面窗口UniPageControl控件构成，点击左边树节点，动态在右边生成对应的TabSheet页面，并将被调用的frame窗口摆放上去。uniGUI的安装与配置请访问我的博客：http://blog.csdn.net/dlboy2018/article/details/79263520
一、创建项目
主菜单File-》New-》Other选择uniGUI for C++Builder创建项目
选择Yes.完成项目创建。
主菜单：设置Project-》Options设置Include path和Library path，分别都添加C:\Program Files (x86)\Embarcadero\Studio\19.0\uniGUI目录
Linker和Runtime Packages取消动态链接和引用动态包
二、主窗口设计
在MainForm窗口上摆放两个UniPanel控件，一个UniTreeView控件，一个UniPageControl控件,配置如下：
UniPanel1的Align属性设置为alTop（上对齐）
UniPanel2的Align属性设置为alLeft（左对齐），CollapseDirection设置为cdLeft，Collapsible属性设置为True(上部带有向左折叠收纳箭头功能)
UniTreeView1放在UniPanel2上，其Align属性设置为alClient（上图是未设置该属性时候的样子）,Items属性点开，配置树节点名称，如下图所示：
UniPageControl1放在MainForm主窗口右侧空白区域,右键可以先创建一个UniTabSheet1，也可以不创建。
三、子窗口设计
主菜单：File-》New-》Other，选择uniGUI for C++Builder，Frame，创建四个Frame窗口:UniFrame1、UniFrame2、UniFrame3、UniFrame4，每个上面放一个UniLable控件，Caption属性分别写上沈阳、大连、济南、青岛。
四、代码实现
1、切换打开MainForm主窗口，主菜单：File-》User Unit分别打开引用Unit1.h、Unit2.h、Unit3.h、Unit4.h四个子窗口头文件。
操作后Main.cpp文件头增加如下四行:
#include "Unit1.h"
#include "Unit2.h"
#include "Unit3.h"
#include "Unit4.h"
2、Main.cpp文件头增加TUniFrame包含头文件
//---------------------------------------------------------------------------
#include <vcl.h>
#include <uniGUIVars.hpp>
#pragma hdrstop
/*自定义*/
#include "uniGUIFrame.hpp" //定义TUniFrame、TUniFrameClass类的地方
#include "Main.h"
#include "MainModule.h"
（如果后续编译时提示Main.h中自定义的OpenPage函数报错，请将本段红色语句挪到Main.h文件头）
3、Main.cpp文件中定义自动创建打开新页面的函数
//---------------------------------------------------------------------------
void __fastcall TMainForm::openPage(String pageName,String pageCaption,TUniPageControl *pageControl,TUniFrame *newFrame)
{
TUniTabSheet * newTabSheet;
String Err="";
newTabSheet=(TUniTabSheet *)pageControl->FindChildControl(pageName) ;//查找是否已经存在要创建的页面
if(newTabSheet!=NULL)
{
pageControl->ActivePage=newTabSheet ;//如果页面已经被打开就**它显示它
Err="Page:"+pageName+" Old页面已建立";
ShowMessage(Err);
}
else
{
newTabSheet=new TUniTabSheet(pageControl);//创建一个sheet新页面
newTabSheet->PageControl=pageControl;//新sheet页面放到pageControl下
newTabSheet->Name=pageName;//设置新页面名字
newTabSheet->Caption=pageCaption;//设置新页面Caption页眉内容
newTabSheet->Closable=true;//设置新页面可一个关闭
pageControl->ActivePage=newTabSheet;//**新页面
newFrame->Parent=newTabSheet;//将新Frame放到新创建的页面上
newFrame->Align=alClient;//新Frame在新页面上居中显示
Err="Page:"+pageName+" New页面新建立";
ShowMessage(Err);
}
}
//---------------------------------------------------------------------------
4、Main.h头文件中增加函数定义
//---------------------------------------------------------------------------
#ifndef MainH
#define MainH
//---------------------------------------------------------------------------
#include <Classes.hpp>
#include <Controls.hpp>
#include <StdCtrls.hpp>
#include <Forms.hpp>
#include <uniGUIForm.hpp>
#include <uniGUIRegClasses.hpp>
#include "uniGUIBaseClasses.hpp"
#include "uniGUIClasses.hpp"
#include "uniPageControl.hpp"
#include "uniPanel.hpp"
#include "uniTreeView.hpp"
//---------------------------------------------------------------------------
class TMainForm : public TUniForm
{
__published: // IDE-managed Components
TUniPanel *UniPanel1;
TUniPanel *UniPanel2;
TUniPageControl *UniPageControl1;
TUniTreeView *UniTreeView1;
TUniTabSheet *UniTabSheet1;
void __fastcall UniTreeView1Click(TObject *Sender);
/*自定义*/
void __fastcall openPage(String pageName,String pageCaption,TUniPageControl *pageControl,TUniFrame *newFrame);//定义自动打开页面函数
private: // User declarations
public: // User declarations
__fastcall TMainForm(TComponent* Owner);
};
//---------------------------------------------------------------------------
TMainForm *MainForm(void);
//---------------------------------------------------------------------------
#endif
5、Main.cpp中定义UniTreeView1树节点点击调用事件
void __fastcall TMainForm::UniTreeView1Click(TObject *Sender)
{
//菜单功能调用
AnsiString funcType,funcName;//一个保存被选中节点名称，一个保存被选中节点上级节点名称
if(UniTreeView1->Selected->Level<1)//如果选中的不是一级节点就不动作
{
return;
}
funcType=UniTreeView1->Selected->Parent->Text;//获取上级节点内容
funcName=UniTreeView1->Selected->Text;//获取选中节点内容
if(funcType=="辽宁省")
{
if(funcName=="沈阳")
{
TUniFrame1 *frame1;//定义子窗口1变量
TUniTabSheet *newTabSheet=(TUniTabSheet *)UniPageControl1->FindChildControl("PageName1") ;//查找是否已经存在该子窗口
if(newTabSheet==NULL)
frame1=new TUniFrame1(this);//动态创建新窗口
openPage("PageName1","辽宁省沈阳市",UniPageControl1,frame1);//调用预定义的创建新页面打开窗口函数
}
else if(funcName=="大连")
{
TUniFrame2 *frame2;
TUniTabSheet *newTabSheet=(TUniTabSheet *)UniPageControl1->FindChildControl("PageName2") ;
if(newTabSheet==NULL)
frame2=new TUniFrame2(this);
openPage("PageName2","辽宁省大连市",UniPageControl1,frame2);
}
}
else if(funcType=="山东省")
{
if(funcName=="济南")
{
TUniFrame3 *frame3;
TUniTabSheet *newTabSheet=(TUniTabSheet *)UniPageControl1->FindChildControl("PageName3") ;
if(newTabSheet==NULL)
frame3=new TUniFrame3(this);
openPage("PageName3","山东省济南市",UniPageControl1,frame3);
}
else if(funcName=="青岛")
{
TUniFrame4 *frame4;
TUniTabSheet *newTabSheet=(TUniTabSheet *)UniPageControl1->FindChildControl("PageName4") ;
if(newTabSheet==NULL)
frame4=new TUniFrame4(this);
openPage("PageName4","山东省青岛市",UniPageControl1,frame4);
}
}
}
//---------------------------------------------------------------------------
五、运行结果
打开浏览器，输入访问地址http://127.0.0.1:8077，系统界面如下：
上述界面和传统的VCL程序界面相同，就像搬到了浏览器上一样，如果不习惯，请打开ServerModule窗口的设计界面，将其MainFormDisplay属性设置为mfPage,窗口将镶嵌到浏览器中，详见下图：