一种图片自适应方法、系统和终端设备技术方案

技术编号:8271260 阅读:169 留言:0更新日期:2013-01-31 03:26
本发明专利技术公开了一图片自适应的方法、系统和终端设备。本发明专利技术通过解析UI数据包获取组件的组件绘制信息和图片的图片绘制信息,并根据所述组件绘制信息和图片绘制信息绘制所述图片。本发明专利技术在各分辨率适配中降低了切图工作量,同一套UI资源能同时适配不同分辨率移动终端,简化了界面适配过程,提高了图片适配效率,实现了图片自适应。本发明专利技术进一步明确了组件绘制信息和图片绘制信息的具体内容,同时详细说明了百分比参数、像素值参数、各坐标和宽高度的计算过程,确保了图片自动实现各种不同的显示效果,保障了图片在屏幕上显示位置和显示区域的一致性,提高了图片自适应的可行性。

【技术实现步骤摘要】
本专利技术涉及终端适配领域,尤其涉及一种图片自适应方法、系统和终端设备
技术介绍
目前市场上移动终端众多,移动终端的操作系统和屏幕分辨率更是五花八门。目前主流的操作系统有Symbian S40、symbian S602nd> symbian S603rd> symbian'3> symbiananna、windows mobile 5. x_7、iPhone OS 3. x-5. x、OMS> android I. 5-4. x、BlackberryOS 等;目前智能机型的主要分辨率有240X320、320X240、320X480、320X640、480X800 ;480X854、640X960、960*540、1024X720、1024X800 等等;为了解决移动应用开发门槛高,适配工作量大的问题有人提出了移动中间件技术。移动中间件屏蔽了操作系统的底层差异,实现了跨操作系统快速开发,开发者只需要开·发一套业务界面即可在不同的操作系统运行。但移动终端屏幕大小不统一,仍需要根据不同大小的屏幕制作不同的界面,需要经过高保真效果图重设,切片处理,编码,测试等步骤才能新增一款分辨率适配。应用程序的界面一般都会涉及到图片的显示,而且在不同分辨率的设备上,图片显示为达到统一的效果,需要的图片大小也将不一致。有多少种分辨率的终端,就需要多少种图片切图,造成了切图工作量大、界面适配繁琐的技术问题。
技术实现思路
本专利技术实施例的目的在于提出一种图片自适应方法,旨在解决多分辨率的图片适配工作中切图工作量大、界面适配繁琐的技术问题。本专利技术实施例是这样实现的,一种图片自适应的方法,所述方法包括步骤获取UI数据包;解析所述UI数据包获取组件的组件绘制信息和图片的图片绘制信息;根据所述组件绘制信息和图片绘制信息绘制所述图片。本专利技术另一个目的在于提出一种图片自适应的系统,所述系统包括第一获取模块、解析模块、第二获取模块和绘制模块;所述第一获取模块,与所述解析模块相连,用于获取Π数据包;所述解析模块,与所述第一获取模块和第二获取模块相连,用于解析所述Π数据包;所述第二获取模块,与所述解析模块和绘制模块相连,用于获取组件的组件绘制信息和图片的图片绘制信息;所述绘制模块,与所述第二获取模块相连,用于根据所述组件绘制信息和图片绘制信息绘制所述图片。专利技术另一个目的在于提出一种图片自适应的终端设备,所述终端设备包含所述图片自适应系统。本专利技术通过解析Π数据包获取组件的组件绘制信息和图片的图片绘制信息,并根据所述组件绘制信息和图片绘制信息绘制所述图片。本专利技术在多分辨率图片适配中降低了切图工作量,同一套Π资源能同时适配不同分辨率移动终端,简化了界面适配过程,提高了图片适配效率,实现了图片自适应。本专利技术进一步明确了组件绘制信息和图片绘制信息的内容,同时详细说明了百分比参数、像素值参数、各坐标和宽高度的计算过程,确保了图片自动实现各种不同的显示效果,保障了图片在屏幕上显示位置和显示区域的一致性,提高了图片自适应的可行性。附图说明图I是本专利技术一种图片自适应方法的第一优选实施例流程图;图2是本专利技术一种图片自适应方法的第二优选实施例流程图; 图3是本专利技术组件coml在320x480屏幕上的宽高度示意图;图4是本专利技术一个图片在320x480屏幕上绘制后的效果图;图5是本专利技术两个图片在320x480屏幕上绘制后的效果图;图6是本专利技术四个图片在320x480屏幕上绘制后的效果图;图7是本专利技术一种图片自适应系统的第一优选实施例结构示意图;图8是本专利技术一种图片自适应系统的第二优选实施例结构示意图;图9是本专利技术一种图片自适应系统的第三优选实施例结构示意图。具体实施例方式为了使本专利技术的目的、技术方案及优点更加清楚明白,以下结合附图和实施例,对本专利技术进行进一步详细说明,为了便于说明,仅示出了与本专利技术实施例相关的部分。应当理解,此处所描写的具体实施例,仅仅用于解释本专利技术,并不用以限制本专利技术。本专利技术通过解析Π数据包获取组件的组件绘制信息和图片的图片绘制信息,并根据所述组件绘制信息和图片绘制信息绘制所述图片。本专利技术在多分辨率图片适配中降低了切图工作量,同一套Π资源能同时适配不同分辨率移动终端,简化了界面适配过程,提高了图片适配效率,实现了图片自适应。本专利技术进一步明确了组件绘制信息和图片绘制信息的内容,同时详细说明了百分比参数、像素值参数、各坐标和宽高度的计算过程,确保了图片自动实现各种不同的显示效果,保障了图片在屏幕上显示位置和显示区域的一致性,提高了图片自适应的可行性。实施例一图I是本专利技术一种图片自适应方法的第一优选实施例流程图。所述方法包括步骤SlOl,获取UI数据包;在此之前,首先由服务器端根据UI设计需求定义组件的组件绘制信息和图片的图片绘制信息,并根据所述组件绘制信息和图片绘制信息创建Π数据包;然后由中间件获取所述Π数据包;所述组件绘制信息包括组件的组件参数和组件属性;所述图片绘制信息包括图片的图片锚点和图片参数;所述Π数据包封装了中间件所需组件的组件参数和组件属性,同时还封装了图片的图片锚点和图片参数,封装后的UI数据包由服务器端提供给中间件;所述组件(Component)为中间件Π层最基础的显示单元,可显示文字、图片、动画、网页、视频等等;每个组件作为Ui界面的显示单元,都有一个独一无二的组件名称,所述组件名称用来区分每个组件;S102,解析所述Π数据包获取组件的组件绘制信息和图片的图片绘制信息;也就是解析所述Π数据包获取组件的组件参数和组件属性;同时还获取图片的图片锚点和图片参数;所述组件参数包括组件的坐标(X坐标、y坐标)和组件的宽高度(宽度、高度),所述组件参数可以是像素值组件参数,也可以是百分比组件参数,分别以X、Y、width、height 来表示X坐标、y坐标、宽度和高度,其中以百分比组件参数表示的坐标称为组件的相对坐标,以百分比组件参数表示的宽度和高度称为组件的相对宽高度;百分比组件参数是根据UI设计需求和组件布局选取任一分辨率屏幕为参照物估算出的百分比组件参数,具体为根据UI设计需求和组件布局选取任一分辨率屏幕为参照物估算组件的估算坐标和估算宽高度;根据所述组件的估算坐标和估算宽高度获取所述组件的相对坐标和相对宽高度;所述百分比组件参数中的相对坐标指所述组件相对于父组件或者屏幕左上角的坐标位置,是以父组件或者屏幕的宽高作为计算基数;无父组件的组件的相对坐标计算以屏幕宽高为计算基数;也就是,当所述组件有父组件时,所述组件的相对坐标为所述组件的宽高度占父组件宽高度的百分比;当所述组件无父组件时,所述组件的相对坐标为所述组件的宽高度占屏幕宽高度的百分比;也就是,当所述组件有父组件时,所述组件的相对坐标为所述组件左上角的绝对坐标与父组件左上角的绝对坐标的差值占父组件宽高度的百分比;当所述组件无父组件时,所述组件的相对坐标为所述组件左上角的绝对坐标占屏幕宽高度的百分比;有父组件的组件的相对坐标是相对父组件的坐标体系的,该坐标体系以父组件的左上角为坐标原点,向左X增大,向下I增大;所述百分比组件参数中的相对宽高度指所述组件绝对宽高度相对于父组件或者屏幕绝对宽高度的百分比;所述组件属性包括父组件名称和子组件序列;所述父组件名称记录了所述组本文档来自技高网...

