CN108459854B - 移动终端样式配置方法和装置 - Google Patents
移动终端样式配置方法和装置 Download PDFInfo
- Publication number
- CN108459854B CN108459854B CN201710091332.9A CN201710091332A CN108459854B CN 108459854 B CN108459854 B CN 108459854B CN 201710091332 A CN201710091332 A CN 201710091332A CN 108459854 B CN108459854 B CN 108459854B
- Authority
- CN
- China
- Prior art keywords
- style
- value
- mobile terminal
- configuration
- font
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Controls And Circuits For Display Device (AREA)
- Telephone Function (AREA)
Abstract
本发明公开了一种移动终端样式配置方法,所述移动终端样式配置方法包括:当侦测到配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式;若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值;根据所述属性值和所述样式值配置所述待配置样式。本发明还公开了一种移动终端样式配置装置。本发明实现了开发者在获取到视觉稿时,不需要考虑pt和px单位转换,React Native可根据移动终端的属性自动进行配置,提高了开发过程中的开发效率。
Description
技术领域
本发明涉及移动终端技术领域,尤其涉及一种移动终端样式配置方法和装置。
背景技术
React Native是Facebook推出的一个用Java语言就能同时编写ios,android,以及后台的一项技术。在通过React Native进行移动终端显示页面的开发过程中,通过开发工具Sketch和InVision等开发工具所获得的视觉稿的单位是px,而所述React Native所提供的样式的单位是pt。因此,在开发过程中,开发者中需要考虑pt和px之间单位的转换,但是,React Native提供的样式不能根据移动终端的长宽高等因素自动进行配置,即所述React Native不能根据移动终端的属性自动进行配置,从而导致开发效率低下。
发明内容
本发明的主要目的在于提供一种移动终端样式配置方法和装置,旨在解决现有React Native不能根据移动终端的属性自动进行配置的技术问题。
为实现上述目的,本发明提供的一种移动终端样式配置方法,所述移动终端样式配置方法包括:
当侦测到配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式;
若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值;
根据所述属性值和所述样式值配置所述待配置样式。
优选地,所述待配置样式包括移动终端显示页面的字体样式、水平样式和/或垂直样式。
优选地,所述若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值的步骤包括:
若所述水平样式在所述预设样式列表中,则获取所述移动终端显示页面的默认宽度值、目标宽度值和所述水平样式所对应的水平样式值;
所述根据所述属性值和所述样式值配置所述待配置样式的步骤包括:
根据所述默认宽度值和所述目标宽度值计算所述水平样式的水平配置比例;
根据所述水平配置比例和所述水平样式值之间的乘积配置所述水平样式。
优选地,所述若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值的步骤包括:
若所述垂直样式在所述预设样式列表中,则获取所述移动终端显示页面的默认高度值、目标高度值和所述垂直样式所对应的垂直样式值;
所述根据所述属性值和所述样式值配置所述待配置样式的步骤包括:
根据所述默认高度值和所述目标高度值计算所述垂直样式的垂直配置比例;
根据所述垂直配置比例和所述垂直样式值之间的乘积配置所述垂直样式。
优选地,所述若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值的步骤包括:
若所述字体样式在所述预设样式列表中,则获取所述移动终端显示页面的默认字体高度值、目标高度值和字体样式值;
所述根据所述属性值和所述样式值配置所述待配置样式的步骤包括:
根据所述默认字体高度值和所述目标高度值计算所述字体样式的字体配置比例;
根据所述字体配置比例和所述字体样式值配置所述字体样式。
此外,为实现上述目的,本发明还提供一种移动终端样式配置装置,所述移动终端样式配置装置包括:
第一获取模块,用于当侦测到配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式;
第二获取模块,用于若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值;
配置模块,用于根据所述属性值和所述样式值配置所述待配置样式。
优选地,所述待配置样式包括移动终端显示页面的字体样式、水平样式和/或垂直样式。
优选地,所述第二获取模块还用于若所述水平样式在所述预设样式列表中,则获取所述移动终端显示页面的默认宽度值、目标宽度值和所述水平样式所对应的水平样式值;
所述配置模块包括:
第一计算单元,用于根据所述默认宽度值和所述目标宽度值计算所述水平样式的水平配置比例;
第一配置单元,用于根据所述水平配置比例和所述水平样式值之间的乘积配置所述水平样式。
优选地,所述第二获取模块还用于若所述垂直样式在所述预设样式列表中,则获取所述移动终端显示页面的默认高度值、目标高度值和所述垂直样式所对应的垂直样式值;
所述配置模块还包括:
第二计算单元,用于根据所述默认高度值和所述目标高度值计算所述垂直样式的垂直配置比例;
第二配置单元,用于根据所述垂直配置比例和所述垂直样式值之间的乘积配置所述垂直样式。
优选地,所述第二获取模块还用于若所述字体样式在所述预设样式列表中,则获取所述移动终端显示页面的默认字体高度值、目标高度值和字体样式值;
所述配置模块还包括:
第三计算单元,用于根据所述默认字体高度值和所述目标高度值计算所述字体样式的字体配置比例;
第三配置单元,用于根据所述字体配置比例和所述字体样式值配置所述字体样式。
本发明通过当侦测到配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式;若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值;根据所述属性值和所述样式值配置所述待配置样式。实现了开发者在获取到视觉稿时,不需要考虑pt和px单位转换,React Native可根据移动终端的属性自动进行配置,提高了开发过程中的开发效率。
附图说明
图1为本发明移动终端样式配置方法第一实施例的流程示意图;
图2为本发明移动终端样式配置方法第二实施例的流程示意图;
图3为本发明移动终端样式配置装置较佳实施例的功能模块示意图;
图4为本发明实施例中配置模块的一种功能模块示意图。
本发明目的的实现、功能特点及优点将结合实施例,参照附图做进一步说明。
具体实施方式
应当理解,此处所描述的具体实施例仅仅用以解释本发明,并不用于限定本发明。
本发明提供一种移动终端样式配置方法。
参照图1,图1为本发明移动终端样式配置方法第一实施例的流程示意图。
在本实施例中,所述移动终端样式配置方法包括:
步骤S10,当侦测到配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式;
在移动终端的开发过程中,当React Native的样式组件返回一个样式值时,会触发配置指令。所述React Native是当前移动端开发中的优秀解决方案。
当侦测到所述配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式。当获取到待配置样式时,判断所述待配置样式是否在预设样式列表中。需要说明的是,所述预设样式列表是根据需要预先设置的,所述预设样式列表中存储了需要配置的样式。
需要说明的是,所述待配置样式包括但不限于所述移动终端显示页面宽、高、边距和字体样式。在所述边距样式中,包括上边距、下边距、左边距和右边距样式。在本实施例中,将所述移动终端显示页面的宽样式、左边距样式和右边距样式定义为水平样式;将所述移动终端显示页面的高样式、上边距样式和下边距样式定义为垂直样式。所述移动终端包括但不限于智能手机和掌上电脑。
所述边距样式中的包括padding边距和margin边距,所述padding边距称为内边距,判断依据是边框离内容正文的距离;所述margin边距是元素周围生成额外的空白区,所述空白区通常指的是其它元素不能出现,且父元素背景可见的区域。在CSS(CascadingStyle Sheets,层叠样式表)中,所述margin边距是指从自身边框到另一个容器边框之间的距离,就是容器外距离,padding边距是指自身边框到自身内部另一个容器边框之间的距离,就是容器内距离。所述CSS是一种用来表现HTML(HyperText Markup Language,超级文本标记语言)(标准通用标记语言的一个应用)或XML(Extensible Markup Language,可扩展标记语言)(标准通用标记语言的一个子集)等文件样式的计算机语言,所述CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。
步骤S20,若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值;
步骤S30,根据所述属性值和所述样式值配置所述待配置样式。
当所述待配置样式在所述预设样式列表中时,获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值,根据所述属性值和所述样式值配置所述待配置样式。需要说明的是,在所述预设样式列表中的待配置样式都有其对应的样式值,所述样式值是所述移动终端所对应的视觉稿中与所述待配置样式对应的值,所述样式值的单位为像素px。所述px在计算机屏幕上,能达到预期的效果,在打印机和其它的高分辨率设备上,它又能取得所希望的效果。当配置所述待配置样式之后,所述样式值的单位为磅pt,所述pt也称为绝对单位,是一种固定长度的度量单位,是能够使用测量设备测得的长度。进一步地,若所述待配置样式不在所述预设样式列表中,则结束配置流程或者继续侦测所述配置指令。
进一步地,当所述待配置样式在所述预设样式列表中时,进行正则判断,以确定所述待配置样式是水平样式还是垂直样式。若所述待配置样式既不是水平样式,也不是垂直样式,则确定所述待配置样式为字体样式。在进行正则判断过程中,可根据所述待配置样式中的关键词来判断所述待配置样式是水平样式还是垂直样式。如当所述待配置样式中含有left和/或right等的关键词时,确定所述待配置样式为水平样式。可以理解的是,也可以设置表达式来判断所述待配置样式是否是字体样式。
本实施例通过当侦测到配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式;若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值;根据所述属性值和所述样式值配置所述待配置样式。实现了开发者在获取到视觉稿时,不需要考虑pt和px单位转换,React Native可根据移动终端的属性自动进行配置,提高了开发过程中的开发效率。
进一步地,提出本发明移动终端样式配置方法第二实施例。
移动终端样式配置方法第二实施例与移动终端样式配置方法第一实施例区别在于,参照图2,在本实施例中,所述步骤S20包括:
步骤S21,若所述水平样式在所述预设样式列表中,则获取所述移动终端显示页面的默认宽度值、目标宽度值和所述水平样式所对应的水平样式值;
所述步骤S30包括:
步骤S31,根据所述默认宽度值和所述目标宽度值计算所述水平样式的水平配置比例;
步骤S32,根据所述水平配置比例和所述水平样式值之间的乘积配置所述水平样式。
当所述待配置样式是水平样式,即所述水平样式在所述预设样式列表时,获取所述移动终端显示页面的默认宽度值、目标宽度值和所述水平样式所对应的水平样式值,将所述目标宽度值除以所述默认宽度值,得到所述水平配置比例,将所述水平配置比例乘以所述水平样式值,得到所述水平配置比例和水平样式值之间的水平乘积,根据所述水平乘积配置所述水平样式。
需要说明的是,所述水平乘积的单位为pt,即当得到所述水平乘积后,根据所述水平乘积生成所述移动终端显示页面的水平页面样式,完成所述水平样式的配置。所述默认宽度值是所述移动终端所对应的视觉稿中的标准宽度值,单位为px,所述目标宽度值为当前移动终端显示页面的宽度值,单位为pt。如当所述目标宽度值为screen.Width,所述默认宽度值为defaultScreenWidth时,所述水平配置比例为verticalRatio 1=screen.width/defaultScreenWidth。当所述水平样式值为value1,则所述水平乘积=value1*verticalRatio1。
进一步地,所述步骤S20还包括:
步骤a,若所述垂直样式在所述预设样式列表中,则获取所述移动终端显示页面的默认高度值、目标高度值和所述垂直样式所对应的垂直样式值;
所述步骤S30还包括:
步骤b,根据所述默认高度值和所述目标高度值计算所述垂直样式的垂直配置比例;
步骤c,根据所述垂直配置比例和所述垂直样式值之间的乘积配置所述垂直样式。
进一步地,当所述待配置样式是垂直样式,即所述垂直样式在所述预设样式列表时,获取所述移动终端显示页面的默认高度值、目标高度值和所述垂直样式所对应的垂直样式值,将所述目标高度值除以所述默认高度值,得到所述垂直配置比例,将所述垂直配置比例乘以所述垂直样式值,得到所述垂直配置比例和垂直样式值之间的垂直乘积,根据所述垂直乘积配置所述垂直样式。
需要说明的是,所述垂直乘积的单位为pt,即当得到所述垂直乘积后,根据所述垂直乘积生成所述移动终端显示页面的垂直页面样式,完成所述垂直样式的配置。所述默认高度值是所述移动终端所对应的视觉稿中的标准高度值,单位为px,所述目标高度值为当前移动终端显示页面的高度值,单位为pt。如当所述目标高度值为screen.Width,所述默认高度值为defaultScreenHeight时,所述垂直配置比例为verticalRatio2=screen.Height/defaultScreenHeight。当所述垂直样式值为value2,则所述垂直乘积=value2*verticalRatio2。
进一步地,所述步骤S20还包括:
步骤d,若所述字体样式在所述预设样式列表中,则获取所述移动终端显示页面的默认字体高度值、目标高度值和字体样式值;
所述步骤S30还包括:
步骤e,根据所述默认字体高度值和所述目标高度值计算所述字体样式的字体配置比例;
步骤f,根据所述字体配置比例和所述字体样式值配置所述字体样式。
进一步地,当所述待配置样式是字体样式,即所述字体样式在所述预设样式列表时,获取所述移动终端显示页面的默认字体高度值、目标高度值和所述字体样式所对应的字体样式值,将所述目标高度值除以所述默认字体高度值,得到所述字体配置比例。需要说明的是,所述默认字体高度值是所述移动终端所对应的视觉稿中的标准字体高度值,单位pt;所述目标高度值为当前移动终端显示页面的高度值,单位为pt。所述字体样式值的单位为px。当得到所述字体配置比例时,将所述字体样式值的单位从px转换成pt,然后将单位为pt的字体样式值乘以所述字体配置比例,得到字体乘积,根据所述字体乘积生成所述移动终端显示页面的字体页面样式,以实现所述字体样式的配置。
如当所述默认字体高度值为const defaultFontSize,所述目标高度值为screen.height时,所述字体配置比例为const fontSizeRatio=screen.height/defaultFontSize;当所述字体样式值为value3时,所述字体乘积=value3*fontSizeRatio。
本实施例通过当所述待配置样式为水平样式时,根据默认宽度值和目标宽度值计算所述水平样式的水平配置比例,根据水平配置比例配置所述水平样式。实现不同样式通过不同的配置比例进行配置,提高配置结果的准确性。
本发明进一步提供一种移动终端样式配置装置100。
参照图3,图3为本发明移动终端样式配置装置100较佳实施例的功能模块示意图。
需要强调的是,对本领域的技术人员来说,图3所示模块图仅仅是一个较佳实施例的示例图,本领域的技术人员围绕图3所示的移动终端样式配置装置100的模块,可轻易进行新的模块的补充;各模块的名称是自定义名称,仅用于辅助理解该移动终端样式配置装置100的各个程序功能块,不用于限定本发明的技术方案,本发明技术方案的核心是,各自定义名称的模块所要达成的功能。
在本实施例中,所述移动终端样式配置装置100包括:
第一获取模块10,用于当侦测到配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式;
在移动终端的开发过程中,当React Native的样式组件返回一个样式值时,会触发配置指令。所述React Native是当前移动端开发中的优秀解决方案。
当侦测到所述配置指令时,第一获取模块10根据所述配置指令获取移动终端显示页面的待配置样式。当所述第一获取模块10获取到待配置样式时,判断所述待配置样式是否在预设样式列表中。需要说明的是,所述预设样式列表是根据需要预先设置的,所述预设样式列表中存储了需要配置的样式。
需要说明的是,所述待配置样式包括但不限于所述移动终端显示页面宽、高、边距和字体样式。在所述边距样式中,包括上边距、下边距、左边距和右边距样式。在本实施例中,将所述移动终端显示页面的宽样式、左边距样式和右边距样式定义为水平样式;将所述移动终端显示页面的高样式、上边距样式和下边距样式定义为垂直样式。所述移动终端包括但不限于智能手机和掌上电脑。
所述边距样式中的包括padding边距和margin边距,所述padding边距称为内边距,判断依据是边框离内容正文的距离;所述margin边距是元素周围生成额外的空白区,所述空白区通常指的是其它元素不能出现,且父元素背景可见的区域。在CSS(CascadingStyle Sheets,层叠样式表)中,所述margin边距是指从自身边框到另一个容器边框之间的距离,就是容器外距离,padding边距是指自身边框到自身内部另一个容器边框之间的距离,就是容器内距离。所述CSS是一种用来表现HTML(HyperText Markup Language,超级文本标记语言)(标准通用标记语言的一个应用)或XML(Extensible Markup Language,可扩展标记语言)(标准通用标记语言的一个子集)等文件样式的计算机语言,所述CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。
第二获取模块20,用于若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值;
配置模块30,用于根据所述属性值和所述样式值配置所述待配置样式。
当所述待配置样式在所述预设样式列表中时,第二获取模块20获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值,配置模块30根据所述属性值和所述样式值配置所述待配置样式。需要说明的是,在所述预设样式列表中的待配置样式都有其对应的样式值,所述样式值是所述移动终端所对应的视觉稿中与所述待配置样式对应的值,所述样式值的单位为像素px。所述px在计算机屏幕上,能达到预期的效果,在打印机和其它的高分辨率设备上,它又能取得所希望的效果。当所述配置模块30配置所述待配置样式之后,所述样式值的单位为磅pt,所述pt也称为绝对单位,是一种固定长度的度量单位,是能够使用测量设备测得的长度。进一步地,若所述待配置样式不在所述预设样式列表中,则结束配置流程或者继续侦测所述配置指令。
进一步地,当所述待配置样式在所述预设样式列表中时,进行正则判断,以确定所述待配置样式是水平样式还是垂直样式。若所述待配置样式既不是水平样式,也不是垂直样式,则确定所述待配置样式为字体样式。在进行正则判断过程中,可根据所述待配置样式中的关键词来判断所述待配置样式是水平样式还是垂直样式。如当所述待配置样式中含有left和/或right等的关键词时,确定所述待配置样式为水平样式。可以理解的是,也可以设置表达式来判断所述待配置样式是否是字体样式。
本实施例通过当侦测到配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式;若所述待配置样式在预设样式列表中,则获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值;根据所述属性值和所述样式值配置所述待配置样式。实现了开发者在获取到视觉稿时,不需要考虑pt和px单位转换,React Native可根据移动终端的属性自动进行配置,提高了开发过程中的开发效率。
进一步地,提出本发明移动终端样式配置装置100第二实施例。
移动终端样式配置装置100第二实施例与移动终端样式配置装置100第一实施例的区别在于,参照图4,在本实施例中,所述第二获取模块20还用于若所述水平样式在所述预设样式列表中,则获取所述移动终端显示页面的默认宽度值、目标宽度值和所述水平样式所对应的水平样式值;
所述配置模块30包括:
第一计算单元31,用于根据所述默认宽度值和所述目标宽度值计算所述水平样式的水平配置比例;
第一配置单元32,用于根据所述水平配置比例和所述水平样式值之间的乘积配置所述水平样式。
当所述待配置样式是水平样式,即所述水平样式在所述预设样式列表时,所述第二获取模块20获取所述移动终端显示页面的默认宽度值、目标宽度值和所述水平样式所对应的水平样式值,第一计算单元31将所述目标宽度值除以所述默认宽度值,得到所述水平配置比例,所述第一计算单元31将所述水平配置比例乘以所述水平样式值,得到所述水平配置比例和水平样式值之间的水平乘积,第一配置单元32根据所述水平乘积配置所述水平样式。
需要说明的是,所述水平乘积的单位为pt,即当得到所述水平乘积后,所述第一配置单元32根据所述水平乘积生成所述移动终端显示页面的水平页面样式,完成所述水平样式的配置。所述默认宽度值是所述移动终端所对应的视觉稿中的标准宽度值,单位为px,所述目标宽度值为当前移动终端显示页面的宽度值,单位为pt。如当所述目标宽度值为screen.Width,所述默认宽度值为defaultScreenWidth时,所述水平配置比例为verticalRatio 1=screen.width/defaultScreenWidth。当所述水平样式值为value1,则所述水平乘积=value1*verticalRatio1。
进一步地,所述第二获取模块20还用于若所述垂直样式在所述预设样式列表中,则获取所述移动终端显示页面的默认高度值、目标高度值和所述垂直样式所对应的垂直样式值;
所述配置模块30还包括:
第二计算单元,用于根据所述默认高度值和所述目标高度值计算所述垂直样式的垂直配置比例;
第二配置单元,用于根据所述垂直配置比例和所述垂直样式值之间的乘积配置所述垂直样式。
进一步地,当所述待配置样式是垂直样式,即所述垂直样式在所述预设样式列表时,所述第二获取模块20获取所述移动终端显示页面的默认高度值、目标高度值和所述垂直样式所对应的垂直样式值,第二计算单元将所述目标高度值除以所述默认高度值,得到所述垂直配置比例,所述第二计算单元将所述垂直配置比例乘以所述垂直样式值,得到所述垂直配置比例和垂直样式值之间的垂直乘积,第二配置单元根据所述垂直乘积配置所述垂直样式。
需要说明的是,所述垂直乘积的单位为pt,即当得到所述垂直乘积后,所述第二配置单元根据所述垂直乘积生成所述移动终端显示页面的垂直页面样式,完成所述垂直样式的配置。所述默认高度值是所述移动终端所对应的视觉稿中的标准高度值,单位为px,所述目标高度值为当前移动终端显示页面的高度值,单位为pt。如当所述目标高度值为screen.Width,所述默认高度值为defaultScreenHeight时,所述垂直配置比例为verticalRatio2=screen.Height/defaultScreenHeight。当所述垂直样式值为value2,则所述垂直乘积=value2*verticalRatio2。
进一步地,所述第二获取模块20还用于若所述字体样式在所述预设样式列表中,则获取所述移动终端显示页面的默认字体高度值、目标高度值和字体样式值;
所述配置模块30还包括:
第三计算单元,用于根据所述默认字体高度值和所述目标高度值计算所述字体样式的字体配置比例;
第三配置单元,用于根据所述字体配置比例和所述字体样式值配置所述字体样式。
进一步地,当所述待配置样式是字体样式,即所述字体样式在所述预设样式列表时,所述第二获取模块20获取所述移动终端显示页面的默认字体高度值、目标高度值和所述字体样式所对应的字体样式值,第三计算单元将所述目标高度值除以所述默认字体高度值,得到所述字体配置比例。需要说明的是,所述默认字体高度值是所述移动终端所对应的视觉稿中的标准字体高度值,单位pt;所述目标高度值为当前移动终端显示页面的高度值,单位为pt。所述字体样式值的单位为px。当得到所述字体配置比例时,所述第三计算单元将所述字体样式值的单位从px转换成pt,然后将单位为pt的字体样式值乘以所述字体配置比例,得到字体乘积,第三配置单元根据所述字体乘积生成所述移动终端显示页面的字体页面样式,以实现所述字体样式的配置。
如当所述默认字体高度值为const defaultFontSize,所述目标高度值为screen.height时,所述字体配置比例为const fontSizeRatio=screen.height/defaultFontSize;当所述字体样式值为value3时,所述字体乘积=value3*fontSizeRatio。
本实施例通过当所述待配置样式为水平样式时,根据默认宽度值和目标宽度值计算所述水平样式的水平配置比例,根据水平配置比例配置所述水平样式。实现不同样式通过不同的配置比例进行配置,提高配置结果的准确性。
需要说明的是,在本文中,术语“包括”、“包含”或者其任何其它变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者系统不仅包括那些要素,而且还包括没有明确列出的其它要素,或者是还包括为这种过程、方法、物品或者系统所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括该要素的过程、方法、物品或者系统中还存在另外的相同要素。
上述本发明实施例序号仅仅为了描述,不代表实施例的优劣。通过以上的实施方式的描述,本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现,当然也可以通过硬件,但很多情况下前者是更佳的实施方式。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质(如ROM/RAM、磁碟、光盘)中,包括若干指令用以使得一台终端设备(可以是手机,计算机,服务器,或者网络设备等)执行本发明各个实施例所述的方法。
以上仅为本发明的优选实施例,并非因此限制本发明的专利范围,凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换,或直接或间接运用在其他相关的技术领域,均同理包括在本发明的专利保护范围内。
Claims (8)
1.一种移动终端样式配置方法,其特征在于,所述移动终端样式配置方法包括:
当侦测到配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式,其中,所述待配置样式包括移动终端显示页面的字体样式、水平样式和/或垂直样式;
若所述待配置样式在预设样式列表中,则基于所述待配置样式中的关键词对所述待配置样式进行正则判断,以确定所述待配置样式为所述水平样式或所述垂直样式;和/或,
根据预设表达式判断所述待配置样式是否为所述字体样式;
基于所述水平样式、垂直样式和/或字体样式,获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值;
根据所述属性值和所述样式值配置所述待配置样式。
2.如权利要求1所述的移动终端样式配置方法,其特征在于,若所述水平样式在所述预设样式列表中,所述获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值的步骤包括:
获取所述移动终端显示页面的默认宽度值、目标宽度值和所述水平样式所对应的水平样式值;
所述根据所述属性值和所述样式值配置所述待配置样式的步骤包括:
根据所述默认宽度值和所述目标宽度值计算所述水平样式的水平配置比例;
根据所述水平配置比例和所述水平样式值之间的乘积配置所述水平样式。
3.如权利要求1所述的移动终端样式配置方法,其特征在于,若所述垂直样式在所述预设样式列表中,所述获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值的步骤包括:
获取所述移动终端显示页面的默认高度值、目标高度值和所述垂直样式所对应的垂直样式值;
所述根据所述属性值和所述样式值配置所述待配置样式的步骤包括:
根据所述默认高度值和所述目标高度值计算所述垂直样式的垂直配置比例;
根据所述垂直配置比例和所述垂直样式值之间的乘积配置所述垂直样式。
4.如权利要求1所述的移动终端样式配置方法,其特征在于,若所述字体样式在所述预设样式列表中,所述获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值的步骤包括:
获取所述移动终端显示页面的默认字体高度值、目标高度值和字体样式值;
所述根据所述属性值和所述样式值配置所述待配置样式的步骤包括:
根据所述默认字体高度值和所述目标高度值计算所述字体样式的字体配置比例;
根据所述字体配置比例和所述字体样式值配置所述字体样式。
5.一种移动终端样式配置装置,其特征在于,所述移动终端样式配置装置包括:
第一获取模块,用于当侦测到配置指令时,根据所述配置指令获取移动终端显示页面的待配置样式,其中,所述待配置样式包括移动终端显示页面的字体样式、水平样式和/或垂直样式;
第二获取模块,用于若所述待配置样式在预设样式列表中,则基于所述待配置样式中的关键词对所述待配置样式进行正则判断,以确定所述待配置样式为所述水平样式或所述垂直样式;和/或,根据预设表达式判断所述待配置样式是否为所述字体样式;基于所述水平样式、垂直样式或字体样式,获取所述移动终端中与所述待配置样式对应的属性值,以及获取与所述待配置样式对应的样式值;
配置模块,用于根据所述属性值和所述样式值配置所述待配置样式。
6.如权利要求5所述的移动终端样式配置装置,其特征在于,若所述水平样式在所述预设样式列表中,所述第二获取模块还用于获取所述移动终端显示页面的默认宽度值、目标宽度值和所述水平样式所对应的水平样式值;
所述配置模块包括:
第一计算单元,用于根据所述默认宽度值和所述目标宽度值计算所述水平样式的水平配置比例;
第一配置单元,用于根据所述水平配置比例和所述水平样式值之间的乘积配置所述水平样式。
7.如权利要求5所述的移动终端样式配置装置,其特征在于,若所述垂直样式在所述预设样式列表中,所述第二获取模块还用于获取所述移动终端显示页面的默认高度值、目标高度值和所述垂直样式所对应的垂直样式值;
所述配置模块还包括:
第二计算单元,用于根据所述默认高度值和所述目标高度值计算所述垂直样式的垂直配置比例;
第二配置单元,用于根据所述垂直配置比例和所述垂直样式值之间的乘积配置所述垂直样式。
8.如权利要求5所述的移动终端样式配置装置,其特征在于,若所述字体样式在所述预设样式列表中,所述第二获取模块还用于获取所述移动终端显示页面的默认字体高度值、目标高度值和字体样式值;
所述配置模块还包括:
第三计算单元,用于根据所述默认字体高度值和所述目标高度值计算所述字体样式的字体配置比例;
第三配置单元,用于根据所述字体配置比例和所述字体样式值配置所述字体样式。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710091332.9A CN108459854B (zh) | 2017-02-20 | 2017-02-20 | 移动终端样式配置方法和装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710091332.9A CN108459854B (zh) | 2017-02-20 | 2017-02-20 | 移动终端样式配置方法和装置 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN108459854A CN108459854A (zh) | 2018-08-28 |
CN108459854B true CN108459854B (zh) | 2021-07-06 |
Family
ID=63228772
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201710091332.9A Active CN108459854B (zh) | 2017-02-20 | 2017-02-20 | 移动终端样式配置方法和装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN108459854B (zh) |
Families Citing this family (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110209447B (zh) * | 2019-04-28 | 2023-02-28 | 五八有限公司 | 一种列表页数据显示方法以及列表页数据显示装置 |
Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105786987A (zh) * | 2016-02-17 | 2016-07-20 | 中国建设银行股份有限公司 | 一种页面配置方法和装置 |
CN105989069A (zh) * | 2015-02-10 | 2016-10-05 | 中国移动通信集团云南有限公司 | 网页适配调整方法及装置 |
CN106294816A (zh) * | 2016-08-16 | 2017-01-04 | 腾讯科技(深圳)有限公司 | 页面信息的处理方法和装置 |
CN106354748A (zh) * | 2016-08-15 | 2017-01-25 | 北京数码视讯科技股份有限公司 | 一种网页生成方法和装置 |
CN106406839A (zh) * | 2015-07-31 | 2017-02-15 | 华为软件技术有限公司 | 屏幕适配文件的处理方法和装置 |
Family Cites Families (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US10051052B2 (en) * | 2014-11-18 | 2018-08-14 | Red Hat, Inc. | Replication with adustable consistency levels |
-
2017
- 2017-02-20 CN CN201710091332.9A patent/CN108459854B/zh active Active
Patent Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105989069A (zh) * | 2015-02-10 | 2016-10-05 | 中国移动通信集团云南有限公司 | 网页适配调整方法及装置 |
CN106406839A (zh) * | 2015-07-31 | 2017-02-15 | 华为软件技术有限公司 | 屏幕适配文件的处理方法和装置 |
CN105786987A (zh) * | 2016-02-17 | 2016-07-20 | 中国建设银行股份有限公司 | 一种页面配置方法和装置 |
CN106354748A (zh) * | 2016-08-15 | 2017-01-25 | 北京数码视讯科技股份有限公司 | 一种网页生成方法和装置 |
CN106294816A (zh) * | 2016-08-16 | 2017-01-04 | 腾讯科技(深圳)有限公司 | 页面信息的处理方法和装置 |
Also Published As
Publication number | Publication date |
---|---|
CN108459854A (zh) | 2018-08-28 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
KR101494844B1 (ko) | 메타 데이터를 이용한 차트 변환 시스템 및 그 방법 | |
US10908928B2 (en) | Rules-based workflow messaging | |
CN105760290B (zh) | 基于网页前端测试的问题定位方法及相关装置、系统 | |
US9117314B2 (en) | Information output apparatus, method, and recording medium for displaying information on a video display | |
TW201329852A (zh) | 網頁瀏覽器中之網頁應用程式與輔助裝置的模擬、網頁應用程式開發工具及使用其之方法 | |
US9619440B2 (en) | Document conversion apparatus | |
CN106610829B (zh) | 网页截图方法和装置 | |
CN103914375A (zh) | 一种自绘界面软件的测试方法和装置 | |
US20150220236A1 (en) | Post-designing method and apparatus based on variant configuration in development of graphic user interface | |
CN109992750B (zh) | 表格对象筛选方法、装置、电子设备及存储介质 | |
CN108459854B (zh) | 移动终端样式配置方法和装置 | |
CN110837368B (zh) | 一种数据处理的方法、装置及电子设备 | |
CN105718228B (zh) | 动态内容显示的方法和装置 | |
CN110674437A (zh) | 网页页面数据转换成pdf附件的方法与装置 | |
CN109857964B (zh) | 一种页面操作的热力图绘制方法、装置、存储介质及处理器 | |
CN111913566A (zh) | 数据处理方法、装置、电子设备及计算机存储介质 | |
CN103294463A (zh) | 一种编辑系统及方法 | |
CN105335295A (zh) | 响应式布局界面的测试方法、系统及浏览器 | |
CN104793837A (zh) | 图形生成方法及装置 | |
CN117112012A (zh) | 应用配置生成方法、装置、设备及介质 | |
CN110472171A (zh) | 基于插件上传图片的方法、插件系统、设备及存储介质 | |
CN110928540A (zh) | 一种页面生成方法及装置 | |
CN108846883B (zh) | 分形图快速绘制方法、系统、用户设备及存储介质 | |
CN112445693B (zh) | 一种页面更新检测方法、装置、设备及存储介质 | |
CN111580909A (zh) | 图片生成方法、装置、设备和存储介质 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |