一种用于页面渲染的调整文字大小的方法及装置制造方法及图纸

本发明专利技术实施例提供了一种用于页面渲染的调整文字大小的方法及装置，其中的方法包括：获取进行页面渲染的移动设备的屏幕宽度；获取所述移动设备的屏幕宽度与预设设计稿的宽度的比值；获取所述预设设计稿的第一文字大小的范围；根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小；根据所述第二文字大小，进行页面渲染。本发明专利技术解决了现有技术在页面渲染时文字适配存在偏差的技术问题。

A method and device to adjust the size of a text for page rendering

The embodiment of the invention relates to a method and a device for adjusting the size of text page rendering is provided, the method includes: obtaining mobile devices page rendering the screen width; ratio of obtaining the mobile device screen width and the width of the pre draft design; obtain the default design draft of the first text size range; according to the scope of the first text size and the ratio of the adjustment and the screen width corresponding to the second text size; according to the second text size, page rendering. The invention solves the technical problem that there is a deviation in the adaptation of the text when the page rendering is rendered by the existing technology.

【技术实现步骤摘要】
一种用于页面渲染的调整文字大小的方法及装置
本专利技术涉及计算机
，尤其涉及一种用于页面渲染的调整文字大小的方法及装置。
技术介绍
目前，安卓操作系统由于其开源性和良好的操作性，被广泛应用于各种移动设备中。在安卓系统中，通常通过动态的直译式脚本语言JavaScript来进行页面渲染。现有技术中，在页面渲染中，一般采用rem适配方式，其中，rem是指相对于根元素的字体大小的单位。然而，移动设备的种类较多，例如手机、平板电脑等，各种移动设备中的浏览器类型也多种多样，例如IE浏览器、谷歌浏览器、360浏览器等等，各种浏览器对rem的处理机制不一致，有的采用四舍五入的方式，有的采用去尾法仅保留整数等等，这样将导致在页面渲染时，系统显示的文字大小与预先的设计稿中的文字大小存在偏差。可见，现有技术在页面渲染时文字适配存在偏差的技术问题。
技术实现思路
本专利技术实施例提供了一种用于页面渲染的调整文字大小的方法及装置，用以解决现有技术在页面渲染时文字适配存在偏差的技术问题。第一方面，本专利技术提供了一种用于页面渲染的调整文字大小的方法，该方法包括：获取进行页面渲染的移动设备的屏幕宽度；获取所述移动设备的屏幕宽度与预设设计稿的宽度的比值；获取所述预设设计稿的第一文字大小的范围；根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小；根据所述第二文字大小，进行页面渲染。可选的，所述预设设计稿的第一文字大小的范围为12px～44px，且所述第一文字大小为偶数值。可选的，所述根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小，包括：根据所述第一文字大小的范围，获得所述第一文字大小的集合；根据所述第一文字大小的集合中每个元素与所述比值之间的乘积，获得与所述屏幕宽度对应的第二文字大小的集合；从所述第二文字大小的集合中选取用于进行渲染的第二文字大小。可选的，所述根据所述第二文字大小，进行页面渲染，包括：根据所述第二文字大小，设置待渲染页面的行内样式；基于所述行内样式，进行页面渲染。基于同样的专利技术构思，本专利技术第二方面提供了一种用于页面渲染的调整文字大小的装置，所述装置包括：第一获取模块，获取进行页面渲染的移动设备的屏幕宽度；第二获取模块，用于获取所述移动设备的屏幕宽度与预设设计稿的宽度的比值；第三获取模块，用于获取所述预设设计稿的第一文字大小的范围；调整模块，用于根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小；渲染模块，用于根据所述第二文字大小，进行页面渲染。可选的，所述预设设计稿的第一文字大小的范围为12px～44px，且所述第一文字大小为偶数值。可选的，所述调整模块还用于：根据所述第一文字大小的范围，获得所述第一文字大小的集合；根据所述第一文字大小的集合中每个元素与所述比值之间的乘积，获得与所述屏幕宽度对应的第二文字大小的集合；从所述第二文字大小的集合中选取用于进行渲染的的第二文字大小。可选的，所述渲染模块还用于：根据所述第二文字大小，设置待渲染页面的行内样式；基于所述行内样式，进行页面渲染。基于同样的专利技术构思，本专利技术第三方面提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现以下步骤：获取进行页面渲染的移动设备的屏幕宽度；获取所述移动设备的屏幕宽度与预设设计稿的宽度的比值；获取所述预设设计稿的第一文字大小的范围；根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小；根据所述第二文字大小，进行页面渲染。基于同样的专利技术构思，本专利技术第四方面提供了一种计算机设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述程序时实现以下步骤：获取进行页面渲染的移动设备的屏幕宽度；获取所述移动设备的屏幕宽度与预设设计稿的宽度的比值；获取所述预设设计稿的第一文字大小的范围；根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小；根据所述第二文字大小，进行页面渲染。本申请实施例中的上述一个或多个技术方案，至少具有如下一种或多种技术效果：本专利技术的用于页面渲染的调整文字大小的方法，包括获取进行页面渲染的移动设备的屏幕宽度，获取所述移动设备的屏幕宽度与预设设计稿的宽度的比值，获取所述预设设计稿的第一文字大小的范围，根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小，根据所述第二文字大小，进行页面渲染。在本专利技术提供的方法中，一方面，对于移动设备中的各种浏览器，都是直接根据第一文字大小的范围和移动设备的屏幕宽度与预设设计稿的宽度的比值，来调整与所述屏幕宽度对应的第二文字大小，即对于不同的浏览器都是采用统一的方式来对第二字大小来进行调整，而不需要进行rem单位转换，因此可以避免不同浏览器对字体处理机制的不同导致实际字体与设计稿字体之间的偏差；另一方面，在调整第二文字大小之前，预先获得了第一文字大小的范围，通过预计算可以提高计算效率。所以，本专利技术实现了页面渲染中第二文字大小与预设设计稿中第一文字大小的精准适配，并提高了计算效率的技术效果，解决了现有技术在页面渲染时文字适配存在偏差的技术问题。附图说明图1为本专利技术实施例用于页面渲染的调整文字大小的方法流程图；图2为本专利技术实施例用于页面渲染的调整文字大小的装置的结构图；图3为本专利技术实施例一种计算机可读存储介质的结构图；图4为本专利技术实施例一种计算机设备的结构图。具体实施方式本专利技术实施例提供了一种用于页面渲染的调整文字大小的方法及装置，用以解决现有技术在页面渲染时文字适配存在偏差的技术问题。为了解决上述技术问题，本专利技术提供的技术方案思路如下：一种用于页面渲染的调整文字大小的方法，包括：获取进行页面渲染的移动设备的屏幕宽度；获取所述移动设备的屏幕宽度与预设设计稿的宽度的比值；获取所述预设设计稿的第一文字大小的范围；根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小，根据所述第二文字大小，进行页面渲染。在本专利技术提供的方法中，一方面，对于移动设备中的各种浏览器，都是直接根据第一文字大小的范围和移动设备的屏幕宽度与预设设计稿的宽度的比值，来调整与所述屏幕宽度对应的第二文字大小，即对于不同的浏览器都是采用统一的方式来对第二字大小来进行调整，而不需要进行rem单位转换，因此可以避免不同浏览器对字体处理机制的不同导致实际字体与设计稿字体之间的偏差；另一方面，在调整第二文字大小之前，预先获得了第一文字大小的范围，通过与计算可以提高计算效率。所以，本专利技术实现了页面渲染中第二文字大小与预设设计稿中第一文字大小的精准适配，并提高了计算效率的技术效果，解决了现有技术在页面渲染时文字适配存在偏差的技术问题。下面通过附图以及具体实施例对本专利技术技术方案做详细的说明，应当理解本申请实施例以及实施例中的具体特征是对本申请技术方案的详细的说明，而不是对本申请技术方案的限定，在不冲突的情况下，本申请实施例以及实施例中的技术特征可以相互组合。实施例一本专利技术第一方面提供了一种用于页面渲染的调整文字大小的方法，请参见图1。需要说明的是，本实施例提供的方法的移动设备包括手机、平板电脑、智能手表或其他搭载有智能操作系统的设备，本专利技术不做具体限制。另本文档来自技高网...

