移动Widget用户界面的实现方法及装置的制作方法

文档序号:6429154阅读:156来源:国知局
专利名称:移动Widget用户界面的实现方法及装置的制作方法
技术领域
本发明涉及移动Widget用户界面开发技术,尤其涉及一种移动Widget用户界面 (User Interface, UI)的实现方法及装置。
背景技术
移动Widget (Mobile Widget)指运行于移动终端上的互联网Web的小应用,它是用!^1^丄33、扭^&1^ 丨编写的程序包。Mobile Widget具有安装文件小、内容多样化、用户体验好、应用开发易、基于标准Web技术、开发门槛低、潜在开发者众多、与操作系统耦合度低等特点。Mobile widget应用还可以充分利用终端上的设备资源,它的运行环境参见图 1。目前,主流的移动软件提供商(ACCESS,Opera, Picsel,Sun, SurfKitchen 以及 Yahoo)、 终端厂商主导的解决方案(比如诺基亚的WebRuntime,Widsets以及摩托罗拉的W^ebUI) 以及大量更小的软件解决方案提供商都在提供移动Widget解决方案和产品。然而,在实现Mobile widget的技术中,低成本、快速地实现良好用户体验的UI — 直是一个难题,在开发Widget的UI时容易遇到以下问题UI的开发并不容易,开发速度也不快;UI的实现效果和体验与系统平台原生程序UI差距很大;手机终端上Widget引擎对Web标准的支持与个人电脑上的不一致,个人电脑上的 Web UI不能直接转移到移动Widget中;即便使用同一个引擎,不同平台UI效果差异巨大。Widget为设计UI,程序包的体积很容易变得很大,同时多个Widget使用同一套主题风格的UI时有大量的资源是可以共享而没有共享。目前,要解决这些问题,可以采用的方法有以下两种1、使用与该技术领域相关的有移动互联网组件库来实现UI,这些库的主要是针对手机上的Wfeb网页设计的组件库。目前,该方面的解决方案主要有JQuery Mobile,Sencha Touch及不成熟的iUI、JQtouch、iffebkit等。将它们应用到开发Widget时,有以下问题这解决方案主要是移动web应用而设计,而不是专门为移动Widget设计,每个 Widget应用需要将组件库一起打包,体积仍然很大;UI样式相对固定,Widget应用需要UI可以灵活设计、可裁剪、可或扩展;存在不兼容Widget运行环境的问题,也没有利用Widget运行环境提供的设备资源。2、使用为传统Web设计的组件库,如YUI、JQuery UI等。这种方案有以下缺点库的体积大、性能差、UI不适宜手机、不兼容Widget引擎、没有利用Widget运行环境提供的设备资源。综上所述,在Mobile widget的UI实现技术领域没有专为移动终端Widget UI实现设计的解决方案,现有的方案也很难实现良好的用户体验。

