网页应用程序产生器的制作方法

文档序号:6652149阅读:216来源:国知局

专利名称::网页应用程序产生器的制作方法
技术领域
:本发明是关于网页编写工具,其特别是关于利用现行视窗口应用程序发展工具来实现网页应用程序产生器,提供以拖曳控件组件及Form-based方式,来制作出网页应用程序。公知网页的制作方式中,最传统方式是直接使用文本编辑器(texteditor)编辑由DHTML所组成的网页程序,但是得花好长时间,才能以HTML语言撰写出略复杂的程序接口。近来,一些图形化的网页制作工具,虽提供较为便利的操作,但都是以content-based方式制作网页应用(webapplication),虽能在较快速的时间内制作完成一网页程序,然而使用这些公知网页制作工具的使用者,最好是非常熟悉DHTML语言,否则往往受限于公知网页制作工具的制作网页的能力,而无法尽其发挥使用者要在网页执行所展现的功能,而且所开发完成的网页应用系统,由于操作性可能不够完善,使得在操作网页应用系统时,得频频换页、拉scrollbar…等,且如果使用到ActiveControl或JavaApplet编辑的互动性程序接口时,其出现既不容易维护,下载时间又久等缺点。另一方面,对于使用者需花费精力熟悉DHTML语言,这也是一种负担及时间成本的消耗。本发明目的是提供在图形用户接口视窗作业环境,以类似如VisualBasic软件开发环境进行网页应用程序的开发。为解决上述目的,本发明提供一种网页应用程序产生器,其包括复数个控件的工具列,用于提供一使用者选取及编辑该复数个控件,其中该工具列的每一个控件及每一个该经选取及编辑后的控件,都是以一GUI表述所组成;一个转译器(translator),用以将每一个以GUI表述的控件转换为对应的中间表述(intermediaterepresentation);一个表述转换表(presentationmappingtable),用以指定如何将中间表述转换为DHTML的规则,使得以GUI表述的控件依据该表述转换表转换为对应以DHTML表述的控件;一个逻辑动作转换表(logicalpartmappingtable),用以指定如何将中间表述转换为对应至一事件处理机(eventhandler)及产生一指令(statement)的规则;一个生成器(generator),用以将每一个以GUI表述的控件,依据该表述转换表及该逻辑动作转换表,生成对应于每一个控件的DHTML表述及其所结合的对应的事件处理机(eventhandler)及指令(statement)。附图简单说明图1为本发明的构架图。图2为依据本发明,其利用VirtualBasic环境完成较佳实施例的产生器,在一计算机执行的状态示意图。图3为使用本发明制作一客户基本资料查询的网页应用程序实施例。图中10转译器11生成器12表述转换表13逻辑动作转换表14GUI表述控件文件15中间表述控件文件16DHTML应用程序文件20工具列为使熟悉该项技术人士了解本发明的目的、特征及功效,由下述具体实施例,并配合所附的附图,对本发明详细说明如下依据本发明的产生器,其可以利用选择现行类似如VisualBasic及Delphi的视窗应用程序发展工具(windowapplicationdevelopmenttools)来编写(coding)产生器的程序代码。因此,本发明所提供的复数个控件(如图2工具列20所示),是先以GUI表述的方式定义每一个控件的实质内容。本发明采用GUI表述的原因,是配合视窗应用程序发展工具,其被称为整合式开发环境(integrateddevelopmentenvironment),该发展工具使用档案形式以储存表述格式(formrepresentation)的内容,例如在VisualBasic(以下简称VB)及Delphi的窗口应用程序发展工具下,GUI表述分别是指VB表述及Delphi表述。例如使用于VB及Delphi的卷标控件(label)的范例,其表述如下图1为本发明的构架图。图1的GUI表述控件文件14,其储存的内容是为以GUI表述的复数个控件,其中该复数个控件是使用者执行图2的产生器,经选取及编辑工具列20中的控件,来制作一网页应用程序。转译器(translator)10将GUI表述控件文件14的每一个控件转换为中间表述控件文件15。生成器(generator)11依据表述转换表(presentationmappingtable)12及逻辑动作转换表(logicalpartmappingtable)13,将中间表述控件文件15生成为DHTML应用程序文件16,并且DHTML应用程序文件16结合对应的事件处理机(eventhandler)及指令(statement)。其中表述转换表12具有如何将中间表述转换为DHTML的复数个规则(rules),其使得以GUI表述的控件依据该表述转换表12转换为对应以DHTML表述的控件。其中逻辑动作转换表13具有如何将中间表述转换为对应至一事件处理机(eventhandler)及产生一指令(statement)的规则(rules)。图2为依据本发明,其利用VisualBasic环境完成较佳实施例的产生器,在一计算机执行的状态示意图。图2工具列20的复数个控件,其可由使用者选取及编辑所选取的控件内容,在最短时间内就能以拖曳方式制作出网页应用程序。本发明的复数个控件能够涵盖DHTML定义下的所有网页应用程序。由于Web-based的应用软件,主要用作为商业模式的网络解决方案(Thee-SolutionOfBusinessModel),所以常用的控件经常是重复使用,因此本发明将许多常用的组件设定成为固定的"格式"。节省下许多程序设计师的使用者在发展系统的时间,但是也考虑到许多满足不同使用者的需求时所需要的弹性,因此本发明提供一组完善的控件,其如图2在工具列20所显示的复数个控件,分别说明如下.卷标(label)控件用来显示文字,使用者不能编辑修改内容,其类同VisualBasic中的Label。.文本框(textbox)控件由使用者或窗体所设定的资料,除继承VisualBasic"TextBox"属性之外,并新增属性“UniRequired",以定义此字段是否必须输入资料。.复选框(checkbox)控件显示一个项目的选择状态,其继承VisualBasic"CheckBox"的属性。.选项框(optionbox)控件显示在一个群组中所选择的项目状态,只能选择群组中的一个项目,不能重复选取,其继承VisualBasic"OptionButton"的属性。.列表框(listbox)控件列表式方框选单,显示一个目录的值,让使用者选择一个或多个,除继承VisualBasic"ListBox"的属性外,并新增属性"ItemData",可在该新增属性中输入选单数据,每笔数据间以"空白"或"分号"做分隔。.组合框(combobox)控件下拉式选单,继承VisualBasic"ComboBox"的属性,利用"ItemData"属性输入选单数据。.群定位(sstab)控件在单一的窗体中提供一个能呈现数个对话方框或信息窗口在一个使用相同接口的简易方法。在SSTab控件中提供一个tab的群组,对其他的控件来说,每一个tab就像是一个Container。同一时间中只有一个tab是活跃的,显示其所包含的控件给使用者看,其余tab的控件都会隐藏起来,其继承VisualBasic"SSTab"的属性。.框(frame)控件提供一个可证明为同一群组的控件。举例来说,可以使用框(frame)控件来细分一个窗体—区隔OptionButton控件的群组。.命令钮(commandbutton)控件使用在开始、中断或结束的一个程序,可用来呼叫某个事件、函数或方法,其继承VisualBasic"CommandButton"的属性。.复选框(checkbox)控件显示一个项目的选择状态,其继承VisualBasic"CheckBox"的属性。.栅格(grid)控件其就像是一个二维数组的TextBox,用来显示及运算表格的资料,它能够完整地做排序、合并及格式化表格内的字符串,其继承MSDataGridLib.DataGrid.的属性。.树状(treeview)控件显示一个有等级制度的结点对象,每一个结点都是一个卷标(Label)及非必须的位图层组成。一个treeview是典型的过去层显示在一个文件的标题,加入一个索引、档案及在磁盘中的目录,或其它任何种类可能有用的信息显示出一个层级,其继承MSComctlLib"TreeView"的属性。.选择列(selectedlist)控件可多选的交换性方框,右边为被选取的数据,其在"ItemData"属性中输入左边选项数据,每笔数据间以"空白"或"分号"做分隔,及在"ItemData2"属性中输入右边选项数据,每笔数据间以"空白"或"分号"做分隔。.排序列(sortlist)控件数据排序方框,其在"ItemData"属性中输入选单数据,每笔数据间以"空白"或"分号"做分隔。.超级链接(hyperlink)控件超级链接,为文字做超级链接用,其提供"Caption"以输入要显示的文字及"UniURL"为超级链接的路径,例如输入"http//www.abc.com.tw/"绝对路径。.文件说明(menureference)控件透过"菜单编辑器(MenuEditor)"定义Menubar给所欲制作的网页(webpage)。.条件框(conditionalframe)控件条件式的Frame控件,在条件成立时才会出现此Frame及同一群组的Control,其提供"UniExpression"属性中可设定条件表达式,它将会判断其值为True或False。.日历(calendarbox)控件输入日期的文字框,可呼叫月历供User点选输入。.执行式文本框(advancedtextbox)控件提供查询的文字框,取TextBox中的值至后端执行后,以所设定的方式显示结果。.输入html(inlineHTML)控件提供使用者可直接在档案中自行加入HTML的程序代码。.结果表(resulttable)控件其用法与栅格控件相似,但结果表控件新增了第一笔、上一笔、下一笔、最后一笔及笔数的命令钮控件。.加载html(externalHTML)控件在执行时加载(Include)另一程序文件至程序中。.查询条件框(queryconditionframe)控件其功能与框控件相同,但新增四个按钮查询按钮、清除按钮、新增按钮、离开按钮。图3显示使用本发明制作一客户基本资料查询的网页应用程序实施例。由图3的网页应用程序实施例显示出,使用者由工具列20中选取一个框控件、三个文本框控件及四个命令钮控件。以下所示图3的框控件、其中一个的文本框控件,其以VB表述作为GUI表述的实施例框控件的VB表述实施例<prelisting-type="program-listing"><![CDATA[Beginopcontrols.QueryConditionFrameQueryFramelHeight=2295Left=720Top=360Width=6135Caption="客户基本资料查询"UniAccessKey=""UniDataTarget="MajorFrame"UniOperationTarget="MajorFrame"UniOutputStyle="Frame"UniProgID=""UniCommand=""UniActionURL=""UniQueryStrings=""UniDialogProp=""UniDoesSubmitUniMSG="Yes"Beginopcontrols.LabelLabel1Height=285Left=360Top=480Width=975Alignment=0Caption="客户编号"UniAccessKey=""EndBeginopcontrols.LabelLabel2Height=285Left=360Top=1080Width=855Alignment=0Caption="客户姓名"UniAccessKey=""EndBeginopcontrols.LabelLabel3Height=285Left=360Top=1680Width=855Alignment=0Caption="入会日期"UniAccessKey=""EndEnd]]></pre>其中一个的文本框控件的VB表述实施例Beginopcontrols.TextBoxCustNameHeight=375Left=1440TabIndex=2ToolTipText="例如张三"Top=960Width=3255Text=""UniAccessKey=""UniRequired=0’FalseEditable=-1’TrueEnd上述图3的客户基本资料查询网页应用程序的控件,其以上述VB表述实施例作为GUI表述,经转译器10转译为如下的中间表述实施例<prelisting-type="program-listing"><![CDATA[<XqueryConditionFrameName="QueryFramel"Height="2295"Left="720"TabIndex="3"TabStop="0"Top="360"Width="6135"Caption="客户基本资料查询"UniAccessKey=""UniDataTarget="MajorFrame"UniOperationTarget="MajorFrame"UniOutputStyle="Frame"UniProgID=""UniCommand=""UniActionURL=""UniQueryStrings=""UniDialogProp=""UniDoesSubmitUniMSG="Yes"><XLabelName="Label1"Height="285"Left="360"Top="480"Width="975"Alignment="0"Caption="客户编号"UniAccessKey=""/><XLabelName="Label2"Height="285"Left="360"Top="1080"Width="855"Alignment="0"Caption="客户姓名"UniAccessKey=""/><XLabelName="Label3"Height="285"Left="360"Top="1680"Width="855"Alignment="0"Caption="入会日期"UniAccessKey=""/><XTextBoxName="CustNo"Height="375"Left="1440"TabIndex="1"ToolTipText="例如A1234567"Top="360"Width="3255"Text=""UniAccessKey=""UniRequired="0"Editable="-1"/><XTextBoxName="CustName"Height="375"Left="1440"TabIndex="2"ToolTipText="例如张三"Top="960"Width="3255"Text=""UniAccessKey=""UniRequired="0"Editable="-1"/><XTextBoxName="StartDate"Height="375"Left="1440"TabIndex="3"ToolTipText="例如2000/11/12"Top="1560"Width="3255"Text=""UniAccessKey=""UniRequired="0"Editable="-1"/></XQueryConditionFrame>]]></pre>上述中间表述实施例,经生成器12生成对应图3客户基本资料查询网页应用程序的DHTML程序实施例如下<prelisting-type="program-listing"><![CDATA[<!--BeginQueryConditionFrame--><TABLEBORDER=0ID=QueryFramelACCESSKEY=""STYLE="positionabsolute;height153px;left24px;top48px;width345px;"CELLSPACING=0CELLPADDING=0><TR><TDHEIGHT=20WIDTH=10CLASS=cSYS_FrameLeft>&amp;nbsp;</TD><TDNOWRAPCLASS=cSYS_FrameCaptionBG><SPANCLASS=cSYS_FrameCaption>客户基本资料查询</SPAN></TD><TDCLASS=cSYS_FrameRightWIDTH="*">&amp;nbsp;</TD></TR><TR><TDCLASS=cSYS_FrameBodyCOLSPAN=3HEIGHT="*">&amp;nbsp;<SPANID=Label1ACCESSKEY=""CLASS=cSYS_LabelSTYLE="positionabsolute;left24px;top32px;">客户编号</SPAN><INPUTTYPE=TEXTID=CustNoTABINDEX=1ACCESSKEY=""TITLE="例如A1234567"CHECKED=0CLASS=cSYS_TextBoxSTYLE="positionabsolute;width217px;left96px;top24px;"VALUE=""ONCHANGE="textBox_onChange(this);"ONBLUR="textBox_onChange(this);"ONMOUSEOUT="textBox_onChange(this);"><INPUTTYPE=TEXTID=CustNameTABINDEX=2ACCESSKEY=""TITLE="例如张三"CHECKED=0CLASS=cSYS_TextBoxSTYLE="positionabsolute;width217px;left96px;top64px;"VALUE=""ONCHANGE="textBox_onChange(this);"ONBLUR="textBox_onChange(this);"ONMOUSEOUT="textBox_onChange(this);"></TD></TR></TABLE><TABLEBORDER=0CELLSPACING=0CELLPADDING=0STYLE="positionabsolute;top48px;left373px;height153px;width60px;"><TR><TDALIGN=CENTERVALIGN=TOP><INPUTTYPE=BUTTONID=QueryFrame1_QueryCLASS=cSYS_QueryButtonVALUE="查询"ONCLICK="QueryFrame1_Cmd_onClick(’Query’);"><INPUTTYPE=BUTTONID=QueryFrame1_ClearCLASS=cSYS_QueryButtonVALUE="清除"ONCLICK=QueryFrame1_Cmd_onClick(’Clear’);"><INPUTTYPE=BUTTONID=QueryFrame1_ewCLASS=cSYS_QueryButtonVALUE="新增"ONCLICK="QueryFrame1_Cmd_onClick(’New’);"><BR><BR><INPUTTYPE=BUTTONID=QueryFrame1_ExitCLASS=cSYS_QueryButtonVALUE="离开"ONCLICK="QueryFrame1_Cmd_onClick(’Exit’);"></TD></TR></TABLE>&amp;nbsp;<!--EndQueryConditionFrame-->]]></pre>生成器12所依据的表述转换表12,以生成对应图3客户基本资料查询网页应用程序的DHMTL程序实施例,该表述转换表12实施例如下<prelisting-type="program-listing"><![CDATA[<QueryConditionFrameFamily="Frame"><Presentation><DHTML><![CDATA[<TABLEBORDER=0ID=$NAME$TITLE="$TOOLTIP$"STYLE="positionabsolute;height$HEIGHT$px;width$WIDTH$px;left$LEFT$px;top$TOP$px;"CELLSPACING=0CELLPADDING=0><TR>@GetFrameCaptionLine("$CAPTION$")@$CONTAINEE$</TR></TABLE><TABLEBORDER=0CELLSPACING=0CELLPADDING=0STYLE="positionabsolute;top$TOP$px;left@MinusFixedLen($WIDTH$+$LEFT$,60)@px;height$HEIGHT$px;width60px;"><TR><TDALIGN=CENTERVALIGN=TOP><INPUTTYPE=BUTTONID=$NAME$_QueryCLASS=cSYS_QueryButtonVALUE="#CAP_QUERY#"$EVENTHANDLER_ATTRIBUTES_QUERY$><INPUTTYPE=BUTTONID=$NAME$_ClearCLASS=cSYS_QueryButtonVALUE="#CAP_CLEAR#"$EVENTHANDLER_ATTRIBUTES_CLEAR$><INPUTTYPE=BUTTONID=$NAME$_NewCLASS=cSYS_QueryButtonVALUE="#CAP_NEW#"$EVENTHANDLER_ATTRIBUTES_NEW$><BR><BR><INPUTTYPE=BUTTONID=$NAME$_ExitCLASS=cSYS_QueryButtonVALUE="#CAP_EXIT#"$EVENTHANDLER_ATTRIBUTES_EXIT$></TD></TR></TABLE>&amp;nbsp;]]></DHTML></Presentation></QueryConditionFrame>]]></pre>生成器12所依据的逻辑动作转换表13,以生成对应图3客户基本资料查询网页应用程序的DHMTL程序实施例,该逻辑动作转换表13实施例如下<prelisting-type="program-listing"><![CDATA[<QueryConditionFrameFamily="Frame"><Logic><ExtraAttributeName="EVENTHANDLER_ATTRIBUTES_QUERY"><DHTML><![CDATA[ONCLICK="$NAME$_Cmd_onClick(’Query’);"]]></DHTML><SCRIPT><![CDATA[/*possilbevaluesofcmdQuery,Clear,New,Exit*/function$NAME$_Cmd_onClick(cmd){}]]></SCRIPT></ExtraAttribute><ExtraAttributeName="EVENTHANDLER_ATTRIBUTES_CLEAR"><DHTML><![CDATA[ONCLICK="$NAME$_Cmd_onClick(’Clear’);"]]></DHTML></ExtraAttribute><ExtraAttributeName="EVENTHANDLER_ATTRIBUTES_NEW"><DHTML><![CDATA[ONCLICK="$NAME$_Cmd_onClick(’New’);"]]></DHTML></ExtraAttribute><ExtraAttributeName="EVENTHANDLER_ATTRIBUTES_EXIT"><DHTML><![CDATA[ONCLICK="$NAME$_Cmd_onClick(’Exit’);"]]></DHTML></ExtraAttribute></Logic></QueryConditionFrame>]]></pre>生成器12所生成图3客户基本资料查询网页应用程序的DHTML程序实施例,其进一步一CSS(cascadingstylesheet)表述合并,该CSS表述实施例如下<prelisting-type="program-listing"><![CDATA[.cSYS_FrameLeft{height10px;border-stylegroove;border-width2px;border-bottom;border-right;}.cSYS_FrameCaption{background#E8E1BB;positionabsolute;top-8px;font-size15px;z-index2;}.cSYS_FrameCaptionBG{}.cSYS_FrameRight{height10px;border-stylegroove;border-width2px;border-left;border-bottom;}.cSYS_FrameBody{font-family’新细明体’;font-size15px;border-stylegroove;border-width2px;border-top}.cSYS_Label{font-family’新细明体’;font-size15px;}.cSYS_TextBox{height23px;font-family’新细明体’;font-size15px;}.cSYS_QueryButton{font-family’新细明体’;background#E8E1BB;font-size15px;width60px;height23px;}]]></pre>虽然本发明已以一较佳实施例所示如上,然其并非用以限定本发明,任何熟悉此技术者,在不脱离本发明的精神和范围内所作各种修饰和润饰都视为本申请专利范围内。权利要求1.一种网页应用程序产生器,其包括复数个控件的工具列,用于提供一使用者选取及编辑的该复数个控件,其中该工具列的每一个控件及每一个该经选取及编辑后的控件,都是以一GUI表述所组成;一个转译器(translator),用以将每一个以GUI表述的控件转换为对应的中间表述(intermediarepresantation);一个表述转换表(presentationmappingtable),用以指定如何将中间表述转换为DHTML的规则,使得以GUI表述的控件依据该表述转换表转换为对应以DHTML表述的控件;一个逻辑动作转换表(logicalpartmappingtable),用以指定如何将中间表述转换为对应至一事件处理机(eventhandler)及产生一指令(statement)的规则;一个生成器(generator),用以将每一个以GUI表述的控件,依据该表述转换表及该逻辑动作转换表,生成对应于每一个控件的DHTML表述及其所结合的对应的事件处理机(eventhandler)及指令(statement)。2.如权利要求1所述的生成器,其中该GUI表述为VisualBasic表述。3.如权利要求1所述的生成器,其中该GUI表述为Delphi表述。4.如权利要求1所述的生成器,其中该中间表述为符合XML标准的表述。5.如权利要求1所述的生成器,其中该生成器所生成的对应于每一个控件的DHTML表述,其进一步与一CSS(cascadingstylesheet)表述合并。6.如权利要求1所述的生成器,其中该复数个控件分别为卷标(label)控件、文本框(textbox)控件、复选框(checkbox)控件、选项框(optionbox)控件、列表框(listbox)控件、组合框(combobox)控件、群定位(sstab)控件、框(frame)控件、命令钮(commandbutton)控件、(checkbox)控件、栅格(grid)控件、树状(treeview)控件、选择列(selectedlist)控件、排序列(sortlist)控件、超级链接(hyperlink)控件、文件说明(menureference)控件、条件框(conditionalframe)控件、日历(calendarbox)控件、执行式文本框(advancedtextbox)控件、输入html(inlineHTML)控件、结果表(resulttable)控件、加载html(externalHTML)控件及查询条件框(queryconditionframe)控件。全文摘要本发明提供一种网页应用程序产生器,包括:复数个控件的工具列,工具列的每一个控件及每一个经选取及编辑后的控件,都是以一GUI表述所组成;一个转译器,将每一个以GUI表述的控件转换为对应的中间表述;一个表述转换表,指定如何将中间表述转换为DHTML的规则;一个逻辑动作转换表,指定如何将中间表述转换为对应至一事件处理机及产生一指令的规则;一个生成器,将每一个以GUI表述的控件,生成对应于每一个控件的DHTML表述及其所结合的对应的事件处理机及指令。文档编号G06F9/45GK1371049SQ0110384公开日2002年9月25日申请日期2001年2月22日优先权日2001年2月22日发明者陈恭,张志祥申请人:三慧科技股份有限公司
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1