【技术保护点】
一种用于页面渲染的调整文字大小的方法，其特征在于，包括：获取进行页面渲染的移动设备的屏幕宽度；获取所述移动设备的屏幕宽度与预设设计稿的宽度的比值；获取所述预设设计稿的第一文字大小的范围；根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小；根据所述第二文字大小，进行页面渲染。

【技术特征摘要】
1.一种用于页面渲染的调整文字大小的方法，其特征在于，包括：获取进行页面渲染的移动设备的屏幕宽度；获取所述移动设备的屏幕宽度与预设设计稿的宽度的比值；获取所述预设设计稿的第一文字大小的范围；根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小；根据所述第二文字大小，进行页面渲染。2.如权利要求1所述的方法，其特征在于，所述预设设计稿的第一文字大小的范围为12px～44px，且所述第一文字大小为偶数值。3.如权利要求1所述的方法，其特征在于，所述根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小，包括：根据所述第一文字大小的范围，获得所述第一文字大小的集合；根据所述第一文字大小的集合中每个元素与所述比值之间的乘积，获得与所述屏幕宽度对应的第二文字大小的集合；从所述第二文字大小的集合中选取用于进行渲染的第二文字大小。4.如权利要求1所述的方法，其特征在于，所述根据所述第二文字大小，进行页面渲染，包括：根据所述第二文字大小，设置待渲染页面的行内样式；基于所述行内样式，进行页面渲染。5.一种用于页面渲染的调整文字大小的装置，其特征在于，包括：第一获取模块，获取进行页面渲染的移动设备的屏幕宽度；第二获取模块，用于获取所述移动设备的屏幕宽度与预设设计稿的宽度的比值；第三获取模块，用于获取所述预设设计稿的第一文字大小的范围；调整模块，用于根据所述第一文字大小的范围和所述比值，调整与所述屏幕宽度对应的第二文字大小；渲染模块，用于根据所述...

【专利技术属性】
技术研发人员：王亚伟，陈少杰，张文明，
申请(专利权)人：武汉斗鱼网络科技有限公司，
类型：发明
国别省市：湖北,42