本申请实施例公开了一种网页显示方法及装置。所述方法包括:获取待显示网页的源代码;解析所述源代码形成树状节点;将所述树状节点进行排版;根据排版后的树状节点定位主容器;定位所述主容器内的至少一个次容器;调整所述次容器的面积;绘制调整后的次容器。本申请实施例还公开了一种网页显示装置。本申请实施例所提供的网页显示方法及装置,将待显示网页模块化,当对网页的部分元素进行调整时,不会破坏网页的细节排版,而且各个次容器相互独立,每个次容器的细节排版不受其他次容器的影响。由此可见,本申请实施例所提供的网页显示方法及装置,不但能保证网页的可读性,也能够保留网页的细节排版,改善了用户体验。
【技术实现步骤摘要】
网页显示方法及装置
本专利技术涉及移动通信
,特别是涉及一种网页显示方法及装置。
技术介绍
用户在使用便携终端,如手机、PAD等,浏览网页时,由于网页依照台式电脑的屏幕尺寸设计,而便携终端的屏幕尺寸偏小,如果将原始网页显示在便携移动终端屏幕上,则网页的高度和宽度会超出便携终端屏幕,当用户进行浏览时,需要边浏览边调整网页的内容;如果将网页直接完整的缩小至与便携终端屏幕尺寸一致进行显示,则网页内容显示过小,用户无法清楚的浏览网页内容,严重影响用户体验。针对上述问题,目前在便携终端中广泛采用的网页显示方法为:通过放大部分内容的字体,提高网页在便携终端上的可读性。具体实现方法如下:对网页内容进行排版时,保证网页整体布局不变,对网页重点内容的文本进行放大,使重点内容的文字达到可阅读的效果。当用户需要对部分内容详细阅读时,再通过交互的方式对该部分文本内容再次进行放大。虽然该方法对文本进行了优化,而且能保证网页整体布局的完整,但是文本的放大导致某些区域排版的变形和文字的溢出隐藏,对局部细节的排版产生了破坏。因此,如何提供一种既能保证可读性,又能保留网页细节排版的网页显示方法,成为本领域亟待解决的问题。
技术实现思路
本申请实施例提供了 一种网页显示方法及装置,既能提高网页在便携终端上可读性,又能够保留网页的细节排版,改善了用户体验。第一方面,本申请实施例公开了一种网页显示方法,所述方法包括:获取待显示网页的源代码;解析所述源代码形成树状节点;将所述树状节点按照所述源代码的样式规范进行排版;根据排版后的树状节点定位主容器;定位所述主容器内的至少一个次容器,其中,每个所述次容器包含一部分所述待显示网页的元素;调整所述次容器的面积;绘制调整后的次容器,将所述次容器所包含的待显示网页的元素在屏幕上显示。在第一方面的第一种可能的实现方式中,所述根据排版后的树状节点定位主容器,包括:判断当前节点的上级节点是否为空或者其上级节点是否为主容器;当所述当前节点的上级节点为空或者为主容器时,判断当前节点的高度是否为固定值;当所述当前节点高度不是固定值时,如果上级节点为空,将当前节点定位为主容器;如果所述当前节点的上级节点为主容器,当所述当前节点的宽度大于等于根节点宽度的50%,且大于等于其上级节点宽度的90%,将所述当前节点定位为主容器。结合第一方面或第一方面的第一种可能的实现方式,在第二种可能的实现方式中,所述定位所述主容器内包含的至少一个次容器,包括:判断所述当前节点的上级节点是否为主容器;当所述上级节点为主容器,如果所述当前节点的宽度为其上级节点宽度的20%到80%,将所述当前节点定位为次容器。结合第一方面或第一方面的第一种或第二种可能的实现方式,在第三种可能的实现方式中,所述调整所述次容器的面积,包括:计算每个所述次容器的面积,并得到所有次容器面积的平均值;比较每个所述次容器的面积与所述平均值的大小;若所述次容器的面积大于所述平均值,将所述次容器按预设比例系数k进行放大,其中,所述k大于I ;同时,将其他次容器进行相应缩小,以保持次容器的总宽度不变。结合第一方面或第一方面的第一种或第二种或第三种可能的实现方式,在第四种可能的实现方式中,所述方法还包括:接收切换命令;生成所述目标次容器的缩放比例系数U ;将所述目标次容器的面积进行u倍调整,并对应调整其他次容器的面积,以保持次容器的总宽度不变;绘制调整后的次容器,将所述次容器的元素在屏幕上进行显示。结合第一方面或第一方面的第一种或第二种或第三种或第四种可能的实现方式,在第五种可能的实现方式中,所述生成所述目标次容器的缩放比例系数,包括:比较所述屏幕的宽度与所述主容器的宽度,取二者之中的最小值;将所述最小值与所述预设比例系数k作乘法计算,乘法计算的结果除以所述目标次容器的宽度,得到第一缩放系数Ul ;将所述主容器的高度值除以所述目标次容器的高度值,得到第二缩放系数u2;将所述Ul和所述u2中的最小值确定为所述缩放比例系数U。第二方面,本申请实施例还公开了一种网页显示装置,所述装置包括:获取单元,用于获取待显示网页的源代码;解析单元,用于解析所述获取单元获取到的源代码形成树状节点;排版单元,用于将所述解析单元解析形成的树状节点按照所述源代码的样式规范进行排版;第一定位单元,用于根据所述排版单元排版后的树状节点定位主容器;第二定位单元,用于定位所述主容器内的至少一个次容器,其中,每个所述次容器包含一部分所述待显示网页的元素;第一调整单元,用于调整所述第二定位单元定位得到次容器的面积;绘制单元,用于绘制所述第一调整单元调整后的次容器,将所述次容器所包含的待显示网页的元素在屏幕上显示。在第二方面的第一种可能的实现方式中,所述第一定位单元包括:第一判断单元和第二判断单元,其中,所述第一判断单元,用于判断当前节点的上级节点是否为空或者其上级节点是否为主容器;所述第二判断单元,用于当所述当前节点的上级节点为空或者为主容器时,判断当前节点的高度是否为固定值;所述第一定位单元,具体用于当所述当前节点高度不是固定值时,如果上级节点为空,将当前节点定位为主容器;如果所述当前节点的上级节点为主容器,当所述当前节点的宽度大于等于根节点宽度的50%,且大于等于其上级节点宽度的90%,将所述当前节点定位为主容器。结合第二方面或第二方面的第一种可能的实现方式,在第二种可能的实现方式中,所述第二定位单元包括:第三判断单元,其中,所述第三判断单元,用于判断所述当前节点的上级节点是否为主容器;所述第二定位单元,具体用于当所述当前节点的上级节点为主容器时,如果所述当前节点的宽度为其上级节点宽度的20%到80%,将所述当前节点定位为次容器。结合第二方面或第二方面的第一种或第二种可能的实现方式,在第三种可能的实现方式中,所述第一调整单元包括:第一计算单元、第一比较单元和缩放单元,其中,所述第一计算单元,用于将计算每个所述次容器的面积,并得到所有次容器面积的平均值;所述第一比较单元,用于比较所述第一计算单元计算得到的每个所述次容器的面积与所述平均值的大小;所述缩放单元,用于若所述次容器的面积大于所述平均值,将所述次容器按预设比例系数k进行放大,其中,所述k大于I ;同时,将其他次容器进行相应缩小,以保持次容器的总宽度不变。结合第二方面或第二方面的第一种或第二种或第三种可能的实现方式,在第四种可能的实现方式中,所述装置还包括:接收单元、生成单元和第二调整单元,其中,所述接收单元,用于接收切换命令;所述生成单元,用于生成所述目标次容器的缩放比例系数u ;所述第二调整单元,用于当所述生成单元生成缩放比例系数u后,将所述目标次容器的面积进行U倍调整,并对应调整其他次容器的面积,以保持次容器的总宽度不变;所述绘制单元,还用于绘制所述第二调整单元调整后的次容器,将所述次容器的元素在屏幕上进行显/Jn ο结合第二方面或第二方面的第一种或第二种或第三种或第四种可能的实现方式,在第五种可能的实现方式中,所述生成单元包括:第二比较单元、第二计算单元和确定单元,其中,所述第二比较单元,用于比较所述屏幕的宽度与所述主容器的宽度,取二者之中的最小值;所述第二计算单元,具体用于将所述最小值与所述预设比例系数k作乘法计算,乘法计本文档来自技高网...

