[发明专利]生成HTML程序代码的方法和装置

说明书

技术领域

本发明涉及WEB页面开发技术，具体涉及一种生成HTML程序代码的方法和装置。

背景技术

在WEB页面开发过程中，通常是WEB页面设计人员针对产品项目的具体需求进行设计稿（即图片，如利用PHOTOSHOP设计的图片）的制作工作，之后，WEB代码开发人员对制作好的设计稿进行切图处理，并针对切图处理后形成的多个图片进行HTML程序代码的编写工作；WEB代码开发人员将编写完成的HTML程序代码上线（如设置到相应的网站服务器中）。

发明人在实现本发明过程中发现，除了大型的产品项目之外，还存在一些存活期较短（如一两天）的小产品项目（如举办活动类的产品等），这种类型的产品项目的特点包括：通常是针对节日或者特殊事件、需求有时候比较紧急、产品对应的页面在上线后被使用的时间较短、对HTML程序代码质量要求不高以及不需要后期的维护和升级等。如果利用现有的WEB页面开发方式对上述类型的产品项目进行HTML程序代码编写，有时会存在不能快速响应开发需求的问题，因此，WEB页面开发效率有待于进一步提高。

发明内容

鉴于上述问题，提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的生成HTML程序代码的方法以及相应的生成HTML程序代码的装置。

依据本发明的一个方面，提供了一种生成HTML程序代码的方法，该方法包括：获取图片所包含的各图层，获取各图层的位置属性信息，并将所述各图层分别转换为图片格式；根据各图层中的非背景图层的位置属性信息确定页面宽度；根据各图层中的非背景图层的位置属性信息将各非背景图层划分为至少一组，且一组中的各图层之间具有区域包含关系；根据所述图片的设计宽度和所述页面宽度调整各组中各图层的位置属性信息；根据各图层的位置属性信息和各图片格式的图层的存储路径信息生成HTML程序代码，且一组图层对应HTML程序代码中的一个节点。

根据本发明的另一方面，提供了一种生成HTML程序代码的装置，该装置包括：获取模块，适于获取图片所包含的各图层，获取各图层的位置属性信息，并将所述各图层分别转换为图片格式；确定页面宽度模块，适于根据各图层中的非背景图层的位置属性信息确定页面宽度；组划分模块，适于根据各图层中的非背景图层的位置属性信息将各非背景图层划分为至少一组，且一组中的各图层之间具有区域包含关系；调整模块，适于根据图片的设计宽度和所述页面宽度调整各组中各图层的位置属性信息；代码生成模块，适于根据各图层的位置属性信息和各图片格式的图层的存储路径信息生成HTML程序代码，且一组图层对应HTML程序代码中的一个节点。

本发明的生成HTML程序代码的方法以及装置通过获取WEB页面设计图片的各图层以及各图层的位置属性信息，对图层进行图片格式转换处理，并基于图层的位置属性信息进行图片格式的图层的分组处理以及位置调整处理等，使划分出的图层组与HTML程序代码中的节点相对应，且图片格式的各图层的位置能够较好的适应实际WEB页面的分辨率；从而本发明能够针对WEB页面设计人员设计出的图片自动生成HTML程序代码，在很大程度上提高了WEB页面的开发效率。

上述说明仅是本发明技术方案的概述，为了能够更清楚了解本发明的技术手段，而可依照说明书的内容予以实施，并且为了让本发明的上述和其它目的、特征和优点能够更明显易懂，以下特举本发明的具体实施方式。

附图说明

通过阅读下文优选实施方式的详细描述，各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。说明书附图仅用于示出优选实施方式的目的，而并不认为是对本发明的限制。而且在整个附图中，用相同的参考符号表示相同的部件。在附图中：

图1示出了根据本发明实施例一的生成HTML程序代码的方法流程图；

图2示出了根据本发明实施例一的图片示意图；

图3示出了根据本发明实施例一的图层示意图；

图4A-图4H示出了根据本发明实施例一的图片格式的各图层示意图；

图5示出了根据本发明实施例二的生成HTML程序代码的装置示意图。

具体实施方式

下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本发明公开的示例性实施例，然而应当理解，可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本公开，并且能够将本公开的范围完整的传达给本领域的技术人员。

实施例一、生成HTML程序代码的方法。下面结合图1-图4对本实施例的方法进行详细说明。