用户界面实现方法、客户端及存储介质与流程

文档序号:14346933阅读:199来源:国知局
用户界面实现方法、客户端及存储介质与流程

本申请涉及信息技术领域,尤其涉及用户界面实现方法、客户端以及存储介质。



背景技术:

现在很多普通客户端的界面实现方案中,会存在同时显示网页页面内容和客户端控件内容的情况。一般来说客户端为了实现显示网页页面内容的功能,都会采用通过初始化一个浏览器内核组件来加载一个单独的页面。当客户端界面上需要显示多个独立的网页页面时,客户端需要初始化多个浏览器内核组件以加载上述多个独立的网页页面。



技术实现要素:

本申请提出了一种用户界面实现方法、客户端及存储介质,以提升客户端中实现的用户界面的性能。

本申请实例提出了一种用户界面实现方法,包括:解析一个待展示界面的界面布局文件;根据从所述界面布局文件中解析出的窗口的属性信息,创建一个窗口和一个和所述窗口的属性相匹配的页面控件,由所述页面控件初始化一个浏览器内核组件,以使所述浏览器内核组件加载一个和所述窗口的属性相匹配的页面;当从所述界面布局文件中解析出一个子页面控件的信息,根据所述子页面控件的属性信息,在所述窗口中的对应位置创建一个空白的子页面控件,并确定所述子页面控件的信息,所述子页面控件的信息包括:属性信息和子页面信息;通过所述浏览器内核组件提供的通讯通道,将所述子页面控件的信息发送给页面处理模块,以使所述页面处理模块根据所述子页面控件的信息中的属性信息在所述页面中创建一个与所述子页面控件的属性相匹配的页面元素,并根据所述子页面信息加载所述页面元素的内容数据;响应于来自所述浏览器内核组件的加载完成消息,从所述加载完成消息中提取所述页面元素的内容数据;以及在所述子页面控件上渲染所述内容数据。

在一些实例中,当从所述界面布局文件中解析出第一个子页面控件的信息时,创建所述页面控件。

在一些实例中,所述页面控件为透明的。

在一些实例中,所述方法进一步包括:响应于从用户界面接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件,以使所述浏览器内核组件将所述用户界面输入事件传递给所述页面处理模块;响应于来自所述浏览器内核组件的更新消息,从所述更新消息中提取所述子页面控件对应的页面元素的内容数据;其中,所述页面处理模块响应于所述用户界面输入事件,对所述子页面控件对应的页面元素进行相应的内容更新处理并触发所述浏览器内核组件发送所述更新消息;以及在所述子页面控件上渲染从所述更新消息中提取的所述内容数据。

在一些实例中,所述方法进一步包括:响应于从用户界面接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件,以使所述浏览器内核组件将所述用户界面输入事件传递给所述页面处理模块;响应于所述页面处理模块通过所述通讯通道发来的已完成消息,确认已处理完成所述用户界面输入事件;其中,所述页面处理模块响应于所述用户界面输入事件,对所述子页面控件对应的页面元素进行相应的除内容更新以外的更新处理并发送所述已完成消息。

在一些实例中,当所述页面加载完成时,通过所述通讯通道与所述页面处理模块相互传递可调用的接口函数信息以注册相互调用的接口;其中,通过调用所述浏览器内核组件提供的指定接口而向所述通讯通道传递所述子页面控件的信息,以使所述通讯通道通过所述页面处理模块注册的调用接口将所述子页面控件的信息传递给所述页面处理模块。

在一些实例中,所述方法进一步包括:响应于从用户界面接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件,以使所述浏览器内核组件将所述用户界面输入事件传递给所述页面处理模块;响应于所述页面处理模块通过所述通讯通道传递的页面元素的信息,所述页面元素的信息包括页面元素的属性信息,根据所述页面元素的信息,更新与所述页面元素对应的子页面控件的属性;其中,响应于所述用户界面输入事件,所述页面处理模块更新所述子页面控件对应的所述页面元素的信息并通过所述通讯通道传递更新后的所述页面元素的信息。

在一些实例中,所述子页面控件的信息进一步包括显示属性;其中,所述显示属性包括显示或隐藏;当所述显示属性包括隐藏时,则不执行所述从所述加载完成消息中提取所述页面元素的内容数据和所述在所述子页面控件上渲染所述内容数据的处理。

在一些实例中,所述方法进一步包括:响应于所述窗口属性变化导致的所述窗口内一个或多个子页面控件的属性发生变化的事件,通过所述通讯通道将当前所述一个或多个子页面控件的信息发送给所述页面处理模块;响应于来自所述浏览器内核组件的更新消息,从所述更新消息中提取所述一个或多个子页面控件对应的页面元素的内容数据;其中,所述页面处理模块根据从所述通讯通道接收到的所述一个或多个子页面控件的信息,更新所述页面中对应的页面元素的属性并触发所述浏览器内核组件发送所述更新消息;以及在所述一个或多个子页面控件上渲染从所述更新消息中提取的所述内容数据。

本申请实例提出了一种用户界面实现方法,包括:接收界面处理模块通过浏览器内核组件提供的通讯通道发送的子页面控件的信息,其中,所述子页面控件的信息包括:属性信息和子页面信息;根据所述子页面控件的信息中的属性信息,在页面中创建一个与所述子页面控件的属性相匹配的页面元素,并根据所述子页面信息加载所述页面元素的内容数据,其中,所述页面是所述界面处理模块初始化所述浏览器内核组件时加载的一个和待展示窗口的属性相匹配的页面;以及当加载完成所述页面元素时,触发所述浏览器内核组件向所述界面处理模块发送加载完成消息,以使所述界面处理模块从所述加载完成消息中提取所述页面元素的内容数据并在所述子页面控件上渲染所述内容数据。

在一些实例中,所述方法进一步包括:响应于界面处理模块所述浏览器内核组件发送的对所述窗口中一个子页面控件的用户界面输入事件,对所述子页面控件对应的页面元素进行相应的内容更新处理,其中,所述用户界面输入事件是所述界面处理模块从用户界面接收到的并传递给所述浏览器内核组件;触发所述浏览器内核组件发送更新消息给所述界面处理模块,界面处理模块以使所述界面处理模块从所述更新消息中提取所述子页面控件对应的页面元素的内容数据并在所述子页面控件上渲染所提取的所述内容数据。

在一些实例中,所述进一步包括:响应于所述浏览器内核组件发送的对所述窗口中一个子页面控件的用户界面输入事件,对所述子页面控件对应的页面元素进行相应的除内容更新以外的更新处理;其中,所述用户界面输入事件是所述界面处理模块从用户界面接收到的并传递给所述浏览器内核组件;通过所述通讯通道发送已完成消息给所述界面处理模块,以通知所述界面处理模块已处理完成所述用户界面输入事件。

在一些实例中,所述方法进一步包括:响应于所述界面处理模块通过所述浏览器内核组件发送的用户界面输入事件,更新所述子页面控件对应的所述页面元素的信息,其中,所述用户界面输入事件是用户界面接收到的在所述窗口中一个子页面控件输入的;响应于页面中页面元素的信息的更新,通过所述通讯通道传递所述页面元素的信息给所述界面处理模块,以使所述界面处理模块根据所述页面元素的信息,更新与所述页面元素对应的子页面控件的属性,其中,所述页面元素的信息包括页面元素的属性信息。

在一些实例中,在接收所述界面处理模块通过所述浏览器内核组件提供的通讯通道发送的子页面控件的信息之前,所述方法进一步包括:通过所述通讯通道与所述界面处理模块相互传递可调用的接口函数信息以注册相互调用的接口;其中,通过调用所述浏览器内核组件提供的指定接口而向所述通讯通道传递所述页面元素的信息,以使所述通讯通道通过所述界面处理模块注册的调用接口将所述页面元素的信息传递给所述界面处理模块。

在一些实例中,所述子页面控件的信息进一步包括显示属性;其中,所述显示属性包括显示或隐藏;当所述显示属性包括隐藏时,则不执行所述根据所述子页面信息加载所述页面元素的内容数据的处理以及所述触发所述浏览器内核组件向所述界面处理模块发送加载完成消息的处理。

在一些实例中,所述方法进一步包括:接收所述界面处理模块通过所述通讯通道发送的属性发生变化的一个或多个子页面控件的信息,其中,所述一个或多个子页面控件的属性发生变化由所述窗口的属性变化而导致;根据从所述通讯通道接收到的所述一个或多个子页面控件的信息,更新所述页面中对应的页面元素的属性,并所述浏览器内核组件发送所述更新消息至所述界面处理模块,以使所述界面处理模块从所述更新消息中提取所述一个或多个子页面控件对应的页面元素的内容数据并在所述一个或多个子页面控件上渲染从所述更新消息中提取的所述内容数据。

本申请实例还提供了一种用户界面实现客户端,包括:界面处理模块和页面处理模块;其中:所述界面处理模块,解析一个待展示界面的界面布局文件;根据从所述界面布局文件中解析出的窗口的属性信息,创建一个窗口和一个和所述窗口的属性相匹配的页面控件,由所述页面控件初始化一个浏览器内核组件,以使浏览器内核组件加载一个和所述窗口的属性相匹配的页面;当从所述界面布局文件中解析出一个子页面控件的信息时,根据所述子页面控件的属性信息,在所述窗口中的对应位置创建一个空白的子页面控件,并确定所述子页面控件的信息,所述子页面控件的信息包括:属性信息和子页面信息;通过所述浏览器内核组件提供的通讯通道,将所述子页面控件的信息发送给页面处理模块;所述页面处理模块,接收所述界面处理模块通过所述通讯通道发送的所述子页面控件的信息;根据所述子页面控件的信息中的属性信息,在所述页面中创建一个与所述子页面控件的属性相匹配的页面元素,并根据所述子页面信息加载所述页面元素的内容数据;以及当加载完成根据所述页面元素的操作,触发所述浏览器内核组件向所述界面处理模块发送加载完成消息;所述界面处理模块,响应于来自所述浏览器内核组件的加载完成消息,从所述加载完成消息中提取所述页面元素的内容数据;以及所述界面处理模块,进一步在所述子页面控件上渲染所述内容数据。

在一些实例中,所述界面处理模块,进一步响应于从用户界面接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件,以使所述浏览器内核组件将所述用户界面输入事件传递给所述页面处理模块;所述页面处理模块进一步响应于所述用户界面输入事件,对所述子页面控件对应的页面元素进行相应的内容更新处理并触发所述浏览器内核组件发送所述更新消息;以及所述界面处理模块进一步响应于来自所述浏览器内核组件的更新消息,从所述更新消息中提取所述子页面控件对应的页面元素的内容数据,在所述子页面控件上渲染从所述更新消息中提取的所述内容数据并在所述子页面控件上渲染所述内容数据。

在一些实例中,所述界面处理模块,进一步响应于从用户界面接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件,以使所述浏览器内核组件将所述用户界面输入事件传递给所述页面处理模块;所述页面处理模块进一步响应于所述用户界面输入事件,对所述子页面控件对应的页面元素进行相应的除内容更新以外的更新处理,并通过所述通讯通道发送已完成消息给所述界面处理模块;以及所述界面处理模块进一步响应于所述通讯通道发来的已完成消息,确认已处理完成所述用户界面输入事件。

在一些实例中,当所述页面加载完成时,所述界面处理模块和所述页面处理模块,通过所述通讯通道相互传递可调用的接口函数信息以注册相互调用的接口;其中,所述界面处理模块通过调用所述浏览器内核组件提供的指定接口而向所述通讯通道传递所述子页面控件的信息,以使所述通讯通道通过所述页面处理模块注册的调用接口将所述子页面控件的信息传递给所述页面处理模块;其中,所述页面处理模块通过调用所述浏览器内核组件提供的指定接口而向所述通讯通道传递所述页面元素的信息,以使所述通讯通道通过所述界面处理模块注册的调用接口将所述页面元素的信息传递给所述界面处理模块。

在一些实例中,所述界面处理模块,进一步响应于从用户界面接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件,以使所述浏览器内核组件将所述用户界面输入事件传递给所述页面处理模块;所述页面处理模块进一步响应于所述用户界面输入事件,更新所述子页面控件对应的所述页面元素的信息;所述页面处理模块进一步响应于所述页面中所述页面元素的信息的更新,通过所述通讯通道传递所述页面元素的信息给所述界面处理模块,其中,所述页面元素的信息包括页面元素的属性信息;所述界面处理模块进一步响应于所述通讯通道传递的页面元素的信息,根据所述页面元素的信息,更新与所述页面元素对应的子页面控件的属性。

在一些实例中,所述子页面控件的信息进一步包括显示属性;其中,所述显示属性包括显示或隐藏;当所述显示属性包括隐藏时,所述界面处理模块则不执行所述从所述加载完成消息中提取所述页面元素的内容数据和所述在所述子页面控件上渲染所述内容数据的处理;所述页面处理模块则不执行所述根据所述子页面信息加载所述页面元素的内容数据的处理以及所述触发所述浏览器内核组件向所述界面处理模块发送加载完成消息的处理。

在一些实例中,所述界面处理模块,进一步响应于所述窗口属性变化导致的所述窗口内一个或多个子页面控件的属性发生变化的事件,通过所述通讯通道将当前所述一个或多个子页面控件的信息发送给所述页面处理模块;所述页面处理模块进一步接收所述通讯通道发送的属性发生变化的一个或多个子页面控件的信息;所述页面处理模块进一步根据所述一个或多个子页面控件的信息,更新所述页面中对应的页面元素的属性,并触发所述浏览器内核组件发送所述更新消息至所述界面处理模块;所述界面处理模块进一步响应于来自所述浏览器内核组件的更新消息,从所述更新消息中提取所述一个或多个子页面控件对应的页面元素的内容数据;以及所述界面处理模块进一步在所述一个或多个子页面控件上渲染从所述更新消息中提取的所述内容数据并在所述一个或多个子页面控件上渲染从所述更新消息中提取的所述内容数据。

本申请实例还提供了一种存储介质,存储有可读指令,可以使至少一个处理器执行上述用户界面实现方法。

通过以上技术方案可以看出,该用户界面实现方法一方面解决了客户端同一窗口合并多个网页页面而造成的性能低下的问题,使用户在使用客户端产品过程中,体验到的界面设计、动画效果等更加流畅,大大提升了用户体验。另一方面有效的将网页页面技术和客户端技术进行结合,解决了传统客户端产品中由于引入过多网页页面内容而带来的占用系统资源过高、运行性能下降等问题。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。

图1a为本申请一实例的用户界面实现方法所适用的软件架构图;

图1b是本申请一实例的用户界面实现方法的流程图;

图2是本申请一实例的用户界面实现方法的流程图;

图3为本申请一实例的用户界面实现方法的示例性流程图;

图4为本申请一实例所述的一个窗口界面布局文件的示例;

图5为本申请一实例所述的界面处理模块加载一个页面的示意图;

图6为本申请一实例所述的界面处理模块在应用客户端窗口生成子页面控件的示例;

图7为本申请一实例所述的页面处理模块在页面中加载页面元素的示例;

图8为本申请一实例所述的页面处理模块在页面上创建多个页面元素的示例;

图9为本申请一实例的客户端的结构示意图;以及

图10为本申请一实例的客户端的硬件结构示意图。

具体实施方式

下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。

为了描述上的简洁和直观,下文通过描述若干代表性的实施例来对本发明的方案进行阐述。实施例中大量的细节仅用于帮助理解本发明的方案。但是很明显,本发明的技术方案实现时可以不局限于这些细节。为了避免不必要地模糊了本发明的方案,一些实施方式没有进行细致地描述,而是仅给出了框架。下文中,“包括”是指“包括但不限于”,“根据……”是指“至少根据……,但不限于仅根据……”。下文中没有特别指出一个成分的数量时,意味着该成分可以是一个也可以是多个,或可理解为至少一个。

本申请的发明人在研究中发现,目前在提供用户界面时客户端通过初始化浏览器内核组件来加载网页页面,并将该页面内容和客户端控件内容同时显示。但当客户端界面上存在多个独立的网页页面时,客户端要初始化多个浏览器内核组件来分别加载上述多个网页页面,由于浏览器内核组件非常消耗操作系统资源,因此这会极大的降低客户端的运行性能和影响用户体验。并且,一个网页页面的内容是在一个平面上的,无法实现分模块、分层与客户端原生控件多次层叠布局。

为了解决上述问题,本申请的实例提出了一种用户界面实现方法,该方法用于需要同时展示网页页面和客户端控件的应用客户端(app),比如游戏大厅客户端。这里,上述网页页面又可以称为页面。

图1a显示了本申请一些实例所述的用户界面实现方法所适用的软件架构图。如图1a所示,本申请的系统至少包括:界面处理模块11、浏览器内核组件12、通讯通道13、页面处理模块14和用户界面15。

其中,界面处理模块11可以提供绘制界面的基本元素。响应于用户启动应用客户端的操作,界面处理模块11进行初始化,根据应用客户端某一窗口的界面布局文件构建该窗口的子页面控件树并将子页面控件渲染到该窗口上。比如mfc的界面处理模块负责绘制用户界面。这里,上述基本元素是指绘制界面的基本要素,比如mfc的界面库中各种形状的按钮、窗体、文本框、下拉菜单等等。上述控件是指对数据和方法的封装,有自己的属性和方法,是利用基本元素进行设计、开发、调试来创建的。例如:页面控件(如gweb控件)可以用来初始化一个浏览器内核组件进而加载一个页面,子页面控件(如gwebwidget控件)可以创建在窗口中并用来渲染页面元素的内容数据(如文本、图片、动画等)。

浏览器内核组件12,内部封装有浏览器内核比如谷歌的webkit内核,用于打开、加载和刷新应用客户端的网页页面,比如webcontainer组件。其中,一个浏览器内核组件对应一个网页页面。同时,由于浏览器内核组件12是由编写应用客户端的代码语言来编写的,比如由c++语言编写的,并可以运行所述网页页面的代码语言(比如javascript),因此可以供应用客户端的界面处理模块11和页面处理模块14共同调用以传输用户界面(ui)输入事件(如鼠标和键盘事件),并且还为应用客户端的界面处理模块11和页面处理模块14的通讯通道13提供了上层接口,界面处理模块11和与上述网页页面对应的页面处理模块14通过调用浏览器内核组件提供的上层接口(比如:某种api)能够调用该通讯通道13,进而通过该通讯通道13传递参数和指令等数据。更进一步的,浏览器内核组件12还可以封装一些函数比如用于通知界面处理模块11上述网页页面内的页面元素已经加载完成的渲染更新函数等。

通讯通道13是供应用客户端的界面处理模块11和页面处理模块14进行通信和传输数据的,由浏览器内核组件12提供上层接口。主要用来传输一些系统层面以外的扩展定义的一些数据,比如窗口内子页面控件大小和位置等数据。此外,通过通讯通道13,界面处理模块11和页面处理模块14还可以相互传递可调用的接口函数信息,以注册相互调用的接口。

页面处理模块14可以根据界面处理模块11通过通讯通道13传输的子页面控件的信息,在网页页面中加载页面元素,打开浏览器内核组件12所加载的网页页面内的相应的子页面文件(如html文件),并执行该子页面文件中的js脚本,进而加载该子页面作为上述页面元素的内容数据。此外,还可以对用户界面15接收的ui输入事件做出响应。更进一步的,页面处理模块14还可以通过浏览器内核组件12通知界面处理模块11加载完成消息和通过通讯通道13通知界面处理模块11已完成消息。

用户界面15负责接收用户在应用客户端的用户界面(ui)输入的各种ui输入事件,比如鼠标事件、键盘事件等,并触发界面处理模块11将接收到的ui输入事件通过浏览器内核组件12通知页面处理模块14以使其做出响应。

图1b示出了本申请实例提供的用户界面实现方法的流程图。由应用客户端的界面处理模块11来执行。如图1b所示,包括以下步骤:

步骤101:解析一个待展示界面的界面布局文件。

在一些应用客户端的界面(如窗口)实现方案中,会存在同时显示网页页面和应用客户端子页面控件的情况,而应用客户端显示的每一部分网页页面的页面元素都对应所述应用客户端的界面处理模块11中一个单独的子页面控件,因此在应用客户端窗口的配置阶段,网页页面每部分的页面元素是单独进行配置的,因此网页页面的页面元素的实现也是由网页开发人员进行单独的实现,并将上述网页页面的页面元素分别对应到各个独立的子页面,然后将该界面内布局的子页面控件以及网页页面的页面元素配置到该界面的界面布局文件中。其中,上述各个独立的子页面分别对应不同的url(英文:uniformresourcelocator,中文:统一资源定位符),上述页面元素是组成网页页面的基本要素,可以包括:文字、图片、音频、动画、视频。

在一些实例中,当应用客户端初始化一个界面的时候,应用客户端的界面处理模块11解析该界面的界面布局文件以构建所述窗口的控件树。其中,上述界面布局文件是开发者在开发所述界面的时候形成的一个文件,用于记录所述界面的大小、用途、包含的子页面控件以及上述子页面控件的信息,其中所述界面的用途用来指明该窗口的功能,比如登录界面或主界面窗口等等。

步骤102:根据从所述界面布局文件中解析出的窗口属性信息,创建一个窗口和一个和所述窗口的属性相匹配的页面控件,由所述页面控件初始化一个浏览器内核组件12,以使浏览器内核组件12在所述页面控件中加载一个和所述窗口的属性相匹配的页面。

在一些实例中,当应用客户端的界面处理模块11当从所述界面布局文件中解析出第一个子页面控件的信息时,比如解析出第一个gwebwidget控件的信息时,创建一个隐藏的、透明的和所述窗口同等大小的页面控件,比如gweb控件;所述页面控件初始化一个浏览器内核组件12,比如webcontainer组件;利用所述浏览器内核组件12加载一个和所述窗口同等大小的、透明的页面,也即加载一个和所述窗口的属性相匹配的页面。其中,窗口的属性信息可以包括尺寸信息和位置信息等。所谓和所述窗口的属性相匹配的页面可以指这个页面与所述窗口的大小和位置相同。

这里,上述子页面控件的信息包括:属性信息和子页面信息,其中属性信息可以包括尺寸信息、位置信息等,上述尺寸信息表明该子页面控件的大小,比如子页面控件的长和宽;上述位置信息表明该子页面控件的左顶点在整个窗口坐标系的坐标。其中上述子页面信息是对应该子页面控件的子页面的url。

在一些实例中,当所述网页页面加载完成时,界面处理模块11通过通讯通道13与所述页面处理模块14相互传递可调用的接口函数信息以注册相互调用的接口。

步骤103:针对从所述界面布局文件中解析出的每一个子页面控件的信息,执行步骤104~步骤107。

步骤104:根据所述子页面控件的属性信息,在所述窗口中的对应位置创建一个空白的子页面控件,并确定所述子页面控件的信息,所述子页面控件的信息包括:属性信息和子页面信息。

在一些实例中,在根据所述窗口的界面布局文件构建所述窗口的控件树时,每向所述窗口的控件树添加一个子页面控件时,根据所述界面布局文件中所述子页面控件的属性信息在所述窗口的对应位置创建一个空白的子页面控件,并根据所述子页面控件的属性信息,确定所述子页面控件的信息。

这里,上述子页面控件的信息中的属性信息除了包括尺寸信息和位置信息以外,还可以包括该子页面控件的控件标识和显示属性。其中,上述子页面控件标识是用来标识上述子页面控件的唯一标识,当响应于对子页面控件的操作而需要对相应的页面元素进行调整时,界面处理模块11可通过通讯通道13将操作事件和子页面控件的标识传递给页面处理模块14,页面处理模块14可以根据子页面控件的标识确定对应的页面元素,进而根据操作事件对此页面元素做相应的调整(比如:改变显示属性、改变位置/大小、做渲染更新等等)。

例如:当由于某个功能需要隐藏某一子页面控件对应的页面元素时,界面处理模块11首先隐藏用户界面15上的上述子页面控件,并通过通讯通道13将上述隐藏事件和所述子页面控件的标识传递给页面处理模块14以使其隐藏与上述子页面控件对应的上述页面元素及其内容数据。又例如:响应于对上述窗口某一子页面控件的用户界面输入事件,导致子页面控件的位置信息和尺寸信息发生变化时,界面处理模块11首先改变用户界面15内的上述子页面控件的位置信息和尺寸信息,并通过通讯通道13将所述子页面控件的标识以及上述子页面控件当前的位置信息和尺寸信息传递给页面处理模块14以使改变上述子页面控件对应的页面元素的位置信息和尺寸信息;上述显示属性包括显示的和隐藏的,如果上述子页面控件的显示属性是显示的,则在上述窗口中渲染出该子页面控件的内容;如果上述子页面控件的显示属性是隐藏的,则在上述窗口中不渲染该子页面控件的内容。

这里,在创建子页面控件时,界面处理模块11可以将子页面控件的标识包含在子页面控件的信息中,通过通讯通道13传递给页面处理模块14,页面处理模块14在加载了对应于该子页面控件的页面元素后,会建立子页面控件的标识和页面元素的标识之间的对应关系,从而后续操作中在收到子页面控件的标识后可以确定其对应的页面元素。

步骤105:通过浏览器内核组件12提供的通讯通道13,将所述子页面控件的信息发送给页面处理模块14,以使所述页面处理模块14根据所述子页面控件的信息中的属性信息在所述页面中创建一个与所述子页面控件的属性相匹配的页面元素,并根据所述子页面信息加载所述页面元素的内容数据。这里,所谓与所述子页面控件的属性相匹配的页面元素可以指与子页面控件的位置和大小相同的页面元素。

在一些实例中,当所述页面加载完成时,通过通讯通道13与页面处理模块14相互传递可调用的接口函数信息以注册相互调用的接口。

在一些实例中,界面处理模块11通过调用所述浏览器内核组件12提供的指定接口而向通讯通道13传递所述子页面控件的信息,以使通讯通道13通过页面处理模块14注册的调用接口将所述子页面控件的信息传递给页面处理模块14。

步骤106:响应于来自浏览器内核组件12的加载完成消息,从所述加载完成消息中提取所述页面元素的内容数据。其中,页面处理模块14在加载完成所述页面元素时触发浏览器内核组件12发送所述加载完成消息。

在一些实例中,界面处理模块11响应于所述浏览器内核组件12的渲染更新函数发送的加载完成消息,知道所述网页页面中的页面元素已经加载完成,从所述加载完成消息中获取与所述窗口的所述子页面控件对应的属性相匹配的所述页面元素的内容数据。其中,所述加载完成消息是页面处理模块14响应于所述网页页面的页面元素加载完成的操作触发浏览器内核组件12的渲染更新函数发送的,所述加载完成消息中携带有与所述窗口的所述子页面控件对应的属性相匹配的页面元素的内容数据,这里,上述内容数据包括文本、图片、动画等数据。

步骤107:在所述子页面控件上渲染所述内容数据。

在一些实例中,界面处理模块11响应于从用户界面接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给浏览器内核组件12,以使浏览器内核组件12将所述用户界面输入事件传递给页面处理模块14;响应于来自浏览器内核组件12的更新消息,从所述更新消息中提取所述子页面控件对应的页面元素的内容数据;其中,页面处理模块14响应于所述用户界面输入事件,对所述子页面控件对应的页面元素进行相应的内容更新处理并触发所述浏览器内核组件发送所述更新消息;在所述子页面控件上渲染从所述更新消息中提取的所述内容数据。

在一些实例中,响应于从用户界面接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件,以使所述浏览器内核组件将所述用户界面输入事件传递给页面处理模块14;响应于页面处理模块14通过所述通讯通道传递的页面元素的信息,所述页面元素的信息包括页面元素的属性信息,根据所述页面元素的信息,更新与所述页面元素对应的子页面控件的属性;其中,响应于所述用户界面输入事件,页面处理模块14更新所述子页面控件对应的所述页面元素的信息并通过所述通讯通道传递更新后的所述页面元素的信息,其中上述页面元素的属性信息包括位置信息和/或尺寸信息。

