CN110888574A - 页面显示的自适配方法、装置、设备及计算机存储介质 - Google Patents

页面显示的自适配方法、装置、设备及计算机存储介质 Download PDF

Info

Publication number
CN110888574A
CN110888574A CN201910971899.4A CN201910971899A CN110888574A CN 110888574 A CN110888574 A CN 110888574A CN 201910971899 A CN201910971899 A CN 201910971899A CN 110888574 A CN110888574 A CN 110888574A
Authority
CN
China
Prior art keywords
display
size
page
code
transplanting
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.)
Pending
Application number
CN201910971899.4A
Other languages
English (en)
Inventor
张克明
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Ping An Puhui Enterprise Management Co Ltd
Original Assignee
Ping An Puhui Enterprise Management Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Ping An Puhui Enterprise Management Co Ltd filed Critical Ping An Puhui Enterprise Management Co Ltd
Priority to CN201910971899.4A priority Critical patent/CN110888574A/zh
Publication of CN110888574A publication Critical patent/CN110888574A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/0483—Interaction with page-structured environments, e.g. book metaphor
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/451—Execution arrangements for user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Software Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Controls And Circuits For Display Device (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本发明公开一种页面显示的自适配方法、装置、设备及计算机存储介质，所述方法包括：当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素，并将所述绝对元素转换为相对元素，生成移植显示代码；当接收到基于终端发送的启动指令时，控制所述移植显示代码运行；根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面。本方案在开发过程中通过将显示代码中的绝对元素转换为相对元素，生成为支持自适配的移植显示代码，进而调整移植显示代码的相对元素，以生成与显示页面相适配的显示页面，提高了显示代码的调整效率，确保了调整的准确性。

Description

页面显示的自适配方法、装置、设备及计算机存储介质
技术领域
本发明主要涉及智能终端技术领域，具体地说，涉及一种页面显示的自适配方法、装置、设备及计算机存储介质。
背景技术
随着智能终端的发展，各种型号和尺寸的智能终端层出不穷，不同型号和尺寸的智能终端之间所使用显示屏幕的尺寸多种多样。开发人员在针对不同尺寸的显示屏幕开发相同功能的显示代码时，通常以适用于某一尺寸的显示屏幕的显示代码为基础，开发适用于其他尺寸的显示屏幕的显示代码。
为了使显示代码所生成的显示页面在不同尺寸的显示屏幕之间具有相同的显示效果，开发过程中需要对作为基础的显示代码进行调整，将其中专适用于某一尺寸的显示屏幕的代码调整为适用于其他尺寸的显示屏幕。该调整过程因显示代码的数据量大而增加了开发人员的工作量，调整效率低，且调整过程繁琐，容易出错。
发明内容
本发明的主要目的是提供一种页面显示的自适配方法、装置、设备及计算机存储介质，旨在解决现有技术中对显示代码的调整效率低，容易出错的问题。
为实现上述目的，本发明提供一种页面显示的自适配方法，所述页面显示的自适配方法包括以下步骤：
当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素，并将所述绝对元素转换为相对元素，生成移植显示代码；
当接收到基于终端发送的启动指令时，控制所述移植显示代码运行；
根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面。
优选地，所述根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面的步骤包括：
检测所述终端的显示尺寸以及所述移植显示代码运行所生成显示页面的页面尺寸，并在所述页面尺寸和所述显示尺寸之间做比值，生成比例关系；
根据所述显示页面中的基准元素和所述比例关系，对所述相对元素进行调整，并调整所述页面尺寸，生成与所述显示尺寸相适配的显示页面，其中所述基准元素为与所述显示页面对应的HTML根元素。
优选地，所述生成与所述显示尺寸相适配的显示页面的步骤之后包括：
当接收到对所述显示页面中显示字体的排版指令时，读取所述排版指令中携带的排版尺寸；
检测所述显示页面中显示字体的第一字体尺寸，并根据所述第一字体尺寸和所述排版尺寸，生成第一尺寸比例；
根据所述第一尺寸比例，对所述显示页面中的显示字体进行缩放。
优选地，所述生成与所述显示尺寸相适配的显示页面的步骤之后包括：
读取与所述显示页面中显示字体对应的历史排版尺寸，并检测所述显示页面中显示字体的第二字体尺寸，
根据所述第二字体尺寸和所述历史排版尺寸，生成第二尺寸比例；
根据所述第二尺寸比例，对所述显示页面中的显示字体进行缩放。
优选地，所述当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素的步骤包括：
当接收到对所述显示代码的移植指令时，读取所述预设配置信息；
将所述预设配置信息中的元素标识和所述显示代码对比，查找所述显示代码中与所述元素标识对应的绝对元素。
优选地，所述当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素的步骤之前包括：
当接收配置指令时，读取与所述配置指令对应的配置信息，并将所述配置信息添加到所述移植工具的配置文件中形成预设配置信息，其中所述配置指令用于触发对与所述显示代码对应移植工具的配置操作。
优选地，所述将所述绝对元素转换为相对元素，生成移植显示代码的步骤包括：
根据所述显示代码中的字号标识，确定转换关系，并根据所述转换关系，对所述绝对元素进行转换，得到与所述绝对元素对应的相对元素；
在所述显示代码中的绝对元素均转换为相对元素后，基于所述移植工具对经转换的显示代码进行打包操作，生成移植显示代码。
此外，为实现上述目的，本发明还提出一种页面显示的自适配装置，所述页面显示的自适配装置包括：
转换模块，用于当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素，并将所述绝对元素转换为相对元素，生成移植显示代码；
控制模块，用于当接收到基于终端发送的启动指令时，控制所述移植显示代码运行；
生成模块，用于根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面。
此外，为实现上述目的，本发明还提出一种页面显示的自适配设备，所述页面显示的自适配设备包括：存储器、处理器、通信总线以及存储在所述存储器上的页面显示的自适配程序；
所述通信总线用于实现处理器和存储器之间的连接通信；
所述处理器用于执行所述页面显示的自适配程序，以实现以下步骤：
当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素，并将所述绝对元素转换为相对元素，生成移植显示代码；
当接收到基于终端发送的启动指令时，控制所述移植显示代码运行；
根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面。
此外，为实现上述目的，本发明还提供一种计算机存储介质，所述计算机存储介质存储有一个或者一个以上程序，所述一个或者一个以上程序可被一个或者一个以上的处理器执行以用于：
当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素，并将所述绝对元素转换为相对元素，生成移植显示代码；
当接收到基于终端发送的启动指令时，控制所述移植显示代码运行；
根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面。
本实施例的页面显示的自适配方法，通过预先设置用于将绝对元素更改为相对元素的预设配置信息，在对显示代码的移植过程中，依据预设配置信息查找显示代码中不支持调整的绝对元素，并将其转换为支持调整的相对元素，生成支持自适配的移植显示代码；在终端具有启动与移植显示代码对应显示页面的需求时，依据启动指令控制移植显示代码运行，并依据终端的显示尺寸对移植显示代码中的相对元素进行调整，以将待显示代码中的相对元素调整为与终端的显示尺寸相适应，生成与显示尺寸相适配的显示页面；以此实现不同显示尺寸之间显示页面的自适配，避免了开发人员的调整，提高了调整效率，同时将绝对元素统一更改为相对元素，简化了调整流程，确保了调整的准确性。
附图说明
图1是本发明的页面显示的自适配方法第一实施例的流程示意图；
图2是本发明的页面显示的自适配装置第一实施例的功能模块示意图；
图3是本发明实施例方法涉及的硬件运行环境的设备结构示意图。
本发明目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。
具体实施方式
应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。
本发明提供一种页面显示的自适配方法。
请参照图1，图1为本发明页面显示的自适配方法第一实施例的流程示意图。在本实施例中，所述页面显示的自适配方法包括：
步骤S10，当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素，并将所述绝对元素转换为相对元素，生成移植显示代码；
本发明页面显示的自适配方法应用于服务器，适用于通过服务器将同一显示代码所生成的显示页面，在具有不同显示尺寸的终端上进行适配，以使得显示页面在各终端上的显示效果一致。具体地，针对具有新显示尺寸的新型号移动终端的显示页面，开发人员在生成原有显示页面的显示代码的基础上进行移植开发，对原有显示代码进行适合于新型号移动终端的更改，再将更改后的显示代码移植到新型号移动终端中使用。
进一步地，将显示代码中专门适用于原移动终端使用的不可调整元素作为绝对元素，该类绝对元素主要为以px样式存在的元素；px样式表征前端页面中的字体大小以px元素存在，px元素为固定的绝对的像素属性，一般默认大小为16px；px样式为CSS样式表中的一种，CSS样式表(Cascading Style Sheets，层叠样式表)是一种用来表现HTML(HyperTextMarkup Language，超文本标记语言)或XML(Extensible Markup Language，可扩展标记语言)等文件样式的计算机语言，其不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。为了使得显示代码适用于新型号移动终端，需要将该类绝对元素转换为可调整的相对元素。相对元素主要以字体单位rem存在的元素，字体单位rem是CSS3(CSS技术的升级版本)的相对单位，使用其为元素设定字体大小时，字体是相对大小，且相对的是HTML根元素，通过字体单位rem可以只修改根元素即实现成比例地调整所有字体大小。
更进一步地，预先设置可对绝对元素进行查找并转换的预设配置信息，当具有对显示代码进行移植的需求时，由开发人员触发针对显示代码进行移植的移植指令；服务器在接收到该移植指令时，调用预设配置信息对显示代码中的绝对元素进行查找和转换操作。其中，预设配置信息在触发移植指令之前进行设置；具体地，当接收到对显示代码的移植指令时，根据预设配置信息查找显示代码中的绝对元素的步骤之前包括：
当接收配置指令时，读取与所述配置指令对应的配置信息，并将所述配置信息添加到所述移植工具的配置文件中形成预设配置信息，其中所述配置指令用于触发对与所述显示代码对应移植工具的配置操作。
本实施例中的移植操作基于移植工具进行，且移植工具具体为gulp工具；gulp工具是基于node.js的一个前端自动化构建工具，包括配置文件gulpfile.js；在gulp配置文件中定义诸如打包、编译等各种任务，再通过gulp命令触发各个gulp插件执行各个任务，实现任务对应的功能。同时gulp工具可通过其配置文件的配置实现绝对元素的查找和转换，将对显示代码进行移植的gulp工具作为与显示代码对应的移植工具，由开发人员触发对该与显示代码对应移植工具进行配置的配置指令。服务器在接收到该配置指令时，读取其中的配置信息；该配置信息为指示对显示代码中所有的绝对元素进行查找，并将查找得到的绝对元素转换为相对元素的信息，即查找样式元素为px样式的元素，并将其样式元素更改为字体单位rem的信息。将该读取的配置信息配置到移植工具的配置文件中，形成为配置文件的预设配置信息。在通过配置工具依据配置文件对显示代码进行移植时，先依据该预设配置信息对显示代码中的绝对元素进行查找和更改。
进一步地，所述当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素的步骤包括：
步骤S11，当接收到对所述显示代码的移植指令时，读取所述预设配置信息；
服务器在接收到对显示代码的移植指令后，对配置于移植工具配置文件中的预设配置信息进行读取操作，以依据预设配置信息中所指示的绝对元素进行查找。
步骤S12，将所述预设配置信息中的元素标识和所述显示代码对比，查找所述显示代码中与所述元素标识对应的绝对元素。
进一步地，预设配置信息中对绝对元素通过元素标识进行指示，显示代码中不同的元素类型具有不同的元素标识，将表征绝对元素的元素标识作为预设配置信息中的元素标识，以表示所需要查找的绝对元素。服务器在从配置文件中查找得到预设配置信息后，依据预设配置信息中元素标识的指示，对显示代码中各代码行按照排列顺序进行逐行查找；查找各代码行中所存在的样式元素为PX样式的绝对元素，且对于存在样式元素为px样式的代码行进行标记，以便于依据标记的代码行对各绝对元素进行转换。
更进一步地，在各代码行均进行查找后，将具有标记的各代码行作为待更改代码行进行转换，将其中样式元素为px样式的绝对元素转换为字体单位rem的相对元素。在将各待更改代码行中的绝对元素均转换为相对元素之后，显示代码生成为移植显示代码。具体地，将绝对元素转换为相对元素，生成移植显示代码的步骤包括：
步骤S13，根据所述显示代码中的字号标识，确定转换关系，并根据所述转换关系，对所述绝对元素进行转换，得到与所述绝对元素对应的相对元素；
可理解地，显示代码中由px样式所设定的字体大小和rem元素所设定的字体大小不相同，两者之间的差异性与显示代码中设定的字号相关，而绝对元素和相对元素之间转换所依据的转换关系与两者之间差异性的大小相关。如设定的字号为16px，则两者之间相差16倍，对应的转换关系为rem＝px/16，而当设定的字号为10px，则两者之间相差10倍，对应的转换关系为rem＝px/10。显示代码中所设定的字号由字号标识表征，读取显示代码中的字号标识，并依据其确定绝对元素和相对元素之间的转换关系；此后依据该转换关系，对显示代码中待更改行中的绝对元素进行转换，将其转换为相对元素。
步骤S14，在所述显示代码中的绝对元素均转换为相对元素后，基于所述移植工具对经转换的显示代码进行打包操作，生成移植显示代码。
进一步地，对于已进行转换的绝对元素分配已转换标识符，并检测待更改代码行中的各项绝对元素是否均携带有该已转换标识符；若均携带该已转换标识符，则判断对显示代码中所具有的样式元素为px样式的绝对元素均转换为相对元素。此后通过移植工具对经转换的显示代码进行打包操作，将显示代码生成为移植显示代码。
步骤S20，当接收到基于终端发送的启动指令时，控制所述移植显示代码运行；
更进一步地，显示代码生成为移植显示代码后，即可发布到网络平台中，以供有需求的终端用户下载使用。终端用户在下载使用的过程中向服务器发送启动指令，当服务器接收到该启动指时，则判定终端用户具有将与移植显示代码对应显示页面显示的需求。从而控制移植显示代码运行，以生成显示页面显示在终端的显示界面中。
步骤S30，根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面。
可理解地，不同的终端所具有的显示尺寸不同，为了使经移植显示代码运行所生成的显示页面以及显示页面中的字体与终端的显示尺寸适配，检测终端中屏幕的显示尺寸，并根据该显示尺寸，对移植显示代码中的相对元素进行调整，以通过调整生成与显示尺寸相适配的显示页面。具体地，根据终端的显示尺寸，调整移植显示代码中的相对元素，生成与显示尺寸相适配的显示页面的步骤包括：
步骤S31，检测所述终端的显示尺寸以及所述移植显示代码运行所生成显示页面的页面尺寸，并在所述页面尺寸和所述显示尺寸之间做比值，生成比例关系；
进一步地，在检测终端中屏幕的显示尺寸的同时，还需要对经移植显示代码运行所生成显示页面的页面尺寸进行检测，该页面尺寸依据移植显示代码中的设定尺寸进行生成，可能不适配终端中屏幕的显示尺寸；从而需要依据两者之间的比例大小关系，对显示页面的页面尺寸进行调整，以使得页面尺寸与显示尺寸适配。将显示尺寸和页面尺寸做比值，生成两者之间的比例关系，该比例关系表征了终端屏幕的实际尺寸和显示页面的显示大小之间的关系。当比例关系等于1时，则说明实际尺寸和显示大小之间适配，不需要进行调整；当比例关系小于1时，则说明实际尺寸大于显示大小，需要对显示页面进行放大处理；当比例关系大于1时，则说明实际尺寸小于显示大小，需要对显示页面进行缩小处理。
可理解地，移植显示代码所生成的字体在显示页面中显示，与显示页面具有相同的大小比例关系，在显示页面不适配终端中屏幕的显示尺寸时，该字体相应的也不适配终端中屏幕的显示尺寸；从而在依据比例关系对显示页面的页面尺寸进行调整的同时，相应的对显示页面中字号大小进行调整，而字号大小经转换为相对元素，支持放大和缩小，调整不会导致失真。
需要说明的是，因页面尺寸和显示尺寸中包括长度方向和宽度方向的两项尺寸，当两项尺寸之间具有相同的比例关系，即页面尺寸在长度方向的尺寸和显示尺寸在长度方向的尺寸之间的长度比值，与页面尺寸在宽度方向的尺寸和显示尺寸在宽度方向的尺寸之间的宽度比值相同时，既可将长度比值作为比例关系，也可用宽度比值作为比例关系。对于长度比值和宽度比值不相同的情况，则将两者同时作为比例关系，以分别依据长度比值和宽度比值对显示页面进行调整。
步骤S32，根据所述显示页面中的基准元素和所述比例关系，对所述相对元素进行调整，并调整所述页面尺寸，生成与所述显示尺寸相适配的显示页面，其中所述基准元素为与所述显示页面对应的HTML根元素。
更进一步地，因以字体单位rem存在的相对元素具有通过修改HTML根元素实现成比例调整所有字体的特性，从而可将与显示页面对应的HTML根元素作为显示页面的基准元素，并依据该基准元素将显示页面中的相对元素按照比例关系进行调整；通过将基准元素按照比例关系中的数值进行调整，实现与相对元素对应的各字体的缩放。
同时，依据比例关系，对显示页面进行调整，以使得显示页面的显示大小和终端中屏幕的实际尺寸大小相符合；在调整过程中，依据比例关系所表征的数值对显示页面的显示大小进行放大和缩小。如比例关系的数值为0.8，则说明显示页面的显示尺寸为终端的显示尺寸的0.8倍，从而对显示页面进行放大的大小为1.25倍，以使得放大后的显示页面的显示尺寸和终端中屏幕的显示尺寸一致；此时相应地对显示页面中的字号大小进行调整，将显示页面中与相对元素对应的各字体放大1.25倍，以确保终端对经移植显示代码所生成的显示页面的显示效果。
本实施例的页面显示的自适配方法，通过预先设置用于将绝对元素更改为相对元素的预设配置信息，在对显示代码的移植过程中，依据预设配置信息查找显示代码中不支持调整的绝对元素，并将其转换为支持调整的相对元素，生成支持自适配的移植显示代码；在终端具有启动与移植显示代码对应显示页面的需求时，依据启动指令控制移植显示代码运行，并依据终端的显示尺寸对移植显示代码中的相对元素进行调整，以将待显示代码中的相对元素调整为与终端的显示尺寸相适应，生成与显示尺寸相适配的显示页面；以此实现不同显示尺寸之间显示页面的自适配，避免了开发人员的调整，提高了调整效率，同时将绝对元素统一更改为相对元素，简化了调整流程，确保了调整的准确性。
进一步地，基于本发明页面显示的自适配方法第一实施例，提出本发明页面显示的自适配方法的第二实时例，在第二实施例中，所述生成与所述显示尺寸相适配的显示页面的步骤之后包括：
步骤a1，当接收到对所述显示页面中显示字体的排版指令时，读取所述排版指令中携带的排版尺寸；
考虑到终端用户对终端的使用需求不相同，某些终端用户需要对显示页面中的显示字体放大显示，而另一些终端用户需要对显示字体缩小显示，该放大和缩小的需求可通过终端用户由终端发起排版指令实现。当服务器接收到终端用户对显示页面中显示字体发起的排版指令时，读取其中所携带的排版尺寸，该排版尺寸为终端用户所需求的显示尺寸，表征对显示页面中显示字体所需求的缩放大小。
步骤a2，检测所述显示页面中显示字体的第一字体尺寸，并根据所述第一字体尺寸和所述排版尺寸，生成第一尺寸比例；
进一步地，对显示页面中显示字体实际显示的尺寸进行检测，生成第一字体尺寸，并在第一字体尺寸和排版尺寸之间做比值，生成第一尺寸比例，以依据第一尺寸比例对显示字体实际显示的尺寸进行调整，满足终端用户对显示字体的显示尺寸需求。
步骤a3，根据所述第一尺寸比例，对所述显示页面中的显示字体进行缩放。
更进一步地，依据第一尺寸比例对显示页面中由相对元素对应生成的显示字体进行缩放，在第一尺寸比例大于数值1时，依据该第一尺寸比例对显示字体进行缩小操作；在第一尺寸比例小于数值1时，依据第一尺寸比例对显示字体进行放大操作。
本实施例通过将体现终端用户需求的排版指令，生成为用于缩放的第一尺寸比例，进而对显示字体进行缩放，确保了显示页面中的显示字体满足终端用户的显示需求。
进一步地，基于本发明页面显示的自适配方法第一实施例，提出本发明页面显示的自适配方法的第三实时例，在第三实施例中，所述生成与所述显示尺寸相适配的显示页面的步骤之后包括：
步骤b1，读取与所述显示页面中显示字体对应的历史排版尺寸，并检测所述显示页面中显示字体的第二字体尺寸，
本实施例在生成与显示尺寸相适配的显示页面之后，对显示页面中的显示字体设置有依据终端用户的历史排版尺寸进行自动调整的机制；该历史排版尺寸为终端用户以往对显示页面中显示字体进行调整的尺寸，体现了终端用户对显示字体的显示尺寸需求。具体地，考虑到终端用户以往各次对显示字体的设置具有差异性，使得各历史排版尺寸不相同；从而先对经由各历史排版指令携带的历史排版尺寸进行读取，再将读取得到的历史排版尺寸进行均值化处理；该经均值化处理得到的历史排版尺寸即为与显示页面中显示字体对应最新的历史排版尺寸。此后，对显示页面中显示字体实际显示的尺寸进行检测，生成第二字体尺寸；通过历史排版尺寸和第二字体尺寸分别表征用户对字体显示大小的需求以及显示页面中实现显示的字体大小。
步骤b2，根据所述第二字体尺寸和所述历史排版尺寸，生成第二尺寸比例；
进一步地，在第二字体尺寸和历史排版尺寸之间做比值，生成表征两者之间大小关系的第二尺寸比例，该第二尺寸比例表征了需求的字体显示大小和实际显示的字体大小之间的差异性，作为显示页面缩放大小的依据。
步骤b3，根据所述第二尺寸比例，对所述显示页面中的显示字体进行缩放。
更进一步地，依据第二尺寸比例对显示页面中由相对元素对应生成的显示字体进行缩放，在第二尺寸比例大于数值1时，依据该第二尺寸比例对显示字体进行缩小操作；在第二尺寸比例小于数值1时，依据第二尺寸比例对显示字体进行放大操作，以使得显示页面中的显示字体与终端用户通过历史操作所体现的需求相符合，不需要终端用户的操作即可满足终端用户对显示字体的显示尺寸需求。
需要说明的是，本第三实施例可与第二实施例结合，对显示页面中显示字体的显示大小进行调整；先通过第三实施例的方案将显示字体调整为终端用户以往所需求的显示大小，若该显示大小满足终端用户的需求，则显示字体以该显示大小显示；若该显示大小不满足终端用户的需求，则通过第二实施例的方案触发排版指令，对显示字体的显示大小进行调整，以使得显示字体满足终端用户的显示需求。
本实施例依据体现终端用户以往需求的显示大小的历史排版尺寸，生成用于缩放的第二尺寸比例，以其作为依据对显示字体进行缩放，确保了显示页面中的显示字体与终端用户历史所需求的显示大小相符合，不需要触发操作即可满足终端用户对显示字体的显示尺寸需求，方便了终端用户的使用。
此外，请参照图2，本发明提供一种页面显示的自适配装置，在本发明页面显示的自适配装置第一实施例中，所述页面显示的自适配装置包括：
转换模块10，用于当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素，并将所述绝对元素转换为相对元素，生成移植显示代码；
控制模块20，用于当接收到基于终端发送的启动指令时，控制所述移植显示代码运行；
生成模块30，用于根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面。
本实施例的页面显示的自适配装置，通过预先设置用于将绝对元素更改为相对元素的预设配置信息，在对显示代码的移植过程中，转换模块10依据预设配置信息查找显示代码中不支持调整的绝对元素，并将其转换为支持调整的相对元素，生成支持自适配的移植显示代码；在终端具有启动与移植显示代码对应显示页面的需求时，控制模块20依据启动指令控制移植显示代码运行，并由生成模块30依据终端的显示尺寸对移植显示代码中的相对元素进行调整，以将待显示代码中的相对元素调整为与终端的显示尺寸相适应，生成与显示尺寸相适配的显示页面；以此实现不同显示尺寸之间显示页面的自适配，避免了开发人员的调整，提高了调整效率，同时将绝对元素统一更改为相对元素，简化了调整流程，确保了调整的准确性。
进一步地，在本发明页面显示的自适配装置另一实施例中，所述生成模块还包括：
检测单元，用于检测所述终端的显示尺寸以及所述移植显示代码运行所生成显示页面的页面尺寸，并在所述页面尺寸和所述显示尺寸之间做比值，生成比例关系；
生成单元，用于根据所述显示页面中的基准元素和所述比例关系，对所述相对元素进行调整，并调整所述页面尺寸，生成与所述显示尺寸相适配的显示页面，其中所述基准元素为与所述显示页面对应的HTML根元素。
进一步地，在本发明页面显示的自适配装置另一实施例中，所述页面显示的自适配装置还包括：
第一读取模块，用于当接收到对所述显示页面中显示字体的排版指令时，读取所述排版指令中携带的排版尺寸；
检测模块，用于检测所述显示页面中显示字体的第一字体尺寸，并根据所述第一字体尺寸和所述排版尺寸，生成第一尺寸比例；
第一缩放模块，用于根据所述第一尺寸比例，对所述显示页面中的显示字体进行缩放。
进一步地，在本发明页面显示的自适配装置另一实施例中，所述页面显示的自适配装置还包括：
第二读取模块，用于读取与所述显示页面中显示字体对应的历史排版尺寸，并检测所述显示页面中显示字体的第二字体尺寸，
所述生成模块还用于根据所述第二字体尺寸和所述历史排版尺寸，生成第二尺寸比例；
第二缩放模块，用于根据所述第二尺寸比例，对所述显示页面中的显示字体进行缩放。
进一步地，在本发明页面显示的自适配装置另一实施例中，所述转换模块还包括：
读取单元，用于当接收到对所述显示代码的移植指令时，读取所述预设配置信息；
查找单元，用于将所述预设配置信息中的元素标识和所述显示代码对比，查找所述显示代码中与所述元素标识对应的绝对元素。
进一步地，在本发明页面显示的自适配装置另一实施例中，所述页面显示的自适配装置还包括：
添加模块，用于当接收配置指令时，读取与所述配置指令对应的配置信息，并将所述配置信息添加到所述移植工具的配置文件中形成预设配置信息，其中所述配置指令用于触发对与所述显示代码对应移植工具的配置操作。
进一步地，在本发明页面显示的自适配装置另一实施例中，所述转换模块还包括：
转换单元，用于根据所述显示代码中的字号标识，确定转换关系，并根据所述转换关系，对所述绝对元素进行转换，得到与所述绝对元素对应的相对元素；
打包单元，用于在所述显示代码中的绝对元素均转换为相对元素后，基于所述移植工具对经转换的显示代码进行打包操作，生成移植显示代码。
其中，上述页面显示的自适配装置的各虚拟功能模块存储于图3所示页面显示的自适配设备的存储器1005中，处理器1001执行页面显示的自适配程序时，实现图2所示实施例中各个模块的功能。
参照图3，图3是本发明实施例方法涉及的硬件运行环境的设备结构示意图。
本发明实施例页面显示的自适配设备可以是PC(personal computer，个人计算机)，也可以是智能手机、平板电脑、电子书阅读器、便携计算机等终端设备。
如图3所示，该页面显示的自适配设备可以包括：处理器1001，例如CPU(CentralProcessing Unit，中央处理器)，存储器1005，通信总线1002。其中，通信总线1002用于实现处理器1001和存储器1005之间的连接通信。存储器1005可以是高速RAM(random accessmemory，随机存取存储器)，也可以是稳定的存储器(non-volatile memory)，例如磁盘存储器。存储器1005可选的还可以是独立于前述处理器1001的存储装置。
可选地，该页面显示的自适配设备还可以包括用户接口、网络接口、摄像头、RF(Radio Frequency，射频)电路，传感器、音频电路、WiFi(Wireless Fidelity，无线宽带)模块等等。用户接口可以包括显示屏(Display)、输入单元比如键盘(Keyboard)，可选用户接口还可以包括标准的有线接口、无线接口。网络接口可选的可以包括标准的有线接口、无线接口(如WI-FI接口)。
本领域技术人员可以理解，图3中示出的页面显示的自适配设备结构并不构成对页面显示的自适配设备的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。
如图3所示，作为一种计算机存储介质的存储器1005中可以包括操作系统、网络通信模块以及页面显示的自适配程序。操作系统是管理和控制页面显示的自适配设备硬件和软件资源的程序，支持页面显示的自适配程序以及其它软件和/或程序的运行。网络通信模块用于实现存储器1005内部各组件之间的通信，以及与页面显示的自适配设备中其它硬件和软件之间通信。
在图3所示的页面显示的自适配设备中，处理器1001用于执行存储器1005中存储的页面显示的自适配程序，实现上述页面显示的自适配方法各实施例中的步骤。
本发明提供了一种计算机存储介质，所述计算机存储介质存储有一个或者一个以上程序，所述一个或者一个以上程序还可被一个或者一个以上的处理器执行以用于实现上述页面显示的自适配方法各实施例中的步骤。
还需要说明的是，在本文中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者装置不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者装置所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括该要素的过程、方法、物品或者装置中还存在另外的相同要素。
上述本发明实施例序号仅仅为了描述，不代表实施例的优劣。
通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在如上所述的一个计算机存储介质(如ROM/RAM、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是手机，计算机，服务器，或者网络设备等)执行本发明各个实施例所述的方法。
以上所述仅为本发明的优选实施例，并非因此限制本发明的专利范围，凡是在本发明的构思下，利用本发明说明书及附图内容所作的等效结构变换，或直接/间接运用在其他相关的技术领域均包括在本发明的专利保护范围内。

Claims (10)

1.一种页面显示的自适配方法，其特征在于，所述页面显示自适配方法包括以下步骤：
当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素，并将所述绝对元素转换为相对元素，生成移植显示代码；
当接收到基于终端发送的启动指令时，控制所述移植显示代码运行；
根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面。
2.如权利要求1所述的页面显示的自适配方法，其特征在于，所述根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面的步骤包括：
检测所述终端的显示尺寸以及所述移植显示代码运行所生成显示页面的页面尺寸，并在所述页面尺寸和所述显示尺寸之间做比值，生成比例关系；
根据所述显示页面中的基准元素和所述比例关系，对所述相对元素进行调整，并调整所述页面尺寸，生成与所述显示尺寸相适配的显示页面，其中所述基准元素为与所述显示页面对应的HTML根元素。
3.如权利要求1所述的页面显示的自适配方法，其特征在于，所述生成与所述显示尺寸相适配的显示页面的步骤之后包括：
当接收到对所述显示页面中显示字体的排版指令时，读取所述排版指令中携带的排版尺寸；
检测所述显示页面中显示字体的第一字体尺寸，并根据所述第一字体尺寸和所述排版尺寸，生成第一尺寸比例；
根据所述第一尺寸比例，对所述显示页面中的显示字体进行缩放。
4.如权利要求1所述的页面显示的自适配方法，其特征在于，所述生成与所述显示尺寸相适配的显示页面的步骤之后包括：
读取与所述显示页面中显示字体对应的历史排版尺寸，并检测所述显示页面中显示字体的第二字体尺寸，
根据所述第二字体尺寸和所述历史排版尺寸，生成第二尺寸比例；
根据所述第二尺寸比例，对所述显示页面中的显示字体进行缩放。
5.如权利要求1-4任一项所述的页面显示的自适配方法，其特征在于，所述当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素的步骤包括：
当接收到对所述显示代码的移植指令时，读取所述预设配置信息；
将所述预设配置信息中的元素标识和所述显示代码对比，查找所述显示代码中与所述元素标识对应的绝对元素。
6.如权利要求1-4任一项所述的页面显示的自适配方法，其特征在于，所述当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素的步骤之前包括：
当接收配置指令时，读取与所述配置指令对应的配置信息，并将所述配置信息添加到所述移植工具的配置文件中形成预设配置信息，其中所述配置指令用于触发对与所述显示代码对应移植工具的配置操作。
7.如权利要求6所述的页面显示的自适配方法，其特征在于，所述将所述绝对元素转换为相对元素，生成移植显示代码的步骤包括：
根据所述显示代码中的字号标识，确定转换关系，并根据所述转换关系，对所述绝对元素进行转换，得到与所述绝对元素对应的相对元素；
在所述显示代码中的绝对元素均转换为相对元素后，基于所述移植工具对经转换的显示代码进行打包操作，生成移植显示代码。
8.一种页面显示的自适配装置，其特征在于，所述页面显示的自适配装置包括：
转换模块，用于当接收到对显示代码的移植指令时，根据预设配置信息查找所述显示代码中的绝对元素，并将所述绝对元素转换为相对元素，生成移植显示代码；
控制模块，用于当接收到基于终端发送的启动指令时，控制所述移植显示代码运行；
生成模块，用于根据所述终端的显示尺寸，调整所述移植显示代码中的相对元素，生成与所述显示尺寸相适配的显示页面。
9.一种页面显示的自适配设备，其特征在于，所述页面显示的自适配设备包括：存储器、处理器、通信总线以及存储在所述存储器上的页面显示的自适配程序；
所述通信总线用于实现处理器和存储器之间的连接通信；
所述处理器用于执行所述页面显示的自适配程序，以实现如权利要求1-7中任一项所述的页面显示的自适配方法的步骤。
10.一种计算机存储介质，其特征在于，所述计算机存储介质上存储有页面显示的自适配程序，所述页面显示的自适配程序被处理器执行时实现如权利要求1-7中任一项所述的页面显示的自适配方法的步骤。
CN201910971899.4A 2019-10-12 2019-10-12 页面显示的自适配方法、装置、设备及计算机存储介质 Pending CN110888574A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201910971899.4A CN110888574A (zh) 2019-10-12 2019-10-12 页面显示的自适配方法、装置、设备及计算机存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201910971899.4A CN110888574A (zh) 2019-10-12 2019-10-12 页面显示的自适配方法、装置、设备及计算机存储介质

Publications (1)

Publication Number Publication Date
CN110888574A true CN110888574A (zh) 2020-03-17

Family

ID=69746123

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201910971899.4A Pending CN110888574A (zh) 2019-10-12 2019-10-12 页面显示的自适配方法、装置、设备及计算机存储介质

Country Status (1)

Country Link
CN (1) CN110888574A (zh)

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111597010A (zh) * 2020-05-27 2020-08-28 北京智美智学科技有限公司 一种Web页面的图片生成方法、装置、打印设备和记录介质
CN113127125A (zh) * 2021-04-22 2021-07-16 康键信息技术（深圳）有限公司 页面自动适配方法、装置、设备及存储介质
CN114296674A (zh) * 2021-12-30 2022-04-08 北京天融信网络安全技术有限公司 屏幕适配方法、装置、计算机设备及存储介质

Citations (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20120110438A1 (en) * 2010-11-03 2012-05-03 Microsoft Corporation Proportional Font Scaling
CN103593196A (zh) * 2013-11-25 2014-02-19 深信服网络科技（深圳）有限公司 页面布局自适应方法及装置
CN106776738A (zh) * 2016-11-18 2017-05-31 北京奇虎科技有限公司 一种网页生成、显示方法和装置
CN107797801A (zh) * 2017-10-20 2018-03-13 江苏电力信息技术有限公司 一种基于多种移动终端界面的适配方法
CN108241505A (zh) * 2016-12-26 2018-07-03 航天信息股份有限公司 一种页面适配方法及装置
CN109254813A (zh) * 2018-08-20 2019-01-22 中国平安人寿保险股份有限公司 屏幕适配方法、装置、计算机设备及存储介质
CN109308155A (zh) * 2018-08-21 2019-02-05 中国平安人寿保险股份有限公司 调整页面的方法、装置、计算机设备及存储介质
CN109725942A (zh) * 2018-12-21 2019-05-07 福建天泉教育科技有限公司 Android设备通用屏幕适配方法、存储介质

Patent Citations (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20120110438A1 (en) * 2010-11-03 2012-05-03 Microsoft Corporation Proportional Font Scaling
CN103593196A (zh) * 2013-11-25 2014-02-19 深信服网络科技（深圳）有限公司 页面布局自适应方法及装置
CN106776738A (zh) * 2016-11-18 2017-05-31 北京奇虎科技有限公司 一种网页生成、显示方法和装置
CN108241505A (zh) * 2016-12-26 2018-07-03 航天信息股份有限公司 一种页面适配方法及装置
CN107797801A (zh) * 2017-10-20 2018-03-13 江苏电力信息技术有限公司 一种基于多种移动终端界面的适配方法
CN109254813A (zh) * 2018-08-20 2019-01-22 中国平安人寿保险股份有限公司 屏幕适配方法、装置、计算机设备及存储介质
CN109308155A (zh) * 2018-08-21 2019-02-05 中国平安人寿保险股份有限公司 调整页面的方法、装置、计算机设备及存储介质
CN109725942A (zh) * 2018-12-21 2019-05-07 福建天泉教育科技有限公司 Android设备通用屏幕适配方法、存储介质

Cited By (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111597010A (zh) * 2020-05-27 2020-08-28 北京智美智学科技有限公司 一种Web页面的图片生成方法、装置、打印设备和记录介质
CN113127125A (zh) * 2021-04-22 2021-07-16 康键信息技术（深圳）有限公司 页面自动适配方法、装置、设备及存储介质
CN113127125B (zh) * 2021-04-22 2024-02-09 康键信息技术（深圳）有限公司 页面自动适配方法、装置、设备及存储介质
CN114296674A (zh) * 2021-12-30 2022-04-08 北京天融信网络安全技术有限公司 屏幕适配方法、装置、计算机设备及存储介质
CN114296674B (zh) * 2021-12-30 2024-03-12 北京天融信网络安全技术有限公司 屏幕适配方法、装置、计算机设备及存储介质

Similar Documents

Publication Publication Date Title
CN110888574A (zh) 页面显示的自适配方法、装置、设备及计算机存储介质
CN109799988B (zh) iOS页面布局方法、终端设备及计算机可读存储介质
CN108427546B (zh) 显示装置的全屏幕适配方法、显示装置及存储介质
CN107247691B (zh) 一种文本信息的显示方法、装置、移动终端及存储介质
CN110955428A (zh) 一种页面显示方法、装置、电子设备及介质
US9117314B2 (en) Information output apparatus, method, and recording medium for displaying information on a video display
US20170353620A1 (en) Information processing apparatus, information processing method, and non-transitory recording medium
CN110618850A (zh) 一种ui界面加载方法、系统及相关装置
CN110895481A (zh) 桌面应用的渲染方法、装置和系统
CN107506180B (zh) 页面调整方法、终端和计算机可读存储介质
CN111222069A (zh) 报表组件调整方法、装置及相关设备
CN113094138B (zh) 界面显示方法、装置、电子设备及存储介质
CN113608776A (zh) 页面配置文件确定方法、装置、电子设备和存储介质
CN112817595A (zh) 界面渲染方法、装置、存储介质及电子设备
CN105739717B (zh) 信息输入方法和装置
CN116009863B (zh) 前端页面渲染方法、设备及存储介质
CN112068828A (zh) 标题控件的生成方法、装置、系统、设备以及介质
CN116484130A (zh) 一种页面加载方法、装置、设备、介质及程序产品
CN111460348A (zh) 文件处理的方法和装置
CN111340705B (zh) 一种拼图软件的应用方法、装置及系统
CN114595413A (zh) 网页布局方法、系统及计算机设备
CN114546359A (zh) Dsl描述文件生成方法、装置、设备及存储介质
CN112908327A (zh) 应用程序的语音控制方法、装置、设备和存储介质
KR20140021847A (ko) 활성화 폴더의 디폴트 지정을 이용한 파일 저장 방법, 그리고 이를 위한 디폴트지정 파일저장 프로그램을 기록한 컴퓨터로 판독가능한 기록매체
CN114594945A (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