【技术保护点】
一种网页显示方法,其特征在于,所述方法包括:获取待显示网页的源代码;解析所述源代码形成树状节点;将所述树状节点按照所述源代码的样式规范进行排版;根据排版后的树状节点定位主容器;定位所述主容器内的至少一个次容器,其中,每个所述次容器包含一部分所述待显示网页的元素;调整所述次容器的面积;绘制调整后的次容器,将所述次容器所包含的待显示网页的元素在屏幕上显示。
【技术特征摘要】
1.一种网页显示方法,其特征在于,所述方法包括: 获取待显示网页的源代码; 解析所述源代码形成树状节点; 将所述树状节点按照所述源代码的样式规范进行排版; 根据排版后的树状节点定位主容器; 定位所述主容器内的至少一个次容器,其中,每个所述次容器包含一部分所述待显示网页的元素; 调整所述次容器的面积; 绘制调整后的次容器,将所述次容器所包含的待显示网页的元素在屏幕上显示。2.根据权利要求1所述的方法,其特征在于,所述根据排版后的树状节点定位主容器,包括: 判断当前节点的上级节点是否为空或者为主容器; 当所述当前节点的上级节点为空或者为主容器时,判断当前节点的高度是否为固定值; 当所述当前节点高度不是固定值时,如果上级节点为空,将当前节点定位为主容器;如果所述当前节点的上级节点为主容器,当所述当前节点的宽度大于等于根节点宽度的50%,且大于等于其上级节点宽度的90%,将所述当前节点定位为主容器。3.根据权利要求2所述的方法,其特征在于,所述定位所述主容器内包含的至少一个次容器,包括: 判断所述当前节点的上级节点是否为主容器; 当所述上级节点为主容器,如果所述当前节点的宽度为其上级节点宽度的20%到80%,将所述当前节点定位为次容器。4.根据权利要求1所述的方法,其特征在于,所述调整所述次容器的面积,包括: 计算每个所述次容器的面积,并得到所有次容器面积的平均值; 比较每个所述次容器的面积与所述平均值的大小; 若所述次容器的面积大于所述平均值,将所述次容器按预设比例系数k进行放大,其中,所述k大于I ;同时,将其他次容器进行相应缩小,以保持次容器的总宽度不变。5.根据权利要求1至4中任一权项所述的方法,其特征在于,所述方法还包括: 接收切换命令,以放大显示目标次容器的内容; 生成所述目标次容器的缩放比例系数u ; 将所述目标次容器的面积进行u倍调整,并对应调整其他次容器的面积,以保持次容器的总宽度不变; 绘制调整后的次容器,将所述次容器的元素在屏幕上进行显示。6.根据权利要求5所述的方法,其特征在于,所述生成所述目标次容器的缩放比例系数,包括: 比较所述屏幕的宽度与所述主容器的宽度,取二者之中的最小值; 将所述最小值与所述预设比例系数k作乘法计算,乘法计算的结果除以所述目标次容器的宽度,得到第一缩放系数Ul ;将所述主容器的高度值除以所述目标次容器的高度值,得到第二缩放系数u2 ;将所述ul和所述u2中的最小值确定为所述缩放比例系数U。7.一种网页显示装置,其特征在于,所述装置包括: 获取单元,用于获取待显示网页的源代码; 解析单元,用于解析所述获取单元获取到的源代码形成树状节点; 排版单元,用于将所述解析单元解析形成的树状节点按照所述源代码的样式规范进行排版; 第一定位单元,用于根据所述排版单元排版后的树状节点定位主容器; 第二定位单元,用于定位所述主容器内的至少一个次容器,其...
【专利技术属性】
技术研发人员:曾锦和,梁捷,
申请(专利权)人:优视科技有限公司,
类型:发明
国别省市:
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。