具体的,由于页面元素中的子页面一般都有自己的业务逻辑,比如当鼠标移到与所述页面元素对应的子页面控件时,需要该子页面控件尺寸变大,界面处理模块11将上述鼠标移动事件发送给页面处理模块14以后,页面处理模块14会根据使相应的页面元素进行响应,比如使该页面元素尺寸变大,并将变化后的页面元素的信息通过通讯通道13传递回给界面处理模块11,以使界面处理模块11根据上述页面元素的信息更新对应的子页面控件的尺寸。

在一些实例中,响应于从用户界面15接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件12,以使所述浏览器内核组件12将所述用户界面输入事件传递给页面处理模块14;响应于页面处理模块14通过所述通讯通道13发来的已完成消息,确认已处理完成所述用户界面输入事件;其中,页面处理模块14响应于所述用户界面输入事件,对所述子页面控件对应的页面元素进行相应的除内容更新以外的更新处理并发送所述已完成消息。

在一些实例中,响应于所述窗口属性变化,比如尺寸发生变化,导致的所述窗口内一个或多个子页面控件的属性发生变化的事件,通过所述通讯通道将当前所述一个或多个子页面控件的信息发送给页面处理模块14;响应于来自所述浏览器内核组件的更新消息,从所述更新消息中提取所述一个或多个子页面控件对应的页面元素的内容数据;其中,页面处理模块14根据从所述通讯通道接收到的所述一个或多个子页面控件的信息,更新所述页面中对应的页面元素的属性并触发所述浏览器内核组件发送所述更新消息;在所述一个或多个子页面控件上渲染从所述更新消息中提取的所述内容数据。

在一些实例中,所述子页面控件的信息进一步包括显示属性;其中,所述显示属性包括显示或隐藏;当所述显示属性包括隐藏时,则不执行所述从所述加载完成消息中提取所述页面元素的内容数据和所述在所述子页面控件上渲染所述内容数据的处理。

在一些实例中,当所述页面加载完成时,通过所述通讯通道与页面处理模块14相互传递可调用的接口函数信息以注册相互调用的接口;其中,通过调用所述浏览器内核组件提供的指定接口而向所述通讯通道传递所述子页面控件的信息,以使所述通讯通道通过页面处理模块14注册的调用接口将所述子页面控件的信息传递给页面处理模块14。

在上述实例中,在实现客户端一个用户界面窗口时只会初始化一个浏览器内核组件(如webcontainer组件),可以有效地减少应用客户端中浏览器内核组件的个数,降低占用的系统资源,提高运行性能,那么在客户端界面设计时可以轻松地引入大量页面界面设计和现成的页面动画技术,而无须考虑重复、大量创建浏览器内核组件所带来的性能影响,使客户端的界面设计不再有web页面个数限制。

此外,与应用客户端窗口子页面控件对应的所有的页面元素都被合并在同一个网页页面内,因此所述网页页面内的各个页面元素之间可以直接交互。web页面和客户端的界面布局可以高度叠加融合,web页面可交互的区域不再受限于在客户端布局中所占区域,可以实现客户端原生控件与web页面之间的交互。

对于使用客户端产品的用户来说,一方面用户对合并多个web页面的内容是无感知,另一方面由于产品的性能得到优化,用户在使用客户端产品过程中,所体验到的界面设计、动画效果等都会更加流畅,用户体验有所提升。

对于开发客户端产品的开发人员来说,该方案可以有效地将底层web多个页面合并的细节进行屏蔽,使得客户端开发不会再有可引入web页面个数的限制。同时,在页面中布局的与页面元素对应的子页面控件,并通过通讯通道实现页面元素和子页面控件之间的信息传递,使得开发人员无需关注底层的具体实现,可以直接开发各子页面控件对应的业务模块(即子页面的js逻辑),极大地提高了开发效率。

本申请的实例还提出了一种用户界面实现方法,该方法适用于需要同时展示网页页面内容和应用客户端子页面控件内容的应用客户端,比如qq游戏大厅应用客户端,由应用客户端的页面处理模块14来执行。图2示出了本申请实例提供的用户界面实现方法的流程图。如图2所示,包括以下步骤:

步骤201:接收界面处理模块11通过浏览器内核组件12提供的通讯通道13发送的子页面控件的信息,其中,所述子页面控件的信息包括:属性信息和子页面信息。

在一些实例中,页面处理模块14在接收界面处理模块11通过所述浏览器内核组件12提供的通讯通道13发送的子页面控件的信息之前,通过通讯通道13与界面处理模块11相互传递可调用的接口函数信息以注册相互调用的接口。

如前所述,上述子页面控件的信息包括属性信息和子页面信息,其中的属性信息可以包括尺寸信息和位置信息等,上述尺寸信息表明该子页面控件的大小,比如控件的长和宽;上述位置信息表明该子页面控件的左顶点在整个窗口坐标系的坐标;其中,子页面信息是对应该子页面控件的子页面的url。更进一步的,上述子页面控件的信息中的属性信息还可以包括该子页面控件的控件标识和显示属性。其中,上述控件标识是用来标识上述子页面控件的唯一标识;上述显示属性包括显示的和隐藏的,如果上述子页面控件的显示属性是显示的,则在上述窗口中渲染出该子页面控件的内容;如果上述子页面控件的显示属性是隐藏的,则在上述窗口中不渲染该子页面控件的内容。

步骤202:根据所述子页面控件的信息中的属性信息,在页面中创建一个与所述子页面控件的属性相匹配的页面元素,并根据所述子页面信息加载所述页面元素的内容数据,其中,所述页面是界面处理模块11初始化所述浏览器内核组件时加载的一个和待展示窗口的属性相匹配的页面。

在一些实例中,页面处理模块14接到界面处理模块11发送的所述子页面控件的信息以后,根据所述子页面控件的信息中的属性信息,创建一个与所述子页面控件的属性相匹配的页面元素,其中所述页面元素的标识与所述子页面控件的标识对应;根据所述子页面控件的信息中的子页面信息加载所述页面元素的内容数据。

步骤203:当加载完成所述页面元素时,触发浏览器内核组件12向界面处理模块11发送加载完成消息,以使界面处理模块11从所述加载完成消息中提取所述页面元素的内容数据并在所述子页面控件上渲染所述内容数据。

在一些实例中,响应于浏览器内核组件12发送的对所述窗口中一个子页面控件的用户界面输入事件,对所述子页面控件对应的页面元素进行相应的内容更新处理,其中,所述用户界面输入事件是界面处理模块11从用户界面接收到的并传递给所述浏览器内核组件;触发所述浏览器内核组件发送更新消息给界面处理模块11,以使界面处理模块11从所述更新消息中提取所述子页面控件对应的页面元素的内容数据并在所述子页面控件上渲染所提取的所述内容数据。其中,用户界面输入事件包括鼠标的点击、移动、释放、滚动等事件和键盘的点击、释放等事件等。

在一些实例中,响应于界面处理模块11通过所述浏览器内核组件发送的用户界面输入事件,更新所述子页面控件对应的所述页面元素的信息,其中,所述用户界面输入事件是用户界面接收到的在所述窗口中一个子页面控件输入的;响应于页面中页面元素的信息的更新,通过所述通讯通道传递所述页面元素的信息给界面处理模块11,以使界面处理模块11根据所述页面元素的信息,更新与所述页面元素对应的子页面控件的属性,其中,所述页面元素的信息包括页面元素的属性信息。