发明内容
本发明所要解决的技术问题是提供一种移动Widget用户界面的实现方法,该方法可快速、灵活地实现具有良好用户体验的适用于移动终端Widget的UI、降低Widget应用的开发成本。本发明进一步所要解决的技术问题是提供一种移动Widget用户界面的实现装置,该装置可快速、灵活地实现具有良好用户体验的适用于移动终端Widget的UI、降低 Widget应用的开发成本。为解决上述技术问题,本发明采用如下技术方案一种移动Widget用户界面的实现方法,该方法包括以下步骤预设步骤,建立一个由若干个Widget用户界面组件集合而成的Widget用户界面组件库,每个所述组件是具有相同的特性和行为的Widget用户界面对象的抽象;动态加载步骤,从组件库中获得待生成的Widget用户界面需要的组件,并将其加载到所述Widget用户界面的运行环境中。优选地,所述预设步骤包括组件模型建立步骤,按照特性和行为分类将Widget用户界面对象划分成若干个组件,并建立面向对象的组件模型;组件标记步骤,按照预设的属性标记规则为每个组件添加一个用于标识该组件的属性标记;设备资源分配步骤,通过Widget运行环境的设备资源访问接口,为组件添加预设的设备资源特性。优选地,所述组件模型建立步骤中,所述建立面向对象的组件模型包括对象模型建立步骤,分析组件的属性和操作、组件间的关联关系和层次关系,建立对象模型;动态模型建立步骤,分析用户界面中的事件、组件的状态变化,建立动态模型。优选地,所述动态加载步骤包括组件搜索步骤,根据来自Widget应用的获得组件请求,在所述组件库中查找相应的组件;组件加载步骤,将查找到的组件加载到所述Widget应用的运行环境中;界面生成步骤,将获得的组件组装成Widget用户界面后,将所述用户界面调整成适应屏幕显示的规格显示出来。优选地,在所述界面生成步骤中,根据待显示屏幕的宽高尺寸或者分辨率来调整所述用户界面的规格。相应地,本发明还公开了一种移动Widget用户界面的实现装置,包括组件库建立单元,用于建立一个由若干个Widget用户界面组件集合而成的 Widget用户界面组件库,每个所述组件是具有相同的特性和行为的Widget用户界面对象的抽象;动态加载单元,与所述组件库相连,用于从所述组件库中获得待生成的Widget用户界面需要的组件,并将其加载到所述Widget用户界面的运行环境中。优选地,所述组件库建立单元包括有
组件模型建立单元,用于按照特性和行为分类将Widget用户界面对象划分成若干个组件,并建立面向对象的组件模型;组件标记单元,用于按照预设的属性标记规则为每个组件添加一个用于标识该组件的属性标记;设备资源分配单元,用于通过Widget运行环境的设备资源访问接口,为组件添加预设的设备资源特性。优选地,在所述组件模型建立单元包括有对象模型建立单元,用于分析组件的属性和操作、组件间的关联关系和层次关系, 建立对象模型;动态模型建立单元,用于分析用户界面中的事件、组件的状态变化,建立动态模型。优选地,所述动态加载单元包括组件搜索单元,与Widget应用和所述组件库相连,用于根据来自Widget应用的获得组件请求,在所述组件库中查找相应的组件;组件加载单元,与所述组件搜索单元和Widget应用相连,用于将查找到的组件加载到所述Widget应用的运行环境中;界面生成单元,与所述组件加载单元相连,用于将获得的组件组装成Widget用户界面后,将所述用户界面调整成适应屏幕显示的规格显示出来。优选地,所述界面生成单元包括有一界面适应单元,用于根据待显示屏幕的宽高尺寸或者分辨率来调整所述用户界面的规格。本发明的有益效果是本发明的实施例通过将移动Widget用户界面对象抽象成若干相互独立并具有关联和层次关系的组件,建立起Widget UI组件库,在实现UI时,动态加载需要用的组件, 从而大大优化了 UI资源的分配,降低了 Widget应用的开发成本,加快了完全适用于移动 Widget UI的实现过程,使得移动Widget UI设计变得更加灵活、方便、能带来更好的用户体验。下面结合附图对本发明作进一步的详细描述。


