基于XML文本的XML树图形生成系统.docx
- 文档编号:26934913
- 上传时间:2023-06-24
- 格式:DOCX
- 页数:44
- 大小:654.20KB
基于XML文本的XML树图形生成系统.docx
《基于XML文本的XML树图形生成系统.docx》由会员分享,可在线阅读,更多相关《基于XML文本的XML树图形生成系统.docx(44页珍藏版)》请在冰豆网上搜索。
基于XML文本的XML树图形生成系统
基于XML文本的XML树图形生成系统
一、使用说明书
1.界面说明
本系统是基于XML文档的XML树图形生成系统,即系统所要完成的主要工作是将用户打开的XML或用户输入的XML文本进行解析,然后以树形方式简单、直观而形象地将XML文档内容显示出来,方便用户查阅。
基于上述需求,我们设计并开发了完整的系统。
本着使用简单,界面简洁直观的原则我们将用户主窗口设计如下图1-1所示
图1-1XML树图形生成系统主窗口
该系统是基于MFC开发的,因此是典型的Windows界面风格。
系统主窗口分为五大部分,标题栏、菜单栏、客户区(文本编辑窗口和图形显示窗口)及状态栏。
如上图所示,系统主窗口最上层一栏是系统标题栏,在此栏上显示文档标题及系统名——XMLTree,左边是三个系统按钮最小化按钮、最大化按钮及关闭按钮。
标题栏下一层是菜单栏,它包括五个主要菜单,File、Edit、Update及Help。
File子菜单包括Windows常用菜单项,例如New、Open、Save、Saveas、Print以及一些浏览历史记录;Edit子菜单包括Undo、Cut、Copy、Paste;Update子菜单包含一个菜单项Update;Help子菜单包括一个菜单项AboutXMLTree。
各个菜单项均对应响应的命令,可以完成相应的功能。
客户区分两个视口左侧是文档编辑窗口,主要用于完成用户文档的编辑工作,用户可以再次输入自己的XML文档,完成相应的编辑工作,用户所打开的现有的XML文档也将显示在该窗口;右侧是图形显示窗口,用户所编辑的XML文档在经过解析以后将以树形方式显示在该窗口。
当然用户可以通过中间的分隔栏调节左右两个视窗的大小以方便文档编辑和图形的显示。
主窗口底部是状态栏,和一般的Windows窗口一样,系统或者用户的一些状态信息将在这里显示。
2.人机交互方法
一个优秀的系统必定为用户提供了一套友好的人机交互界面,我们大部分人所使用的Windows操作系统就是一个典型的案例,目前主流的人机交互方式依然是鼠标键盘方式(部分设备虽然已经使用了音控、手势控制等方式,但因为开发难度大,技术不成熟,所以并未普及)。
本系统采用主流的鼠标键盘式的命令交互方式,用户通过键盘或鼠标操作发出各种命令,如鼠标右键单击消息,键盘按键消息等等。
系统判断出用户发出命令的类型以后做出相应的动作,判断的依据包括用户发出命令的类型,系统当前状态等。
为了更形象的演示本系统使用方法,下面给出了本系统处理人际交互的一些图示,包括主要的几个操作例如文档的打开,保存,图形的显示、更新、结点查找等。
图1-2展示的是File子菜单的各项,当前选中的是Open菜单项,用户通过点击该菜单项可以打开“打开对话框”(图1-3),用户可以从打开对话框中选择自己要编辑的XML文档;当用户发出SaveAs命令或者用户在退出系统前未保存编辑的文档时,系统会显示另存为对话框(图1-4)让用户保存自己的文档。
图1-2File子菜单Open项
图1-3打开对话框
图1-4另存为对话框
用户在完成文档编辑以后想要查看树形图时可以通过Update命令完成,菜单栏上的Update按钮(图1-5)为用户提供了这个功能,当用户点击Update按钮后,系统会完成一系列处理并最终在图形显示窗口中显示树形图。
图1-5Update菜单项
图(1-6)给出了一个示例,文档编辑窗口显示的是用户编辑好的XML文档,当用户发出Update命令以后,系统在图形显示窗口打印出XML文档的树形结构显示。
图1-6案例示例
图(1-7)图(1-8)图(1-9)给出了一个查找示例,在图形显示窗口中点击右键选择查找,然后弹出查找对话框,输入两个“开关”标记,点击确定后在树形结构与其具有“父子”关系的结点将显示为红色。
图1-7查找示例
输入要查找的两个标记:
图1-8查找示例
显示效果:
图1-9查找示例
2、解决方案
系统需求是完成XML文档编辑和从XML文档到树形显示以及文档序列化等功能,其中文档编辑要完成文档输入、保存、修改等功能;图形显示包括XML树的生成及图形显示的功能;文档序列化包括文档的读入与文档的输出。
针对以上需求的简述我们对以上三方面制定了相应的解决方案。
总的来说整个程序将采用MVC三层架构的思想。
其中文档类负责数据的读入、处理、保存,具体到本项目文档类负责XML文档的读入、解析、修改和保存;视图类只负责显示和与用户的交互,具体到本项目我们将定义CXMLTextView和CXMLTreeView分别来负责文本和图形的显示;我们将定义一个CNodeManage类作为控制器类也是树形结构的管理类,它来负责文档和视图类的数据传递和交互工作。
具体来说使用MFC为我们提供的单文档应用程序框架,并将视窗分割为两部分以完成相应的功能;文档视窗分离,同一份文档(xml文本文件)对应两种显示方:
一是以文本形式在文本视图(本项中是CXMLTextView)来显示;二是以树形结构的视图(本项目中是CXMLTreeView)进行显示.
XML文档编辑功能的解决方案:
更改View(CXMLTextView)类的继承关系,使View类继承MFC类库中的CEditView类,CEditView类为我们提供了完备的文本编辑功能,这样文档编辑的相关工作将由这个类完成。
图形显示功能的解决方案:
图形显示要完成的工作是与用户交互和以图形的方式展示XML树。
从XML文档到XML树需要一个解析的过程,在实现这个功能,我们将封装了一个CXMLParse工具类,来负责文档的解析功能,方便我们的使用及增加整个系统的可扩充性和可重用性。
XML树形显示功能,考虑程序的可扩展性和维护性,解析XML文档中的三种元素即标签、属性、文本,我们定义了一个通用的结点基类CUniversalNode,里面封装了三种结点的共同属性和操作。
而CUniversalNode类派生自图元基类CGeometry,CGeometry类是中定义了图元基本操作的接口类。
文档序列化实现:
利用MFC为我们提供的基本视图-文档框架,将我们的XML文档的保存、读入、输出有文档类实现,该类为我们提供了序列化函数,我们只需要重写这些函数然后添加自己相应的代码,从而完成文档的保存和读入。
3、设计思想
在设计我们的系统时充分考虑面向对象设计思路,将经典的设计模式原则和思想运用到我们的系统中去。
设计系统时先考虑问题类别,然后由上而下划分模块,充分保持各模块之间的独立性,职责单一性;另外,在设计类时,考虑各类之间的各种关系,例如,继承、关联等,还要为模块之间通信方式;再有,利用MFC为我们提供的基础类库简化我们的程序设计。
在这里,考虑到我们最终的系统要实现的功能是将用户编辑的XML文档以树形方式显示出来,并提供文档的序列化,这样我们可以使用MFC为我们直接生成一个单文档应用程序,但是,为了实现编辑功能,我们让视图类继承CEdit类,这样我们就拥有了四个MFC提供的类CWinApp类、CMainFrame类、CDocument类及CView类,这四个类之间的设计是MFC为我们提供的我们不需要太多关心它们的设计。
为了在客户区同时兼具文档编辑和图形显示的功能,我们需要将客户区分裂为两个窗口。
所以这里我们还需要一个视图类这里我们声明了一个CXMLTreeView类,这个类继承CScrollView,它将用来显示树形图。
为了解析XML文档,我们添加一个类CXMLParse来实现XML文档的解析工作。
图形显示部分较为复杂,我们需要绘制三种不同形状的结点来表示三种XML文档元素,但是,这三种结点又都具有一些共同的属性方法,所以我们给这三种属性抽象出一个基类CUniversalNode类,它将保存结点的公共属性,例如显示位置、结点区域、结点颜色、结点文本、结点孩子指针等,还包括公共操作,如添加孩子结点和父亲结点等。
这样的设计将有助于程序的扩展与重用。
CUniversalNode下派生出三个类,CElementNode、CAttrNode、CTextNode,分别对标签、属性、文本三种结点。
因为绘制这三种结点方法不同,所以它们需要实现各自的绘制方法,这里用到了多态性。
为方便以上这些结点的管理,我们定义了CNodeManage类,作为Controller用来负责文档类和视图类的数据传递,用来管理CElementNode、CAttrNode、CTextNode三个类,或者说管理由着些类对象组成的树,它要实现的功能包括存储类对象,计算节点输出位置等。
现在考虑类之间关联关系。
我们列举了几个主要的类之间的关系。
其中文档视图类之间的交互已经由MFC为我们提供。
我们重点考虑一下几个类之间的关系:
1、CNodeManage和CXMLParse。
我们在CNodeManage中要生成各种图形结点,并建立结点之间的联系,而初始化XML树生成树结点需要用到解析XML文档得到的结点信息。
二者之间是一种依赖的关系。
2、CNodeManage和CXMLTreeView。
我们要在CNodeManage中计算结点将来显示位置,这样的话我们就需视类指针,确切的说应该是CXMLTreeView类指针,所以,我们在CNodeManage中保存了一个CView指针。
二者直接是一直依赖关系。
3、CNodeManage和CNodeFactory。
我们在CNodeManage中要生成各种图形结点这些结点的由CNodeFactory工厂来创建,所以二者直接是依赖关系。
4、文档类CXMLTreeDoc和CNodeManage。
文档的数据管理需借助于CNodeManage来实现,包括:
XML的解析和序列化之前的保存树结点坐标的操作都由CNodeManage来完成。
二者是一种关联的关系。
5、CFindDlg是用于查找结点的对话框类。
四、系统框架的概述
在我们利用MFC生成一个文档应用程序后,系统为我们提供了CMainFrame、CWinApp、CDocument、CView类,在CMainFrame包含若干CView对象,我们在CMainFrame和CView可以响应用户命令。
CDocument用来维护用户文档,用户在视图类中编辑的文档以后将先存放到CDocument中,视图中显示的文档也由CDocument获得,而从文件中读取的文档也将保存到CDocument中,文档写入文件也由CDocument完成。
CUniversalNode类是结点类的基类,用时实现了图元接口类中定义的函数,其派生类有三个CAtrrNode、CTextNode、CElementNode、这三个结点分别对应属性、文本、标签元素。
这些结点保存相应元素的属性已协助后面操作。
CNodeFactory是工厂类,负责CElementNode、CAttrNode和CTextNode结点的创建工工作。
工厂模式将对象的使用和创建相分离,降低程序的耦合性。
CXMLParse类将完成XML文档的解析,解析完成后会生成一个XML树,CXMLParse提供了一些接口函数,例如得到一个标签的名字等。
CNodeManage类提供了结点管理的函数,例如添加,遍历等,并完成结点见的父子联系。
五、案例文档
1.角色说明
参与者:
使用该程序的用户
系统:
XML文本的XML树图形生成系统
2.
案例说明(事件流)
3.用例图
1.1用例图
1.2用例图描述
用例名称
保存文本图形到文件
用例描述
将用户输入的XML文本内容和其对应的树图形结构保存到文件中
主要流程
1.选择菜单栏中的保存选项
2.选择要保存文件的位置
3.输入保存文件的名称
4.点击保存按钮
用例名称
打开文本图形文件
用例描述
打开用户事先保存的文本图形文件,将其显示在视图中
主要流程
1.选择菜单栏中的打开选项
2.选择要打开文件的保存位置
3.选择要打开文件的名称
4.点击打开按钮
用例名称
更新视图生成XML图形树
用例描述
根据用户在编辑框中输入的XML文本信息,生成对应的树结构
主要流程
1.用户在文本编辑框中输入要转化树的XML文本信息
2.输入完毕后,点击菜单栏中的Update按钮
3.根据XML文本信息,进行XML解析
4.将解析后的信息,以树形结果显示
用例名称
查找指定结点路径
用例描述
用户输入要查找路径的开始和结束标记,将其结果高亮显示
主要流程
1.在视图中点击鼠标右键
2.在弹出的右键快捷菜单中选择查找
3.在弹出的对话框中输入要查找的结点的开始和结束标记
4.将查找路径上的结点高亮显示
用例名称
取消查找路径
用例描述
取消查找结点的高亮显示
主要流程
1.在视图中点击鼠标右键
2.在弹出的右键菜单中选择清除查找路径
3.取消查找路径结点的高亮显示
用例名称
输入XML文档
用例描述
用户在编辑框中输入带转换成树的XML文档信息
主要流程
1.在文本编辑框中输入XML文档信息
用例名称
拖动树节点
用例描述
用户在视图窗口中拖动树节点,其对应的分支跟随其一起移动
主要流程
1.按下鼠标左键选中树中的一个结点
2.拖动选中的结点移动
3.结点的分支跟随其一起移动
用例名称
创建元素结点
用例描述
根据XML解析的结果,创建元素结点
主要流程
1.取出XML解析的结果
2.判断结果中的XML结点信息是否为元素结点
3.根据解析得到的元素结点名称创建结点类
用例名称
创建文本结点
用例描述
根据XML解析的结果,创建文本结点
主要流程
1.取出XML解析的结果
2.判断结果中的XML结点信息是否为文本结点
3.根据解析得到的文本结点名称创建文本类
用例名称
创建属性结点
用例描述
根据XML解析的结果,创建属性结点
主要流程
1.取出XML解析的结果
2.判断结果中的XML结点信息是否为属性结点
3.根据解析得到的属性结点名称创建属性类
六、静态模型
1.类图
注:
详细类图见附录一
2.类文档(属性、方法)
1、CUniversalNode类
私有属性:
共有属性:
保护属性:
CObListm_listChild;//所有孩子结点指针
CUniversalNode*m_pParent;//父亲结点指针
CPointm_centerPos;//该结点的位置信息
CSizem_Size;//结点所占区域范围
CStringm_strContent;//该结点显示的文本内容
COLORREFm_bgColor;//结点背景颜色
COLORREFm_textColor;//字体颜色
intm_iID;//结点ID
CPointm_ParentPos;//父节点位置---该变量用于序列化存储
CArray
CUniversalNode();
私有方法:
共有方法:
CUniversalNode(CStringcontent,intx=0,inty=0);
voidaddSon(CUniversalNode*son=NULL);
voidsetParent(CUniversalNode*parent=NULL);
voidstorePosInfo();
voidbuildRelation(CNodeManage*nodeManage=NULL);
~CUniversalNode();
friendCNodeManage;
保护方法:
2、CGeometry类
私有属性:
共有属性:
保护属性:
私有方法:
共有方法:
virtualBOOLclickTest(CPointpoint)=0;//点击检测
virtualvoidDraw(CDC*pdc=NULL)=0;//绘图
virtualvoidoffset(intcx=0,intcy=0)=0;//位移
保护方法:
3、CElementNode类
私有属性:
共有属性:
保护属性:
私有方法:
共有方法:
CElementNode(CStringcontent,intx=0,inty=0);
virtualBOOLclickTest(CPointpoint);
virtualvoidDraw(CDC*pdc=NULL);
virtualvoidSerialize(CArchive&ar);
virtualvoidoffset(intcx=0,intcy=0);
virtual~CElementNode();
保护方法:
4、CAttrNode类
私有属性:
共有属性:
保护属性:
私有方法:
共有方法:
CAttrNode(CStringcontent,intx=0,inty=0);
virtualBOOLclickTest(CPointpoint);
virtualvoidDraw(CDC*pdc=NULL);
virtualvoidSerialize(CArchive&ar);
virtualvoidoffset(intcx=0,intcy=0);
virtual~CAttrNode();
保护方法:
CAttrNode();
5、CTextNode类
私有属性:
共有属性:
保护属性:
私有方法:
共有方法:
CTextNode(CStringcontent,intx=0,inty=0);
virtualBOOLclickTest(CPointpoint);
virtualvoidDraw(CDC*pdc=NULL);
virtualvoidSerialize(CArchive&ar);
virtualvoidoffset(intcx=0,intcy=0);
virtual~CTextNode();
保护方法:
CTextNode();
6、CNodeManage类
私有属性:
共有属性:
staticCNodeManage*m_nodeManage;//存储结点
CUniversalNode*m_selectedNode;
CUniversalNode*m_root;//树根结点
CObListm_listNodes;//树种各个结点
CView*m_view;//树形图形的父视图
保护属性:
私有方法:
voidlevelTraversal();
voiddepthTraversal(CXMLParse*parse,IXMLDOMNodePtrcurrent,
intdepth,CUniversalNode*parent=NULL);
intsetLocation_X(intnum=0);
intsetLocation_Y(intdepth=0);
共有方法:
staticCNodeManage*getInstance();
voidsetTreeRoot(CUniversalNode*root=NULL);
CUniversalNode*getTreeRoot();
voidinitTreeFromXML(CXMLParse*parse=NULL);
voidaddTreeNodes(CUniversalNode*parent=NULL,CUniversalNode*son=NULL);
voidshowTree(CView*view=NULL,CDC*pdc=NULL);
voidDestroyTree();
virtualBOOLclickTest(CPointpoint);
virtualvoidDraw(CDC*pdc=NULL);
virtualvoidoffset(intcx=0,intcy=0);
voidtreeNodesLink(CUniversalNode*node=NULL,CDC*pDC=NULL);
BOOLfindNodes(CStringaStart,CStringaEnd);
voidclearFindPath();
voidstoreTree();//用于序列化
voidrestoreTree();//用于反序列化
保护方法:
CNodeManage();
7、CNodeFactory类
私有属性:
共有属性:
保护属性:
私有方法:
共有方法:
CNodeFactory();
CUniversalNode*getElementNode(CStringcontent,intx=0,inty=0);
CUniversalNode*getAttrNode(CStringcontent,intx=0,inty=0);
CUniversalNode*getTextNode(CStringcontent,intx=0,inty=0);
virtual~CNodeFactory();
保护方法:
7、CXMLParse类
私有属性:
IXMLDOMDocumentPtrm_pDoc;//文档对象
IXMLDOMElementPtrm_pRoot;//文档根共有属性:
保护属性:
私有方法:
共有方法:
CXMLParse();
BOOLstartParse(CStringpath,intdataSource);//1:
LoadsanXMLdocumentfromthe//specifiedlocation.
IXMLDOMElementPtrgetDocumentRoot();
voidgetElementName(IXMLDOMNodePtrelement,CString&str);
intgetElementAttr(IXMLDOMElementPtrelement,CMapStringToString&attr);
voidgetElementText(IXMLDOMNodePtrelement,CString&str);
BOOLhasChildren(IXMLDOMNodePtrelement);
BOOLhasAttribute(IXMLDOMNodePtrelement);
BOOLisNodeText(IXMLDOMNodePtrelement);
BOOLiSNodeElement(IXMLDOMNodePtrelement);
intgetChildren(IXMLDOMElementPtrelement,IXMLDOMNodeListPtr&children);
virtua
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 基于 XML 文本 图形 生成 系统
![提示](https://static.bdocx.com/images/bang_tan.gif)