具体的,由于页面元素中的子页面一般都有自己的业务逻辑,比如当鼠标移到与所述页面元素对应的子页面控件时,需要该子页面控件尺寸变大,界面处理模块11将上述鼠标移动事件发送给页面处理模块14以后,页面处理模块14会根据上述子页面的逻辑使相应的页面元素进行响应,比如使该页面元素尺寸变大,并将变化后的页面元素的信息通过通讯通道13传递回给界面处理模块11,以使界面处理模块11根据上述页面元素的信息更新对应的子页面控件的尺寸。

例如,对于呼吸灯动画的实现,页面处理模块14响应于界面处理模块11通过所述浏览器内核组件12发送的到鼠标移动到窗口内的与网页页面上一页面元素对应的子页面控件上的事件,将所述页面元素的尺寸更新到预设放大尺寸,通过通讯通道13将更新后的所述页面元素的信息发送给界面处理模块11,以使界面处理模块11根据上述更新后的所述页面元素的信息更新所述子页面控件的信息,并通过浏览器内核组件12向界面处理模块11发送更新消息,以使界面处理模块11从上述更新消息中提取与上述页面元素的内容数据并将所述内容数据渲染到与上述页面元素对应的上述子页面控件上。

在上述呼吸灯动画实现中,当页面处理模块14再次接收到界面处理模块11发送的鼠标移离所述子页面控件的事件时,将所述页面元素的尺寸第二次更新至预设缩小尺寸,通过通讯通道13将第二次更新后的所述页面元素的信息发送给界面处理模块11,以使界面处理模块11根据上述第二次更新后的所述页面元素的信息第二次更新所述子页面控件的信息,并通过浏览器内核组件12向界面处理模块11发送第二次更新消息,以使界面处理模块11从上述第二次更新消息中提取与上述页面元素的内容数据并将所述内容数据渲染到与上述页面元素对应的上述子页面控件上。从所述页面元素的尺寸放大到尺寸缩小的过程触发窗口内的所述子页面控件的尺寸相应的放大尺寸和缩小尺寸,同时完成了所述子页面控件的内容数据的更新,进而实现了呼吸灯动画。

在一些实例中,响应于所述浏览器内核组件发送的对所述窗口中一个子页面控件的用户界面输入事件,对所述子页面控件对应的页面元素进行相应的除内容更新以外的更新处理;其中,所述用户界面输入事件是界面处理模块11从用户界面接收到的并传递给所述浏览器内核组件;通过所述通讯通道发送已完成消息给界面处理模块11,以通知界面处理模块11已处理完成所述用户界面输入事件。具体的,界面处理模块11从用户界面接收到的对所述窗口中一个子页面控件的用户界面输入事件,触发与所述子页面控件对应的页面元素的子页面做出的更新操作比如子页面只改变某一个变量,不需要界面处理模块11在与所述页面元素对应的子页面控件上进行渲染,也即不需要触发渲染更新函数向界面处理模块11发送更新消息,而只需要通过通讯通道13向界面处理模块11发送已完成消息,以对界面处理模块11发送的用户界面输入事件进行响应。

在一些实例中,所述子页面控件的信息进一步包括显示属性;其中,所述显示属性包括显示或隐藏;当所述显示属性包括隐藏时,则不执行所述根据所述子页面信息加载所述页面元素的内容数据的处理以及所述触发所述浏览器内核组件向界面处理模块11发送加载完成消息的处理。

在一些实例中,接收界面处理模块11通过所述通讯通道发送的属性发生变化的一个或多个子页面控件的信息,其中,所述一个或多个子页面控件的属性发生变化由所述窗口的属性变化而导致;根据从所述通讯通道接收到的所述一个或多个子页面控件的信息,更新所述页面中对应的页面元素的属性,并所述浏览器内核组件发送所述更新消息至界面处理模块11,以使界面处理模块11从所述更新消息中提取所述一个或多个子页面控件对应的页面元素的内容数据并在所述一个或多个子页面控件上渲染从所述更新消息中提取的所述内容数据。

在一些实例中,在接收界面处理模块11通过所述浏览器内核组件提供的通讯通道发送的子页面控件的信息之前,所述方法进一步包括:通过所述通讯通道与界面处理模块11相互传递可调用的接口函数信息以注册相互调用的接口;其中,通过调用所述浏览器内核组件提供的指定接口而向所述通讯通道传递所述页面元素的信息,以使所述通讯通道通过界面处理模块11注册的调用接口将所述页面元素的信息传递给界面处理模块11。

下面以qq游戏大厅界面为例,对上述用户界面实现方法进行详细说明。图3为本申请实例提供的用户界面实现方法的示例性流程图。如图3所示,主要包括以下步骤:

步骤301:qq游戏应用客户端的界面处理模块11(以下简称界面处理模块11)解析qq游戏应用客户端游戏大厅窗口(以下简称窗口)的界面布局文件。

例如,图4以给出一个窗口界面布局文件的示例。如图4所示,该界面布局文件中一共包含了5个子页面控件包括控件id为“left_navi”的子页面控件401、控件id为“my_app”的子页面控件402、控件id为“online_count”的子页面控件403、控件id为“mobile_entrance”的子页面控件404、控件id为“main_page”的子页面控件405。此外,该界面布局文件中还包括各个子页面控件的位置、大小信息以及url地址。

步骤302:界面处理模块11根据从所述界面布局文件中解析出的窗口属性信息,创建一个窗口和一个和所述窗口的属性相匹配的页面控件,由所述页面控件初始化一个浏览器内核组件12,以使浏览器内核组件12在所述页面控件中加载一个和所述窗口的属性相匹配的页面。

这里,窗口的属性信息包括尺寸信息和位置信息等。图5示出了界面处理模块11加载一个页面的示意图。如图5所示,界面处理模块501在解析一个窗口的界面布局文件时,当首次解析到该界面布局文件中的子页面控件时,创建一个和上述窗口同样大小、隐藏的、透明的页面控件,比如gweb控件502,该gweb控件502初始化一个浏览器内核组件比如webcontainer组件503,该webcontainer组件503加载应用客户端内置的,和上述窗口同样大小、隐藏的、透明的网页页面504。

步骤303:针对从所述界面布局文件中解析出的每一个子页面控件的信息,执行步骤304-步骤310。

步骤304:界面处理模块11根据所述子页面控件的属性信息,在所述窗口中的对应位置创建一个空白的子页面控件,并确定所述子页面控件的信息,所述子页面控件的信息包括:属性信息和子页面信息。

如前所述,上述子页面控件的信息包括:属性信息和子页面信息,其中属性信息可以是尺寸信息、位置信息等,上述尺寸信息表明该子页面控件的大小,比如子页面控件的长和宽;上述位置信息表明该子页面控件的左顶点在整个窗口坐标系的坐标。其中上述子页面信息是对应该子页面控件的子页面的url。

例如,图6是一个界面处理模块11在应用客户端窗口生成子页面控件的示例。如图6所示,界面处理模块11根据图4中的控件id为“left_navi”的子页面控件401在应用客户端窗口603上创建一个空白的子页面控件601,并根据子页面控件401的信息使该子页面控件601的位置为(0,60),宽度为60,高度为600,可见性为透明的、隐藏的。

