一种基于可视化建模网页布局代码生成方法技术

技术编号:25521014 阅读:42 留言:0更新日期:2020-09-04 17:11
本发明专利技术提出一种基于可视化建模网页布局代码生成方法,采用<table>来进行布局的定位;设定好每一网页元素的绝对坐标为P(X,Y,W,H),(X,Y)代表网页元素的起点,(W,H)代表网页元素的长度和宽度;遍历所有网页元素,计算得到其尺寸最大公约数,即(Wmax,Hmax);将<table>布局中的<td>元素的“width”设为Wmax,“height”设为Hmax;根据网页元素的绝对坐标P(X,Y,W,H)和尺寸最大公约数(Wmax,Hmax),换算成网页元素的相对尺寸(Wc=W/Wmax,Hc=H/Wmax),即网页元素的“width”占Wc个单元格,“height”占Hc个单元格;在代码上输出<td colspan="Wc"rowspan="Hc">元素的HTML代码</td>。

【技术实现步骤摘要】
一种基于可视化建模网页布局代码生成方法
本专利技术涉及一种基于可视化建模网页布局代码生成方法。
技术介绍
模型驱动架构(MDA)是一种在企业软件开发的关键技术,能够创建出机器可读和高度抽象的模型,这种模型通过转换(Transformation)技术可自动转换为代码,从而提高软件开发效率,增强软件的可移植性、协同工作能力和可维护性。可视化建模是MDA的核心技术之一,可以让开发人员、实施人员或者系统管理员根据客户的需求通过拖拉拽的方式画出网页的元素,免去了手写代码的工作量,还能减少出错率,这种“所见即所得”的可视化建模方式大大提升了软件开发与实施的效率。然而,在将模型转换为可运行的代码后,在显示大文本数据时,会造成网页界面变形,或者信息展示不全。例如,目前常见两种技术方案:一种是在建模时候,采用绝对定位来布局网页,在生成运行网页的时候,也采用绝对定位的布局生成网页元素。建模采用绝对定位来布局网页,有利于用户的拖拉拽操作,用户想将网页元素拖到哪里就拖到哪里。在运行时候使用绝对定位的布局,利用<DIV></DIV>的CS本文档来自技高网...

【技术保护点】
1.一种基于可视化建模网页布局代码生成方法,其特征在于:整体网页采用<table>来进行布局的定位;其中包括网页建模步骤和网页代码生成步骤;/n所述网页建模步骤是:/n设定好每一网页元素对应绝对坐标为P(X,Y,W,H),X代表网页元素的起点相对网页零坐标的X向像素距离,Y代表网页元素的起点相对网页零坐标的Y向像素距离,W代表网页元素的长度,W代表网页元素的宽度;/n所述网页代码生成步骤是:/n遍历所有网页元素,计算得到其尺寸最大公约数,即(Wmax,Hmax);/n将<table>布局中的<td>元素的“width”设为Wmax,“height”设为Hma...

【技术特征摘要】
1.一种基于可视化建模网页布局代码生成方法,其特征在于:整体网页采用<table>来进行布局的定位;其中包括网页建模步骤和网页代码生成步骤;
所述网页建模步骤是:
设定好每一网页元素对应绝对坐标为P(X,Y,W,H),X代表网页元素的起点相对网页零坐标的X向像素距离,Y代表网页元素的起点相对网页零坐标的Y向像素距离,W代表网页元素的长度,W代表网页元素的宽度;
所述网页代码生成步骤是:
遍历所有网页元素,计算得到其尺寸最大公约数,即(Wmax,Hmax);
将<table>布局中的<td>元素的“width”设为Wmax,“height”设为Hm...

【专利技术属性】
技术研发人员:张大志史玉洁袁志远吴恺欧阳少海喻勋勋
申请(专利权)人:广东飞企互联科技股份有限公司
类型:发明
国别省市:广东;44

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1