一种生成网页页面的方法及装置的制造方法_3

文档序号:9304422阅读:来源:国知局
4]第一,如果该图层的类型为文字图层,则获取该图层中包括的文字内容,将获取的文字内容确定为该图层包括的素材。
[0085]例如,图层I的类型为文字图层,获取图层I中包括的文字内容“今日晴转多云,微风2-3级”,将获取的文字内容“今日晴转多云,微风2-3级”确定为图层I包括的素材。
[0086]第二,如果该图层的类型为图像图层,则对该图层中的包括所有素材的最小区域进行截图,得到该图层对应的截图,将该截图确定为该图层包括的素材;
[0087]例如,图层2的类型为图像图层。对图层2中的包括所有素材的最小区域A2进行截图,得到图层2对应的截图P1,将该截图Pl确定为图层2包括的素材。
[0088]其中,得到该图层对应的截图后,还保存该图层对应的截图。
[0089]其中,对于设计原文件包括的其他每个图层,同该图层按照上述操作获取其他每个图层包括的素材。
[0090]其中,通过上述步骤203和204的操作分别获取设计原文件包括的图层的图层信息和图层包括的素材之后,通过如下步骤205-207的操作来生成网页页面。
[0091]步骤205:根据设计原文件的尺寸创建一个空白的网页页面,该空白的网页页面包括一个内容区域,该内容区域的尺寸与设计原文件的尺寸相等;
[0092]其中,内容区域用于显示网页页面包括的所有素材。
[0093]本步骤具体为,创建一个空白的网页页面,根据设计原文件的尺寸在该空白的网页页面中创建一个内容区域,该内容区域的宽度和高度分别与设计原文件的宽度和高度相坐寸ο
[0094]例如,如图3-5所示,创建一个空白的网页页面,根据设计原文件的尺寸,即设计原文件的宽度50和高度100在该空白的网页页面中创建一个内容区域,该内容区域的宽度为50和高度为100。
[0095]进一步地,在空白的网页页面中创建一个内容区域之后,还将该内容区域在空白的网页页面中的位置设置为居中。
[0096]其中,在空白的网页页面中创建一个内容区域之前,首先建立一个HTML (HyperText Markup Language,超文本标记语言)文档,将对设计原文件的尺寸和设计原文件中的图层的图层信息进行保存得到的数据文件输入给该HTML文档,该HTML文档对数据文件进行解析,以获得设计原文件的尺寸和设计原文件中的图层的图层信息。
[0097]步骤206:根据设计原文件中的图层的图层信息包括的素材的位置和尺寸,在内容区域中创建该图层对应的一个显示区域;
[0098]其中,每个图层对应的一个显示区域用于显示每个图层包括的素材。
[0099]本步骤具体为,对于设计原文件包括的每个图层,根据该图层包括的素材的位置和尺寸,在内容区域中创建该图层对应的一个显示区域。对于设计原文件包括的其他每个图层,同该图层按照上述操作在内容区域分别创建其他每个图层对应的显示区域。
[0100]例如,根据图层I的图层信息包括的素材的位置(10,10),以及宽度为20和高度为40,在如图3-5所示的内容区域中创建图层I对应的显示区域I。根据图层2的图层信息包括的素材的位置为(10,60),以及宽度为30和高度为20,在如图3-5所示的内容区域中创建图层2对应的显示区域2,如图3-6所示。
[0101]其中,在内容区域中创建该图层对应的一个显示区域时,将该显示区域的位置属性设置为绝对定位,然后将图层包括的素材的位置设置为该显示区域的位置。该显示区域可以为网页页面中的一个DOM(Document Object Model,节点)。
[0102]步骤207:将该图层包括的素材加载到该图层对应的显示区域中,以生成网页页面。
[0103]具体地,对于设计原文件包括的每个图层,根据该图层的图层信息中包括的类型,对该图层进行判断;如果该图层的类型为文字图层,则将该图层包括的文字内容加载到该图层对应的显示区域中,并根据该图层的图层信息包括的样式信息设置文字内容的样式;如果该图层的类型为图像图层,则将该图层对应的截图加载到该图层对应的显示区域中。
[0104]其中,对于设计原文件包括的其他每个图层,同该图层按照上述操作将其他每个图层包括的素材分别加载到其他每个图层对应的显示区域中。
[0105]例如,根据图层I的图层信息中包括的类型文字图层,对图层I进行判断,且判断出图层I的类型为文字图层,则将图层I包括的文字内容“今日晴转多云,微风2-3级”加载到图层I对应的显示区域I中。根据图层2的图层信息中包括的类型图像图层,对图层2进行判断,且判断出图层2的类型为图像图层,则将图层2对应的截图Pl加载到图层2对应的显示区域2中,如图3-7所示。
[0106]在本发明实施例中,获取设计原文件的尺寸以及设计原文件包括的图层的图层信息;获取图层包括的素材;根据设计原文件的尺寸、图层的图层信息和图层包括的素材,生成网页页面。由于根据设计原文件的尺寸、设计原文件包括的图层的图层信息以及图层包括的素材,将设计原文件转换为网页页面,来自动生成网页页面,如此提高了生成网页页面的效率,降低了生成网页页面的成本,同时保证了生成网页页面的质量。
[0107]实施例3
[0108]参见图4,本发明实施例提供了一种生成网页页面的装置,包括:
[0109]第一获取模块301,用于获取设计原文件的尺寸以及设计原文件包括的图层的图层?目息;
[0110]第二获取模块302,用于获取图层包括的素材;
[0111]生成模块303,用于根据设计原文件的尺寸、图层的图层信息和图层包括的素材,生成网页页面。
[0112]其中,图层信息至少包括图层的序号、类型、图层包括的素材的位置和尺寸;
[0113]第一获取模块301包括:
[0114]第一获取单元,用于获取图层中的包括所有素材的最小区域的位置和尺寸;
[0115]确定单元,用于将最小区域的位置和尺寸确定为图层包括的素材的位置和尺寸;
[0116]分配单元,用于为图层分配序号;
[0117]第二获取单元,用于获取图层的类型属性,根据类型属性获取图层的类型。
[0118]进一步地,如果图层的类型为文字图层,则图层的图层信息还包括图层的样式信息;
[0119]第一获取模块301,还用于获取图层的样式属性,根据样式属性获取图层的样式信肩、O
[0120]其中,第二获取模块302包括:
[0121]第三获取单元,用于如果图层的类型为文字图层,则获取图层中包括的文字内容,将获取的文字内容确定为图层包括的素材;
[0122]第四获取单元,用于如果图层的类型为图像图层,则对图层中的包括所有素材的最小区域进行截图,得到图层对应的截图,将截图确定为图层包括的素材。
[0123]进一步地,该装置还包括:
[0124]合并模块,用于获取设计原文件包括的每个图层文件夹的层级,将层级大于预设数值的图层文件夹包括的所有图层合并为一个图层。
[0125]其中,生成模块303包括:
[0126]第一创建单元,用于根据设计原文件的尺寸创建一个空白的网页页面,空白的网页页面包括一个内容区域,内容区域的尺寸与设计原文件的尺寸相等;
[0127]第二创建单元,用于根据图层的图层信息包括的素材的位置和尺寸,在内容区域中创建图层对应的一个显示区域;
[0128]加载单元,用于将图层包括的素材加载到图层对应的显示区域中,以生成网页页面。
[0129]其中,加载单元包括:
[0130]第一加载子单元,用于如果图层的类型为文字图层,则将图层包括的文字内容加载到图层对应的显示区域中,并根据图层的图层信息包括的样式信息设置文字内容的样式;
[0131]第二加载子单元,用于如果图层的类型为图像图层,则将图层对应的截图加载到图层对应的显示区域中。
[0132]在本发明实施例中,获取设计原文件的尺寸以及设计原文件包括的图层的图层信息;获取图层包括的素材;根据设计原文件的尺寸、图层的图层信息和图层包括的素材,生成网页页面。由于根据设计原文件的尺寸、设计原文件包括的图层的图层信息以及图层包括的素材,将设计原文件转换为网页页面,来自动生成网页页面,如此提高了生成网页页面的效率,降低了生成网页页面的成本,同时保证了生成网页页面的质量。
[0133]实施例4
[0134]请参考图5,其示出了本发明实施例所涉及的具有触敏表面的终端结构示意图,该终端可以用于
当前第3页1 2 3 4 5 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1