步骤305:界面处理模块11通过浏览器内核组件12提供的通讯通道13,将所述子页面控件的信息发送给页面处理模块14,以使页面处理模块14根据所述子页面控件的信息中的属性信息在所述页面中创建一个与所述子页面控件的属性相匹配的页面元素,并根据所述子页面信息加载所述页面元素的内容数据。

以图6为例,界面处理模块11通过通讯通道605将子页面控件601的信息发送给网页页面604对应的页面处理模块14。其中,所述子页面控件的信息包括所述子页面控件的尺寸大小、位置信息、显示属性和对应的子页面。

步骤306:页面处理模块14接收界面处理模块11通过浏览器内核组件12提供的通讯通道13发送的子页面控件的信息,其中,所述子页面控件的信息包括:属性信息和子页面信息。

步骤307:页面处理模块14根据所述子页面控件的信息中的属性信息,在页面中创建一个与所述子页面控件的属性相匹配的页面元素,并根据所述子页面信息加载所述页面元素的内容数据,其中,所述页面是界面处理模块11初始化浏览器内核组件12时加载的一个和待展示窗口的属性相匹配的页面。

以图6为例,页面处理模块14在网页页面604上根据子页面控件601的信息创建页面元素602,将该页面元素602的id记为“left_navi”,并将使其位置为(0,60),宽度为60,高度为600,和应用客户端窗口603的子页面控件601保持一致。

图7示出了页面处理模块14在页面中加载页面元素的显示内容的示例。如图7所示,页面处理模块14根据界面处理模块11通过通讯通道13传输过来的子页面控件601的信息,在页面元素702中加载url为left_navi.html的子页面作为该页面元素702的显示内容。其中,网页页面701为透明颜色,页面元素702的对应的显示内容为左侧导航栏,里面包括“主页”、“游戏库”、“商店”、“蓝钻”、“发现”等内容。

步骤308:当加载完成所述页面元素时,页面处理模块14触发浏览器内核组件12向界面处理模块11发送加载完成消息,以使界面处理模块11从所述加载完成消息中提取所述页面元素的内容数据并在所述子页面控件上渲染所述内容数据。

步骤309:界面处理模块11响应于来自浏览器内核组件12的加载完成消息,从所述加载完成消息中提取所述页面元素的内容数据;其中,页面处理模块14在加载完成所述页面元素时触发浏览器内核组件12发送所述加载完成消息。

步骤310:界面处理模块11在所述子页面控件上渲染所述内容数据。

仍以图7为例,界面处理模块11去网页页面701上获取与图6中应用客户端窗口的子页面控件601对应的页面元素702的内容数据,比如位图,并将该内容数据渲染到子页面控件601上。

如前所述,针对从所述界面布局文件中解析出的每一个子页面控件的信息,执行步骤304-步骤310,也即上述窗口的界面布局文件中有多个子页面控件时,当界面处理模块11第n次(n为自然数,n>=2)解析到上述窗口中的子页面控件时,并不重新初始化一个新的浏览器内核组件12来加载新的网页页面,而是通过通讯通道13通知页面处理模块14在网页页面创建一个新的页面元素,并根据所述子页面控件的子页面信息加载所述新的页面元素的内容数据。通过这种方式,界面处理模块11只会初始化一个浏览器内核组件12,可以有效地减少应用客户端中浏览器内核组件的个数,降低占用的系统资源,提高运行性能。

例如,在图6的基础上,当界面处理模块11又解析到一个新的子页面控件,并不重新初始化一个新的浏览器内核组件12来打开新的网页页面,而是通过通讯通道13通知页面处理模块14在网页页面创建一个新的页面元素。图8示出了页面处理模块14在所述网页页面上创建多个页面元素的示例。如图8所示,页面处理模块14在网页页面804上根据应用客户端窗口803的子页面控件801创建了页面元素802之后,在界面处理模块11解析到新的子页面控件时,界面处理模块11在应用客户端窗口创建新子页面控件805,页面处理模块14根据应用客户端窗口803上的新子页面控件805,又创建了一个新的页面元素806,并使新的页面元素806的位置和大小与新子页面控件805相同,都是位置(60,60),宽度为100,高度为700。

通过以上技术方案可以看出,该用户界面实现方法一方面解决了应用客户端同一窗口合并多个网页页面而造成的性能低下的问题,使用户在使用应用客户端产品过程中,体验到的界面设计、动画效果等更加流畅,大大提升了用户体验。另一方面有效的将网页页面技术和应用客户端技术进行结合,解决了传统应用客户端产品中由于引入过多网页页面内容而带来的占用系统资源过高、运行性能下降等问题。

对应以上用户界面实现方法,本申请还提供了实现上述方法的客户端900。

在本申请的一些实例中,上述实现用户界面实现方法的客户端900可由图9所示的结构图实现,包括界面处理模块901和页面处理模块902,各模块的功能如下:

界面处理模块901,解析一个待展示界面的界面布局文件;根据从所述界面布局文件中解析出的窗口属性信息,创建一个窗口和一个和所述窗口的属性相匹配的页面控件,由所述页面控件初始化一个浏览器内核组件,以使浏览器内核组件在所述页面控件中加载一个和所述窗口的属性相匹配的页面;当从所述界面布局文件中解析出一个子页面控件的信息时:根据所述子页面控件的属性信息,在所述窗口中的对应位置创建一个空白的子页面控件,并确定所述子页面控件的信息,所述子页面控件的信息包括:属性信息和子页面信息;通过所述浏览器内核组件提供的通讯通道,将所述子页面控件的信息发送给页面处理模块902;

页面处理模块902,接收所述界面处理模块901通过所述通讯通道发送的所述子页面控件的信息;根据所述子页面控件的信息中的属性信息,在所述页面中创建一个与所述子页面控件的属性相匹配的页面元素,并根据所述子页面信息加载所述页面元素的内容数据;以及当加载完成根据所述页面元素的操作,触发所述浏览器内核组件向所述界面处理模块901发送加载完成消息;

界面处理模块901,响应于来自所述浏览器内核组件的加载完成消息,从所述加载完成消息中提取所述页面元素的内容数据;以及

界面处理模块901,进一步在所述子页面控件上渲染所述内容数据。

在一些实例中,界面处理模块901,进一步响应于从用户界面903接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件,以使所述浏览器内核组件将所述用户界面输入事件传递给页面处理模块902;页面处理模块902进一步响应于所述用户界面输入事件,对所述子页面控件对应的页面元素进行相应的内容更新处理并触发所述浏览器内核组件发送所述更新消息至界面处理模块901;以及界面处理模块901进一步响应于来自所述浏览器内核组件的更新消息,从所述更新消息中提取所述子页面控件对应的页面元素的内容数据,在所述子页面控件上渲染从所述更新消息中提取的所述内容数据并在所述子页面控件上渲染所述内容数据。

在一些实例中,界面处理模块901,进一步响应于从用户界面903接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件,以使所述浏览器内核组件将所述用户界面输入事件传递给页面处理模块902;页面处理模块902进一步响应于所述用户界面输入事件,对所述子页面控件对应的页面元素进行相应的除内容更新以外的更新处理,并通过所述通讯通道发送已完成消息给界面处理模块901;界面处理模块902进一步响应于所述通讯通道发来的已完成消息,确认已处理完成所述用户界面输入事件。