【技术保护点】
一种图片自适应的方法,其特征在于,所述方法包括步骤:获取UI数据包;解析所述UI数据包获取组件的组件绘制信息和图片的图片绘制信息;根据所述组件绘制信息和图片绘制信息绘制所述图片。

【技术特征摘要】
1.一种图片自适应的方法,其特征在于,所述方法包括步骤 获取Π数据包; 解析所述Π数据包获取组件的组件绘制信息和图片的图片绘制信息; 根据所述组件绘制信息和图片绘制信息绘制所述图片。2.根据权利要求I所述的图片自适应方法,其特征在于,所述步骤“获取UI数据包”之前还包括步骤 根据UI设计需求定义组件的组件绘制信息和图片的图片绘制信息,并根据所述组件绘制信息和图片绘制信息创建Π数据包。3.根据权利要求I所述的图片自适应方法,其特征在于,所述组件绘制信息包括组件的组件参数和组件属性; 所述图片绘制信息包括图片的图片锚点和图片参数。4.根据权利要求3所述的图片自适应方法,其特征在于,所述组件参数为百分比组件参数,所述图片参数为百分比图片参数; 所述步骤“解析所述UI数据包获取组件的组件绘制信息和图片的图片绘制信息”之后还包括步骤 将所述百分比组件参数转换为像素值组件参数; 将所述百分比图片参数转换为像素值图片参数。所述步骤“根据所述组件绘制信息和图片绘制信息绘制所述图片”具体为 根据所述像素值组件参数、组件属性、图片锚点和像素值图片参数绘制所述图片。5.根据权利要求4所述的图片自适应方法,其特征在于,所述像素值组件参数包括组件的绝对坐标和绝对宽高度; 所述组件的绝对坐标等于所述组件的相对坐标乘以所述组件父组件的绝对宽高度再加父组件的绝对坐标; 所述组件的绝对宽高度等于所述组件的相对宽高度乘以所述组件父组件的绝对宽高度。所述像素值图片参数包括图片的绝对坐标和绝对宽高度; 所述图片的绝对坐标等于所述图片的相对坐标乘以所述图片所属组件的宽高度再加所述图片所属组件的绝对坐标; 所述图片的绝对宽高度等于所述图片的相对宽高度乘以所述图片所属组件的宽高度; 所述图片锚点指所述图片相对于所述图片所属组件的位置。6.根据权利要求5所述的图片自适应方法,其特征在于,所述百分比组件参数或百分比图片参数是根据UI设计需求、组件布局或图片布局选取任一分辨率屏幕为参照物估算出的百分比组件参数或百分比图片参数。7.根据权利要求6所述的图片自适应方法,其特征在于,所述百分比组件参数包括组件的相对坐标和相对宽高度;所述百分比图片参数包括图片的相对坐标和相对宽高度; 根据UI设计需求、组件布局和图片布局选取任一分辨率屏幕为参照物估算出的百分比组件参数和百分比图片参数,具体为 根据Π设计需求和组件布局选取任一分辨率屏幕为参照物估算组件的估算坐标和估算宽高度; 根据Π设计需求和图片布局选取任一...

【专利技术属性】
技术研发人员:宋振华李荣根
申请(专利权)人:深圳市融创天下科技股份有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1