[发明专利]一种应用于政务服务终端的页面自适应方法

说明书

本发明公开一种应用于政务服务终端的页面自适应方法，涉及屏幕设备技术领域，针对页面显示于政务服务终端屏幕设备的不适配问题，采用方案包括：设计页面元素的百分比，实现根据页面大小、比例、文字和元素的自动调整；使用流动布局技术，实现页面元素位置的自动调整；基于CSS3媒体查询方法，匹配政务服务终端不同屏幕设备的特征，让不同特征下的CSS代码生效；基于界面的可视化编辑功能，允许政务服务大厅管理人员以所见即所得的方式设计政务服务终端的屏幕界面，实现视频、图片、滚动字幕、音频的手动添加。本发明可以实现页面显示于政务服务终端屏幕设备时的自适应调整，以满足当前政务服务大厅的业务和工作需求，提高部署效率和服务体验。

技术领域

本发明涉及屏幕设备技术领域，具体的说是一种应用于政务服务终端的页面自适应方法。

背景技术

在全市或全省范围内的政务服务大厅中，当政务大厅相关设备配套系统的页面需要显示在大厅服务终端的屏幕设备时，针对不同的屏幕设备尺寸，需要对显示页面进行适应性调节。

为了使显示的页面可以自适应政务服务终端屏幕设备的尺寸，减少人工调节尺寸带来的时间损耗，以及调节不及时时页面无法全部显示或文字过小的问题，设计一种应用于政务服务终端的页面自适应方法。

发明内容

本发明针对目前技术发展的需求和不足之处，提供一种应用于政务服务终端的页面自适应方法，来解决推行全市或全省范围内统一的政务服务大厅相关系统时，需针对不同的政务服务终端屏幕设备分别进行页面适配的问题。

本发明的一种应用于政务服务终端的页面自适应方法，解决上述技术问题采用的技术方案如下：

一种应用于政务服务终端的页面自适应方法，其实现内容包括：

(1)设计页面元素的百分比，实现根据页面大小、比例、文字和元素的自动调整；

(2)使用流动布局技术，实现页面元素位置的自动调整；

(3)基于CSS3媒体查询方法，通过匹配政务服务终端不同屏幕设备的特征，让不同特征下的CSS代码生效；

(4)基于界面的可视化编辑功能，允许政务服务大厅管理人员以所见即所得的方式设计政务服务终端的屏幕界面，实现视频、图片、滚动字幕、音频各项信息的手动添加。

进一步的，页面自适应方法的实现内容还包括：

搭建公共素材库，在同一个页面显示于政务服务终端比例有差别的屏幕时，分析屏幕显示需求，以通过公共素材库的素材智能填充屏幕的空白区域。

更进一步的，搭建的公共素材库包括取号界面公共素材库、自助服务界面公共素材库、广告机界面公共素材库、查询机界面公共素材库，每个公共素材库都包含有图片和组件，每个图片和组件都配置有相应的标签，标签即是对图片/组件具有要素的简要说明。

进一步的，设计页面元素的百分比时，基于屏幕的分辨率，采用定位页面代码、自适应屏幕宽度，并采用相对大小“rem”描述页面、元素、字号。

更进一步的，设计页面元素的百分比的具体操作为：

(1.1)在页面代码头部，加入一行viewport元标签，让页面宽度自动适应政务服务终端屏幕设备的宽度：

meta name＝viewportcontent＝width＝device-width,initial-scale＝1.0,maximum-scale＝1.0,minimum-scale＝1.0,user-scalable＝no；