在一些实例中,当所述页面加载完成时,界面处理模块901和页面处理模块902,通过所述通讯通道相互传递可调用的接口函数信息以注册相互调用的接口;其中,界面处理模块901通过调用所述浏览器内核组件提供的指定接口而向所述通讯通道传递所述子页面控件的信息,以使所述通讯通道通过所述页面处理模块902注册的调用接口将所述子页面控件的信息传递给页面处理模块902;其中,页面处理模块902通过调用所述浏览器内核组件提供的指定接口而向所述通讯通道传递所述页面元素的信息,以使所述通讯通道通过界面处理模块901注册的调用接口将所述页面元素的信息传递给界面处理模块901。

在一些实例中,界面处理模块901,进一步响应于从用户界面903接收到的对所述窗口中一个子页面控件的用户界面输入事件,将所述用户界面输入事件转发给所述页面控件,由所述页面控件将所述用户界面输入事件传递给所述浏览器内核组件,以使所述浏览器内核组件将所述用户界面输入事件传递给页面处理模块902;页面处理模块902进一步响应于所述用户界面输入事件,更新所述子页面控件对应的所述页面元素的信息;页面处理模块902进一步响应于所述页面中所述页面元素的信息的更新,通过所述通讯通道传递所述页面元素的信息给界面处理模块901,其中,所述页面元素的信息包括所述页面元素的信息包括页面元素的属性信息;界面处理模块901进一步响应于所述通讯通道传递的页面元素的信息,根据所述页面元素的信息,更新与所述页面元素对应的子页面控件的属性。

在一些实例中,界面处理模块901,进一步响应于所述窗口属性变化导致的所述窗口内一个或多个子页面控件的属性发生变化的事件,通过所述通讯通道将当前所述一个或多个子页面控件的信息发送给页面处理模块902;页面处理模块902进一步接收所述通讯通道发送的属性发生变化的一个或多个子页面控件的信息;页面处理模块902进一步根据所述一个或多个子页面控件的信息,更新所述页面中对应的页面元素的属性,并触发所述浏览器内核组件发送所述更新消息至界面处理模块901;界面处理模块901进一步响应于来自所述浏览器内核组件的更新消息,从所述更新消息中提取所述一个或多个子页面控件对应的页面元素的内容数据;以及界面处理模块901进一步在所述一个或多个子页面控件上渲染从所述更新消息中提取的所述内容数据,并在所述一个或多个子页面控件上渲染从所述更新消息中提取的所述内容数据。

在一些实例中,所述子页面控件的信息进一步包括显示属性;其中,所述显示属性包括显示或隐藏;当所述显示属性包括隐藏时,界面处理模块901不执行所述从所述加载完成消息中提取所述页面元素的内容数据和所述在所述子页面控件上渲染所述内容数据的处理;页面处理模块902则不执行所述根据所述子页面信息加载所述页面元素的内容数据的处理以及所述触发所述浏览器内核组件向所述界面处理模块901发送加载完成消息的处理。

图10示出了实现用户界面实现方法的客户端900所在的计算设备1000的组成结构图。如图10所示,该计算设备包括一个或者多个处理器(cpu)1002、通信模块1004、存储器1006、用户接口1010,以及用于互联这些组件的通信总线1008。

处理器1002可通过通信模块1004接收和发送数据以实现网络通信和/或本地通信。

用户接口1010包括一个或多个输出设备1012,其包括一个或多个扬声器和/或一个或多个可视化显示器。用户接口1010也包括一个或多个输入设备1014,其包括诸如,键盘,鼠标,声音命令输入单元或扩音器,触屏显示器,触敏输入板,姿势捕获摄像机或其他输入按钮或控件等。

存储器1006可以是高速随机存取存储器,诸如dram、sram、ddrram、或其他随机存取固态存储设备;或者非易失性存储器,诸如一个或多个磁盘存储设备、光盘存储设备、闪存设备,或其他非易失性固态存储设备。

存储器1006存储处理器1002可执行的指令集,包括:

操作系统1016,包括用于处理各种基本系统服务和用于执行硬件相关任务的程序;

应用1018,包括用于用户界面实现方法的各种应用程序,这种应用程序能够实现上述各实例中的处理流程,比如可以包括图9所示的用户界面实现方法的客户端900中的部分或全部单元。各单元或模块901-902中的至少一个模块可以存储有机器可执行指令。处理器1002通过执行存储器1006中各模块901-902中至少一个模块中的机器可执行指令,进而能够实现上述各模块901-902中的至少一个模块的功能。

需要说明的是,上述各流程和各结构图中不是所有的步骤和模块都是必须的,可以根据实际的需要忽略某些步骤或模块。各步骤的执行顺序不是固定的,可以根据需要进行调整。各模块的划分仅仅是为了便于描述采用的功能上的划分,实际实现时,一个模块可以分由多个模块实现,多个模块的功能也可以由同一个模块实现,这些模块可以位于同一个设备中,也可以位于不同的设备中。

各实施例中的硬件模块可以以硬件方式或硬件平台加软件的方式实现。上述软件包括机器可读指令,存储在非易失性存储介质中。因此,各实施例也可以体现为软件产品。

因此,本申请的一些实例还提供了一种计算机可读存储介质,其上存储有计算机指令,其中,所述计算机指令被处理器执行时实现上述图1b-图8中任一图所述方法的步骤。

各例中,硬件可以由专门的硬件或执行机器可读指令的硬件实现。例如,硬件可以为专门设计的永久性电路或逻辑器件(如专用处理器,如fpga或asic)用于完成特定的操作。硬件也可以包括由软件临时配置的可编程逻辑器件或电路(如包括通用处理器或其它可编程处理器)用于执行特定操作。

另外,本申请的每个实例可以通过由数据处理设备如计算机执行的数据处理程序来实现。显然,数据处理程序构成了本申请。此外,通常存储在一个存储介质中的数据处理程序通过直接将程序读取出存储介质或者通过将程序安装或复制到数据处理设备的存储设备(如硬盘和或内存)中执行。因此,这样的存储介质也构成了本申请,本申请还提供了一种非易失性存储介质,其中存储有数据处理程序,这种数据处理程序可用于执行本申请上述方法实例中的任何一种实例。

图9中的模块对应的机器可读指令可以使计算机上操作的操作系统等来完成这里描述的部分或者全部操作。非易失性计算机可读存储介质可以是插入计算机内的扩展板中所设置的存储器中或者写到与计算机相连接的扩展单元中设置的存储器。安装在扩展板或者扩展单元上的cpu等可以根据指令执行部分和全部实际操作。

另外,在本申请各个实例中的装置及各模块可以集成在一个处理单元中,也可以是各个模块单独物理存在,也可以两个或两个以上装置或模块集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。

以上所述仅为本发明的较佳实施例而已,并不用以限制本发明,凡在本发明的精神和原则之内,所做的任何修改、等同替换、改进等,均应包含在本发明保护的范围之内。

当前第1页1 2 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1