图1是现有技术的Widget应用的运行环境示意图。图2是本发明的移动Widget用户界面的实现方法一个实施例的实现流程图。图3是本发明的移动Widget用户界面的实现装置一个实施例的组成结构图。
具体实施例方式下面参考图1详细描述本发明提供的移动Widget用户界面的实现方法的一个实施例;如图所示,本实施例一次移动Widget用户界面的实现主要包括以下流程在预设步骤Sl中,建立一个由若干个Widget用户界面组件集合而成的Widget用户界面组件库,每个所述组件是具有相同的特性和行为的Widget用户界面对象的抽象;在动态加载步骤S2中,从组件库中获得待生成的Widget用户界面需要的组件,并将其加载到所述Widget用户界面的运行环境中。具体实现时,所述预设步骤Sl可具体包括组件模型建立步骤S11,按照特性和行为分类将Widget用户界面对象划分成若干个组件,并建立面向对象的组件模型;组件标记步骤S12,按照预设的属性标记规则为每个组件添加一个用于标识该组件的属性标记;属性标记规则可在HTML的基础上设计简单易用的规则。设备资源分配步骤S13,通过Widget运行环境的设备资源访问接口,为组件添加预设的设备资源特性。所述动态加载步骤S2可具体包括组件搜索步骤S21,根据来自Widget应用的获得组件请求,在所述组件库中查找相应的组件;组件加载步骤S22,将查找到的组件加载到所述Widget应用的运行环境中;界面生成步骤S23,将获得的组件组装成Widget用户界面后,将所述用户界面调整成适应屏幕显示的规格显示出来。具体地,在所述组件模型建立步骤S21中,所述建立面向对象的组件模型可进一步包括对象模型建立步骤S211,分析组件的属性和操作、组件间的关联关系和层次关系, 建立对象模型;动态模型建立步骤S212,分析用户界面中的事件、组件的状态变化,建立动态模型。该步骤S21中,按照模块化、数据抽象、信息隐藏、低耦合、高内聚等面向对象的及规则设计组件。使得UI组件能够可扩展、可裁剪。在所述界面生成步骤S23中,根据待显示屏幕的宽高尺寸或者分辨率来调整所述用户界面的规格。该步骤S23中,可采用多种方法实现UI效果自适应,如宽高自适应规则主要有缩放法和弹性布局法。其中,缩放法是对宽高直接按比例缩放;弹性布局法是在组件上根据给定的宽高重新布局。屏幕DPI自适应规则区分DPI的屏幕设备DPI,针对提供不同的DPI提供相适应的UI。具体实现时,所述组件搜索步骤S21和组件加载步骤S22可通过扫描和分析界面内部的组件标记,创建标记对应的组件来实现组件。下面参考图2详细描述本发明提供的移动Widget用户界面的实现装置的一个实施例;如图所示,本实施例主要包括有组件库建立单元1,用于建立一个由若干个Widget用户界面组件集合而成的 Widget用户界面组件库100,每个所述组件是具有相同的特性和行为的Widget用户界面对象的抽象;动态加载单元2,与所述组件库100相连,用于从所述组件库中获得待生成的 Widget用户界面需要的组件,并将其加载到所述Widget用户界面的运行环境中。具体实现时,所述组件库建立单元1可具体包括
组件模型建立单元11,用于按照特性和行为分类将Widget用户界面对象划分成若干个组件,并建立面向对象的组件模型;组件标记单元12,用于按照预设的属性标记规则为每个组件添加一个用于标识该组件的属性标记;设备资源分配单元13,用于通过Widget运行环境的设备资源访问接口,为组件添加预设的设备资源特性。所述动态加载单元2可具体包括组件搜索单元21,与Widget应用和所述组件库相连,用于根据来自Widget应用的获得组件请求,在所述组件库中查找相应的组件;组件加载单元22,与所述组件搜索单元21和Widget应用相连,用于将查找到的组件加载到所述Widget应用的运行环境中;界面生成单元23,与所述组件加载单元22相连,用于将获得的组件组装成Widget 用户界面后,将所述用户界面调整成适应屏幕显示的规格显示出来。进一步地,所述组件模型建立单元21可进一步包括对象模型建立单元211,用于分析组件的属性和操作、组件间的关联关系和层次关系,建立对象模型;动态模型建立单元212,用于分析用户界面中的事件、组件的状态变化,建立动态模型。所述界面生成单元23包括界面适应单元231,用于根据待显示屏幕的宽高尺寸或者分辨率来调整所述用户界面的规格。具体实现时,组件库100可采用Widget实现技术来开发,如HTML、CSS、Javakript寸。与现有技术相比,本发明具有以下优点1、帮助开发者实现完全适用于移动Widget应用的UIWidget开发者可以直接使用组件库快速开发Widget用户界面,当开发者在发现组件库中的界面设计不够好时,可以很方便地自定义界面组件,在组件库的基础上,快速实现自定义的用户界面。2、降低Widget应用的开发成本,提高Widget用户界面的开发速度组件库易用,提供了界面实现的辅助工具,因而Widget开发者很容易实现界面, 并使界面支持宽高自适应、支持PPI自适应、支持跨平台,Widget开发者所有自定义的界面组件都可以被复用,组件库可以随新技术和新的用户体验设计,不断增加的用户界面组件。3、可以利用设备资源开发体验良好的组件利用Widget引擎提供的支持,可以在传统组件上增加良好的用户体验和效果,如按照某一类主题风格效果来实现组件。4、提高了 widget的运行效率组件库由Widget引擎管理,提供按需加载组件的能力,不会加载不必要的模块, 更省内存空间。5、减小了 Widget的应用下载流量
组件库具有很好的可裁剪性,在应用到Widget中时,可以裁剪没有用到的模块, 从而减小Widget应用的体积。以上所述是本发明的优选实施方式,应当指出,对于本技术领域的普通技术人员来说,在不脱离本发明原理的前提下,还可以做出若干改进和润饰,这些改进和润饰也视为本发明的保护范围。
权利要求
1.一种移动Widget用户界面的实现方法,其特征在于,该方法包括以下步骤预设步骤,建立一个由若干个Widget用户界面组件集合而成的Widget用户界面组件库,每个所述组件是具有相同的特性和行为的Widget用户界面对象的抽象;动态加载步骤,从组件库中获得待生成的Widget用户界面需要的组件,并将其加载到所述Widget用户界面的运行环境中。
2.如权利要求1所述的移动Widget用户界面的实现方法,其特征在于,所述预设步骤包括组件模型建立步骤,按照特性和行为分类将Widget用户界面对象划分成若干个组件, 并建立面向对象的组件模型;组件标记步骤,按照预设的属性标记规则为每个组件添加一个用于标识该组件的属性标记;设备资源分配步骤,通过Widget运行环境的设备资源访问接口,为组件添加预设的设备资源特性。
3.如权利要求2所述的移动Widget用户界面的实现方法,其特征在于,在所述组件模型建立步骤中,所述建立面向对象的组件模型包括对象模型建立步骤,分析组件的属性和操作、组件间的关联关系和层次关系,建立对象模型;动态模型建立步骤,分析用户界面中的事件、组件的状态变化,建立动态模型。
4.如权利要求1-3中任一项所述的移动Widget用户界面的实现方法,其特征在于,所述动态加载步骤包括组件搜索步骤,根据来自Widget应用的获得组件请求,在所述组件库中查找相应的组件;组件加载步骤,将查找到的组件加载到所述Widget应用的运行环境中;界面生成步骤,将获得的组件组装成Widget用户界面后,将所述用户界面调整成适应屏幕显示的规格显示出来。
5.如权利要求4所述的移动Widget用户界面的实现方法,其特征在于,在所述界面生成步骤中,根据待显示屏幕的宽高尺寸或者分辨率来调整所述用户界面的规格。
6.一种移动Widget用户界面的实现装置,其特征在于,该装置包括组件库建立单元,用于建立一个由若干个Widget用户界面组件集合而成的Widget用户界面组件库,每个所述组件是具有相同的特性和行为的Widget用户界面对象的抽象;动态加载单元,与所述组件库相连,用于从所述组件库中获得待生成的Widget用户界面需要的组件,并将其加载到所述Widget用户界面的运行环境中。
7.如权利要求6所述的移动Widget用户界面的实现装置,其特征在于,所述组件库建立单元包括有组件模型建立单元,用于按照特性和行为分类将Widget用户界面对象划分成若干个组件,并建立面向对象的组件模型;组件标记单元,用于按照预设的属性标记规则为每个组件添加一个用于标识该组件的属性标记;设备资源分配单元,用于通过Widget运行环境的设备资源访问接口,为组件添加预设的设备资源特性。
8.如权利要求7所述的移动Widget用户界面的实现装置,其特征在于,在所述组件模型建立单元包括有对象模型建立单元,用于分析组件的属性和操作、组件间的关联关系和层次关系,建立对象模型;动态模型建立单元,用于分析用户界面中的事件、组件的状态变化,建立动态模型。
9.如权利要求6-8中任一项所述的移动Widget用户界面的实现装置,其特征在于,所述动态加载单元包括组件搜索单元,与Widget应用和所述组件库相连,用于根据来自Widget应用的获得组件请求,在所述组件库中查找相应的组件;组件加载单元,与所述组件搜索单元和Widget应用相连,用于将查找到的组件加载到所述Widget应用的运行环境中;界面生成单元,与所述组件加载单元相连,用于将获得的组件组装成Widget用户界面后,将所述用户界面调整成适应屏幕显示的规格显示出来。
10.如权利要求9所述的移动Widget用户界面的实现装置,其特征在于,所述界面生成单元包括有一界面适应单元,用于根据待显示屏幕的宽高尺寸或者分辨率来调整所述用户界面的规格。
全文摘要
本发明公开一种移动Widget用户界面的实现方法,包括预设步骤,建立一个由若干个Widget用户界面组件集合而成的Widget用户界面组件库,每个所述组件是具有相同的特性和行为的Widget用户界面对象的抽象;动态加载步骤,从组件库中获得待生成的Widget用户界面需要的组件,并将其加载到所述Widget用户界面的运行环境中。本发明还公开了相应的移动Widget用户界面的实现装置。本发明可快速、灵活地实现具有良好用户体验的适用于移动终端Widget的UI、降低Widget应用的开发成本。
文档编号G06F9/44GK102222006SQ201110207189
公开日2011年10月19日 申请日期2011年7月22日 优先权日2011年7月22日
发明者周治兵, 唐贵宾, 许元锎 申请人:武汉天喻信息产业股份有限公司
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1