专利名称：用于移动终端的屏幕图形自适应方法及系统的制作方法
技术领域：
本发明涉及移动通讯技术领域，尤其涉及一种用于移动终端的屏幕图形自适应方法及系统。
背景技术：
移动Widget指运行在移动终端上的Widget，不仅可以独立于浏览器运行，有效地利用手机屏幕，而且可更快速、直接、方便地访问移动互联网，从而给手机用户带来良好的呈现方式和互联网体验。由于不同移动Widget平台大都采用了不同的标准，相互之间无法完全兼容，使得Widget应用的第三方提供商需要为一款业务应用制作多种不同Widget以适应不同的Widget平台。并且，目前手机操作系统种类多，差异大，缺乏开放给上层应用 的有效的统一接口，导致移动终端应用开发的门槛高、周期长，终端适配工作量大，在不同终端平台上的用户体验也往往存在着较大的差异，这些直接影响了终端应用的快速有效部署。本课题基于已有移动互联网产品和研发成果，研究支持移动互联网业务的智能终端关键技术，研究终端跨平台中间件和接口适配技术，研究浏览器及WEB新技术，有针对性地解决目前移动互联网终端应用中存在的难点，加快移动Widget应用的市场化，极大降低跨平台应用的维护成本，推动移动互联网终端应用环境能力进一步提高，便于业务的部署和更新，提供一致的用户体验，能够快速响应不断变化的市场需求。如今，任何使用屏幕应用程序(无论是Web网站，移动设备应用程序，或桌面应用程序)的开发者必需意识到不同的屏幕具有不同的属性和特征，Widget开发更是如此。由于Widget的跨平台特性,开发一款Widget可能面临着这样的问题它可能运行在不同操作系统、不同分辨率的移动设备上，原来根据某一分辨率制作的Widget装在小分辨率的设备上显示，可能只看到冰山一角。原来的文字和可触控件无法完全显示在屏幕内，超出屏幕外的可触控件无法点击。如果定制分辨率Widget运行在大分辨率设备上，效果会截然相反，整个Widget页面紧缩在一起显示在屏幕的某一处，字迹模糊无法分辨，控件难以触碰。JILWidget可以跨平台运行，即一个JIL Widget应用可以在安装有JIL Widget引擎(如BAE)的各种终端上运行，但如何保证该应用在不同分辨率手机上的用户体验都非常出色，则是亟待解决的技术问题。
发明内容
本发明的主要目的在于提供一种用于移动终端的屏幕图形自适应方法及系统，以解决现有技术存在的Widget应用用于分辨率不同的终端时导致显示效果不理想的问题，其中根据本发明实施例的用于移动终端的屏幕图形自适应方法包括获取应用界面的显示参数以及移动终端的设备参数；根据获取的应用界面的显示参数以及移动终端的设备参数，确定缩放比例；根据缩放比例修改应用界面的显示参数，进行应用界面的自适应显
/Jn ο
其中，通过遍历应用界面的每个元素的DOM树获取应用界面的显示参数。其中，应用界面的显示参数包括Html图形显示信息、css图形显示信息、js图形显示信息、svg图形显示信息、xml图形显示配置信息。其中，通过上下文感知机制获取移动终端的设备参数。其中，缩放比例包括宽方向缩放比例、高方向缩放比例、文字的缩放比例。
其中，应用界面的自适应显示包括静态界面大小自适应、静态界面位置自适应、动态界面大小自适应、动态界面位置自适应。其中，该方法还包括实现JavaScript中的自适应显示；BAE引擎将应用渲染到界面。根据本发明实施例的用于移动终端的屏幕图形自适应系统包括参数获取模块，用于获取应用界面的显示参数以及移动终端的设备参数；缩放比例确定模块，用于根据获取的应用界面的显示参数以及移动终端的设备参数，确定缩放比例；自适应显示模块，用于根据缩放比例修改应用界面的显示参数，进行应用界面的自适应显示。其中，参数获取模块包括第一参数获取模块，用于通过遍历应用界面的每个元素的DOM树获取应用界面的显示参数；第二参数获取模块，用于通过上下文感知机制获取移动终端的设备参数。其中，自适应显示模块进一步用于静态界面大小自适应、静态界面位置自适应、动态界面大小自适应、动态界面位置自适应。根据本发明的技术方案，通过获取设备信息参数和Widget应用的信息参数，并通过图形自适应算法机制修改原Widget应用的图形显示参数，达到了图形自适应的目的，从而使得应用程序能够在不同分辨率和不同操作系统的终端上更加灵活的使用。
此处所说明的附图用来提供对本发明的进一步理解，构成本申请的一部分，本发明的示意性实施例及其说明用于解释本发明，并不构成对本发明的不当限定。在附图中图I是本发明实施例的屏幕图形自适应方法的流程图；图2A和图2B分别是本发明实施例的HTML中各标签之间的关系以及读取顺序的示意图；图3是本发明实施例的用于移动终端的屏幕图形自适应系统的结构框图。
具体实施例方式为使本发明的目的、技术方案和优点更加清楚，以下结合附图及具体实施例，对本发明作进一步地详细说明。根据本发明的实施例，提供了一种用于移动终端的屏幕图形自适应方法。图I是本发明实施例的屏幕图形自适应方法的流程图，如图I所示，该方法包括步骤S102,获取应用界面(Widget应用界面)的显示参数以及移动终端的设备参数；步骤S104，根据获取的应用界面的显示参数以及移动终端的设备参数，确定缩放比例；
步骤S106，根据缩放比例修改应用界面的显示参数，进行应用界面的自适应显示。下面详细描述上述各处理的细节。(一 )步骤 S102移动终端的设备参数(包括设备硬件参数和设备软件参数)可以通过上下文感知机制获取，将得到的移动终端的设备参数按照一定分类进行保存。对于应用界面的显示参数，主要包括大小参数和位置参数两大类， 其中I、大小参数。(l)width :表示模块的宽度；(2) height :表示模块的高度；(3) “”:有时开发者会将图片放入div模块中的<img>标签内，但不设置它的宽和高。在这种情况下，开发者开发的Widget可以正常显示，html默认给该<img>标签预留它本身图片的大小。(4)object标签的width :当html中使用object标签包含例如svg矢量图片时，简单获取的width是该object的width信息。自适应需要对object包含的svg图片也进行自适应，即对svg的width也要获取。(5) object标签的height :当html中使用object标签包含例如svg矢量图片时，简单获取的height是该object的height信息。自适应需要对object包含的svg图片也进行自适应，即对svg的height也要获取。2、位置参数(I) top :表示模块的左上角在手机界面坐标的y坐标值；(2) left :表示模块的左上角在手机界面坐标的X坐标值，通常top和left就可确定一个模块的位置信息；(3)right :表示模块的左上角距离手机界面最右端的坐标值；(4)bottom :表示模块的左上角距离手机界面最下端的坐标值；在HTML文件中，组成手机应用用户界面的各个模块都以标签的形式写在<body>〈/body>标签之间。这些标签也存在着包含与被包含的关系。如图2A所示是HTML中各个标签之间的关系。使用遍历HTML各个标签的方法来实现对这些标签参数信息的获取。Web浏览器的作用是读取HTML文档，并以网页的形式显示出它们。它的读取顺序是按照文件代码从上而下顺序读取的。所以需要在浏览器引擎读取完全部的HTML文件后再对这个应用做出自适应修改。如图2B所不,是读取顺序和各标签的关系图。应用界面的显示参数包括有Html图形显示信息、css图形显示信息、js图形显示信息、SVg图形显示信息、xml图形显示配置信息。( 二)步骤 S104当获取移动Widget应用的相关参数后，需要根据这些参数得到对屏幕各模块拉伸(缩放)的比例，缩放比例包括宽方向缩放比例、高方向缩放比例、文字的缩放比例。比例算法如公式⑴和⑵，Rw和Rh分别代表宽和高的拉伸比例，Sff和Sh分别代表屏幕的宽度和高度分辨率(移动终端的设备参数)，Bw和Bh分别代表Widget应用初始定义的Body的宽度和高度分辨率。在开发Widget应用时,定义Body的width和height参数，config文件中定义的Widget的宽和高则对应屏幕的宽和高。Rw = Sw+Bw (I)Rh = Sh + Bh (2)(三)步骤S106图形自适应算法的核心就是对各个参数进行修改以实现自适应。应用界面的自适应显示包括静态界面大小自适应、静态界面位置自适应、动态界面大小自适应、动态界面位置自适应。采用参数获取方法遍历HTML文件，使用拉伸比例算法得到的拉伸比例，然后使用修改参数算法自适应这些参数，从而达到用户界面的自适应。算法如公式(3)和(4)所示。i = 0,1,2,. .. ,η,表示HTML文件内任意的标签元素。W不仅表示宽度,它代表在手机屏幕上表示X坐标轴位置的属性，如left、right等。同理，H表示在手机屏幕上表示y坐标轴位置的属性，如top, bottom等。
权利要求
1.一种用于移动终端的屏幕图形自适应方法，其特征在于，包括 获取应用界面的显示参数以及移动终端的设备参数； 根据获取的应用界面的显示参数以及移动终端的设备参数，确定缩放比例； 根据所述缩放比例修改所述应用界面的显示参数，进行所述应用界面的自适应显示。
2.根据权利要求I所述的方法，其特征在于，通过遍历应用界面的每个元素的DOM树获取所述应用界面的显示参数。
3.根据权利要求I或2所述的方法，其特征在于，所述应用界面的显示参数，包括 Html图形显示信息、css图形显示信息、js图形显示信息、svg图形显示信息、xml图形显示配置信息。
4.根据权利要求I所述的方法，其特征在于，通过上下文感知机制获取所述移动终端的设备参数。
5.根据权利要求I所述的方法，其特征在于，所述缩放比例包括 宽方向缩放比例、高方向缩放比例、文字的缩放比例。
6.根据权利要求I所述的方法，其特征在于，所述应用界面的自适应显示，包括 静态界面大小自适应、静态界面位置自适应、动态界面大小自适应、动态界面位置自适应。
7.根据权利要求I所述的方法，其特征在于，还包括 实现JavaScript中的自适应显示； BAE引擎将应用渲染到界面。
8.一种用于移动终端的屏幕图形自适应系统，其特征在于，包括 参数获取模块，用于获取应用界面的显示参数以及移动终端的设备参数； 缩放比例确定模块，用于根据获取的应用界面的显示参数以及移动终端的设备参数，确定缩放比例； 自适应显示模块，用于根据所述缩放比例修改所述应用界面的显示参数，进行所述应用界面的自适应显示。
9.根据权利要求8所述的系统，其特征在于，所述参数获取模块，包括 第一参数获取模块，用于通过遍历应用界面的每个元素的DOM树获取所述应用界面的显示参数； 第二参数获取模块，用于通过上下文感知机制获取所述移动终端的设备参数。
10.根据权利要求8所述的系统，其特征在于，所述自适应显示模块进一步用于静态界面大小自适应、静态界面位置自适应、动态界面大小自适应、动态界面位置自适应。
全文摘要
本发明公开了一种用于移动终端的屏幕图形自适应方法及系统，其中该方法包括获取应用界面的显示参数以及移动终端的设备参数；根据获取的应用界面的显示参数以及移动终端的设备参数，确定缩放比例；根据缩放比例修改应用界面的显示参数，进行应用界面的自适应显示。通过本发明，能够使应用程序在不同分辨率和不同操作系统的终端上灵活使用。
文档编号G06T3/40GK102662616SQ20121008639
公开日2012年9月12日 申请日期2012年3月28日 优先权日2012年3月28日
发明者廖青, 张春红, 朱新宁, 矫艳梅, 纪阳, 马琳 申请人:北京邮电大学