CN107145355B - 页面布局的调整方法及装置、存储介质、处理器和终端 - Google Patents
页面布局的调整方法及装置、存储介质、处理器和终端 Download PDFInfo
- Publication number
- CN107145355B CN107145355B CN201710317758.1A CN201710317758A CN107145355B CN 107145355 B CN107145355 B CN 107145355B CN 201710317758 A CN201710317758 A CN 201710317758A CN 107145355 B CN107145355 B CN 107145355B
- Authority
- CN
- China
- Prior art keywords
- window
- game
- size
- chat interface
- adjusting
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Images
Landscapes
- Information Transfer Between Computers (AREA)
Abstract
本发明公开了一种页面布局的调整方法及装置、存储介质、处理器和终端。其中,该方法包括:在网页游戏运行过程中获取触发指令,其中,网页游戏在网页内运行,触发指令用于触发将内置聊天界面切换为外置聊天界面,内置聊天界面位于游戏场景界面内部,外置聊天界面位于游戏场景界面外部;根据触发指令对网页内整体的页面布局进行调整。本发明解决了相关技术中所采用的外置聊天窗口都是独立于游戏窗口本身之外单独设置的窗口、其操作复杂度较高、耗费过多硬件和网络资源、影响游戏运行的流畅性的技术问题。
Description
技术领域
本发明涉及游戏领域,具体而言,涉及一种页面布局的调整方法及装置、存储介质、处理器和终端。
背景技术
目前,在网页游戏领域通常采用Flash(其为交互式矢量图和Web动画标准)技术实现,游戏玩家在进行网页游戏时,通常需要首先启动本地浏览器输入网页游戏地址,然后由网页游戏会检测是否本地浏览器是否安装有FlashPlayer(其为一种广泛使用的、专有的多媒体程序播放器)插件。在FlashPlayer插件安装成功之后,网页游戏便可在该插件窗口内运行。为了丰富游戏玩家的游戏体验,网页游戏内部通常会设置聊天界面,以便于多名游戏玩家之间进行日常游戏聊天交流。但是,在大多数网页游戏中往往仅能够实现聊天窗口内置功能,却很少能够实现聊天窗口外置功能,即,将聊天窗口设置于游戏窗口外部,由此更加便于游戏玩家在查阅聊天信息的同时又不会影响游戏内部的交互体验。
为此,相关技术中提供了以下两种聊天窗口外置的实现方式:
方式一、使用轮询技术来实现网页游戏的外置聊天窗口,客户端按照预设时间间隔向服务端发送请求消息,通过频繁发送请求消息的方式来保持客户端的与服务端之间的聊天信息同步更新。
该方式的缺陷在于:由于轮询技术是由浏览器客户端定时向服务端发起超文本传输协议(HTTP)request,然而,HTTP request的头部(header)较长,但其内部包含的有用数据可能仅为一个很小的值,因此,该方式会占用大量带宽,从而影响网页游戏本身的网络连接以及游戏流畅度。
方式二、使用多窗口交互通信技术来实现网页游戏的外置聊天窗口,多个窗口进行消息之间的传递或者函数调用,其中,既可以是网页窗口与ActiveX(其为一些软件组件或对象,可以将其插入到网页或其他应用程序中)窗口,也可以是ActiveX窗口和游戏Win32(即微软操作系统32位环境)窗口。
该方式的缺陷在于:如果网页游戏的外置聊天窗口由网页窗口构建,则需要使用多窗口之间消息互相通信技术,由此会带来繁重的聊天信息同步工作,进而影响整个网页游戏性能,同时浏览器网页窗口大小位置等属性变化还需要在多个窗口之间实现同步,由此还会降低游戏玩家的游戏体验以及提升游戏开发与维护的成本。
由此可见,相关技术中所采用的外置聊天窗口都是独立于游戏窗口本身之外单独设置的窗口,而在独立窗口中与服务端进行通信交互存在如下弊端:
(1)需要重新设计聊天界面和逻辑,程序代码无法实现完全复用,考虑到游戏的程序设计语言与外置聊天窗口程序设计语言存在差异,可能需要使用网页超文本标记语言(HTML)和JavaScript语言(其为一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型)重新设计一套逻辑和界面,外加网页聊天技术往往通过客户端轮询服务端来进行聊天信息的更新同步,势必会影响游戏的效率,进而造成游戏过程卡顿;
(2)独立的网页窗口在聊天功能内置与外置之间切换时,势必需要进行聊天信息的同步,而当信息量过大时会造成游戏在特定时间点或时间段内需要长时间占用终端的处理器以处理大量聊天业务和逻辑,同样会造成游戏过程卡顿。
针对上述的问题,目前尚未提出有效的解决方案。
发明内容
本发明实施例提供了一种页面布局的调整方法及装置、存储介质、处理器和终端,以至少解决相关技术中所采用的外置聊天窗口都是独立于游戏窗口本身之外单独设置的窗口、其操作复杂度较高、耗费过多硬件和网络资源、影响游戏运行的流畅性的技术问题。
根据本发明的其中一实施例,提供了一种页面布局的调整方法,包括:
在网页游戏运行过程中获取触发指令,其中,网页游戏在网页内运行,触发指令用于触发将内置聊天界面切换为外置聊天界面,内置聊天界面位于游戏场景界面内部,外置聊天界面位于游戏场景界面外部;根据触发指令对网页内的页面布局进行调整。
可选地,根据触发指令对页面布局进行调整包括:按照内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域,其中,待填充区域的尺寸与内置聊天界面的尺寸相同;将内置聊天界面移动并覆盖至待填充区域,得到外置聊天界面,其中,调整后的游戏窗口包括:游戏场景界面和外置聊天界面;按照调整后的游戏窗口的尺寸对插件窗口的尺寸进行调整并通过插件窗口对页面布局进行适配,其中,游戏窗口内嵌在插件窗口中,插件窗口用于为网页游戏提供运行环境。
可选地,按照内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域包括:获取游戏场景界面的第一分辨率与显示屏幕的第二分辨率;采用第一分辨率与第二分辨率,计算缩放比例;按照缩放比例以及内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域。
可选地,按照调整后的游戏窗口的尺寸对插件窗口的尺寸进行调整并通过插件窗口对页面布局进行适配包括:通过向插件窗口发送预设消息,指示插件窗口按照调整后的游戏窗口的尺寸进行适配,其中,第一预设消息中携带的参数信息包括:调整后的游戏窗口的尺寸,第一预设消息的有效时长;经由插件窗口将调整后的游戏窗口的尺寸传递至页面,指示页面按照调整后的游戏窗口的尺寸对层叠样式表(CSS)进行适配。
可选地,在根据触发指令对页面布局进行调整之后,还包括:在插件窗口接收到第二预设消息之后,从第二预设消息中提取事件类型;若通过插件窗口查找到与事件类型对应事件回调函数,则将第二预设消息传递至游戏窗口,控制游戏窗口执行对事件回调函数对应的操作。
根据本发明的其中一实施例,还提供了一种页面布局的调整装置,包括:
获取模块,用于在网页游戏运行过程中获取触发指令,其中,网页游戏在网页内运行,触发指令用于触发将内置聊天界面切换为外置聊天界面,内置聊天界面位于游戏场景界面内部,外置聊天界面位于游戏场景界面外部;调整模块,用于根据触发指令对网页内的页面布局进行调整。
可选地,调整模块包括:第一调整单元,用于按照内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域,其中,待填充区域的尺寸与内置聊天界面的尺寸相同;处理单元,用于将内置聊天界面移动并覆盖至待填充区域,得到外置聊天界面,其中,调整后的游戏窗口包括:游戏场景界面和外置聊天界面;第二调整单元,用于按照调整后的游戏窗口的尺寸对插件窗口的尺寸进行调整并通过插件窗口对页面布局进行适配,其中,游戏窗口内嵌在插件窗口中,插件窗口用于为网页游戏提供运行环境。
可选地,第一调整单元包括:获取子单元,用于获取游戏场景界面的第一分辨率与显示屏幕的第二分辨率;计算子单元,用于采用第一分辨率与第二分辨率,计算缩放比例;调整子单元,用于按照缩放比例以及内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域。
可选地,第二调整单元包括:第一处理子单元,用于通过向插件窗口发送预设消息,指示插件窗口按照调整后的游戏窗口的尺寸进行适配,其中,第一预设消息中携带的参数信息包括:调整后的游戏窗口的尺寸,第一预设消息的有效时长;第二处理子单元,用于经由插件窗口将调整后的游戏窗口的尺寸传递至页面,指示页面按照调整后的游戏窗口的尺寸对CSS进行适配。
可选地,上述装置还包括:提取模块,用于在插件窗口接收到第二预设消息之后,从第二预设消息中提取事件类型;处理模块,用于若通过插件窗口查找到与事件类型对应事件回调函数,则将第二预设消息传递至游戏窗口,控制游戏窗口执行对事件回调函数对应的操作。
根据本发明的其中一实施例,还提供了一种存储介质,包括:存储的程序,其中,在程序运行时控制存储介质所在设备执行上述页面布局的调整方法。
根据本发明的其中一实施例,还提供了一种处理器,该处理器用于运行程序,其中,程序运行时执行上述页面布局的调整方法。
根据本发明的其中一实施例,还提供了一种终端,包括:一个或多个处理器,存储器,显示装置以及一个或多个程序,其中,一个或多个程序被存储在存储器中,并且被配置为由一个或多个处理器执行,一个或多个程序包括用于执行上述页面布局的调整方法。
在本发明实施例中,采用在网页游戏运行过程中获取触发指令将内置聊天界面切换为外置聊天界面的方式,通过根据触发指令对网页内的页面布局进行调整,达到了在网页游戏运行过程中,能够在内置聊天窗口与外置聊天窗口之间实现自由无缝切换的目的,从而实现了提高游戏玩家的游戏社交舒适度及游戏操作便利性的技术效果,进而解决了相关技术中所采用的外置聊天窗口都是独立于游戏窗口本身之外单独设置的窗口、其操作复杂度较高、耗费过多硬件和网络资源、影响游戏运行的流畅性的技术问题。
附图说明
此处所说明的附图用来提供对本发明的进一步理解,构成本申请的一部分,本发明的示意性实施例及其说明用于解释本发明,并不构成对本发明的不当限定。在附图中:
图1是根据本发明其中一实施例的页面布局的调整方法的流程图;
图2是根据本发明其中一优选实施例的由内置聊天界面切换至外置聊天界面过程的示意图;
图3是根据本发明其中一实施例的页面布局的调整装置的结构框图;
图4是根据本发明其中一优选实施例的页面布局的调整装置的结构框图。
具体实施方式
为了使本技术领域的人员更好地理解本发明方案,下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分的实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都应当属于本发明保护的范围。
需要说明的是,本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本发明的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含,例如,包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
根据本发明实施例,提供了一种页面布局的调整方法的实施例,需要说明的是,在附图的流程图示出的步骤可以在诸如一组计算机可执行指令的计算机系统中执行,并且,虽然在流程图中示出了逻辑顺序,但是在某些情况下,可以以不同于此处的顺序执行所示出或描述的步骤。
图1是根据本发明其中一实施例的页面布局的调整方法的流程图,如图1所示,该方法包括如下步骤:
步骤S12,在网页游戏运行过程中获取触发指令,其中,网页游戏在网页内运行,触发指令用于触发将内置聊天界面切换为外置聊天界面,内置聊天界面位于游戏场景界面内部,外置聊天界面位于游戏场景界面外部;
步骤S14,根据触发指令对网页内的页面布局进行调整。
其中,触发指令可以包括但不限于:用户触摸、点击、滑开特定区域、按钮、或用户发出特定语音的用户行为;也可以是根据预定的规则,在规则所规定的要件达成时由系统生成的操作指令。外置聊天界面与游戏场景界面可以设置为相邻也可以设置为不相邻。根据触发指令可以对网页内的整体页面布局进行调整也可以对网页内的局部页面布局进行调整。
通过上述步骤,可以采用在网页游戏运行过程中获取触发指令将内置聊天界面切换为外置聊天界面的方式,通过根据触发指令对网页内整体的页面布局进行调整,达到了在网页游戏运行过程中,能够在内置聊天窗口与外置聊天窗口之间实现自由无缝切换的目的,从而实现了提高游戏玩家的游戏社交舒适度及游戏操作便利性的技术效果,进而解决了相关技术中所采用的外置聊天窗口都是独立于游戏窗口本身之外单独设置的窗口、其操作复杂度较高、耗费过多硬件和网络资源、影响游戏运行的流畅性的技术问题。
可选地,步骤S14,根据触发指令对页面布局进行调整可以包括以下执行步骤:
步骤S141,按照内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域,其中,待填充区域的尺寸与内置聊天界面的尺寸相同;
步骤S142,将内置聊天界面移动并覆盖至待填充区域,得到外置聊天界面,其中,调整后的游戏窗口包括:游戏场景界面和外置聊天界面;
步骤S143,按照调整后的游戏窗口的尺寸对插件窗口的尺寸进行调整并通过插件窗口对页面布局进行适配,其中,游戏窗口内嵌在插件窗口中,插件窗口用于为网页游戏提供运行环境。
在网页游戏中将游戏的聊天界面通过ActiveX插件以及JavaScript技术映射到浏览器网页窗口上,并且外置聊天窗口的交互操作和内容完全与内置聊天窗口相互同步。在网页游戏运行过程中,能够在内置聊天窗口与外置聊天窗口之间实现自由无缝切换,由此,极大地提高了游戏玩家的游戏社交舒适度及游戏操作便利性。
在优选实施过程中,可以将外置聊天窗口集成到游戏窗口内部,通过改变游戏窗口、插件窗口尺寸及网页整体CSS样式来实现。游戏窗口和插件窗口本质上都是win32窗口程序,插件窗口是提供一个ActiveX运行的环境的容器,而游戏窗口则是提供一个游戏图像动画渲染绘制及程序运行环境的容器。
图2是根据本发明其中一优选实施例的由内置聊天界面切换至外置聊天界面过程的示意图,如图2所示,在该优选实施例中,可以增加聊天内置与外置切换函数和标记变量,无论聊天界面内置还外置,都只有一个游戏窗口,而并没有新增窗口。
如果需要将聊天界面由内置状态切换至外置状态,首先,需要修改聊天界面的z轴(即屏幕渲染节点显示深度)层次,使得聊天界面被调整至游戏窗口内所有界面之上;然后,为了与聊天界面的内置状态相区分,通过修改聊天界面内UI控件(主要包括:聊天表情子界面上UI控件的位置排版)的坐标来重新排布控件的位置来达到改变界面排版的目的;然后,调用Cocos2d(基于MIT协议的开源框架,用于构建游戏、应用程序和其他图形界面交互应用)游戏引擎接口将引擎内部聊天状态标记变量修改为外置状态,以及修改当前设计分辨率,将设计分辨率的宽度在原来的基础上增加至可以容纳一个经过调整排版后的聊天界面。考虑到修改的是设计分辨率,因而并不会影响网页游戏本身的游戏场景,同时还会在游戏窗口的右侧出现一个待填充区域。鉴于游戏窗口本身的宽度增加,最后,再将聊天界面移动至待填充区域处,并将聊天界面的渲染z轴层次调整至顶层,因此,能够有效地覆盖待填充区域。
通过上述调整,游戏窗口已完成聊天界面的外置状态切换显示,此时,游戏引擎可以将当前窗口的宽、高属性传递给网页ActiveX插件窗口,以便该插件窗口修改宽度并调用网页JavaScript函数,按照游戏窗口的尺寸对网页窗口的CSS样式进行适配。
可选地,步骤S141,按照内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域可以包括以下执行步骤:
步骤S1411,获取游戏场景界面的第一分辨率与显示屏幕的第二分辨率;
步骤S1412,采用第一分辨率与第二分辨率,计算缩放比例;
步骤S1413,按照缩放比例以及内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域。
基于Cocos2d引擎开发的游戏客户端是通过“设计分辨率(相当于上述第一分辨率)+缩放比例”来适配不同类型终端的屏幕分辨率(相当于上述第二分辨率)。为了达到只修改窗口尺寸但不影响游戏屏幕适配,可以通过修改设计分辨率保持缩放比例的方式来实现。
例如:假设网页游戏整体UI界面效果图及实际运行界面长度与宽度均已960*640(iphone4屏幕分辨率)为标准输出,即界面设计整体的长度与宽度不能超过960*640。假设设计分辨率被设置为1024*768,那么游戏能支持的终端屏幕分辨率最低即为960*640,如果低于该屏幕分辨率的终端运行上述游戏,那么游戏内界面将出现不同程度的裁剪(即不完整显示);如果设计的UI界面效果图及实际运行界面长宽都以1024*768为标准输出(即界面设计的整体长宽不能超过1024*768),并且设计分辨率不变,那么游戏能够支持的终端屏幕分辨率最低即为1024*768。如果终端屏幕分辨率高于设计分辨率时,为了确保游戏界面能够完整显示,Cocos2d引擎通过对屏幕分辨率与设计分辨率进行比较,然后选取其中比例较小的一方作为游戏缩放比,进而达到游戏画面及游戏场景整体按照此缩放比进行放大或者缩小以实现完全显示的目的,其中,缩放比的计算方法可以设置为:缩放比=min{第二分辨率宽/第一分辨率宽,第二分辨率高/第一分辨率高}。
进一步地,如果需要将设计分辨率的宽度增加一个聊天界面的宽度时,如果先前采用的是960*640设计分辨率,再加上聊天界面宽度(例如:530),那么设计分辨率就会变为1490*640。如果需要在960*640的终端屏幕分辨率下显示时,可以得出游戏画面及游戏场景整体按照计算出的缩放比为保持不变,从而游戏画面及场景是无需进行缩放的。但是,由于设计分辨率的宽度增加了530,从而游戏窗口的宽度也就会对应增加530,另外,考虑到游戏窗口的x轴起始坐标是以左到右的,从而在游戏场景的右侧便会多出宽度为530的待填充区域,该部分便会成为外置聊天界面显示的区域。
可选地,步骤S143,按照调整后的游戏窗口的尺寸对插件窗口的尺寸进行调整并通过插件窗口对页面布局进行适配可以包括以下执行步骤:
步骤S1431,通过向插件窗口发送预设消息,指示插件窗口按照调整后的游戏窗口的尺寸进行适配,其中,第一预设消息中携带的参数信息可以包括:调整后的游戏窗口的尺寸,第一预设消息的有效时长;
步骤S1432,经由插件窗口将调整后的游戏窗口的尺寸传递至页面,指示页面按照调整后的游戏窗口的尺寸对CSS进行适配。
游戏窗口与插件窗口之间可以通过跨进程窗口之间的WM_COPYDATA类型的数据包消息通信,考虑到游戏渲染实时性的要求,因而无法使用阻塞性的消息发送函数例如:SendMessage函数,其原因在于:该函数用于同步发送消息,使用该函数发送的消息会阻塞整个游戏消息循环,而只有等到发送的消息被处理完毕才会返回处理结果;那么当一个消息需要处理的时间较长或者处理消息的函数出现死循环,便会导致整个游戏主循环一直处于等待状态,从而导致游戏假死。此外,考虑到需要自定义数据结构,因此,诸如PostMessage函数也无法使用,其原因在于:虽然该函数用于异步发送消息,不会阻塞游戏窗口消息主循环,但是该函数携带的消息参数无法使用自定义的数据结构作为消息体,故而无法自由扩展传递的消息内容,由此限制游戏功能开发。综合上述分析,在本发明提供的一个优选实施方式中,可以采用SendMessage Timeout函数(相当于上述第一预设消息),该函数可以自定义消息头及消息体,并设置超时时间(如果超时则丢弃该消息),同时还可以为自定义消息增加消息队列数据结构对窗口消息进行统一管理,适合进行不同窗口之间跨进程通信。以上述图2为例,游戏窗口可以采用SendMessage Timeout函数将该调整后宽度信息传递至插件窗口,插件窗口做出相应地适配操作,以便与游戏窗口的尺寸保持一致;然后插件窗口还会将调整后宽度信息透传至网页,以便网页重新进行CSS样式布局。
可选地,在步骤S14,根据触发指令对页面布局进行调整之后,还可以包括以下执行步骤:
步骤S15,在插件窗口接收到第二预设消息之后,从第二预设消息中提取事件类型;
步骤S16,若通过插件窗口查找到与事件类型对应事件回调函数,则将第二预设消息传递至游戏窗口,控制游戏窗口执行对事件回调函数对应的操作。
插件窗口可以通过COM对象HTMLDocument2接口的get_Script方法获取代表HTML中的JS代码的IDispatch接口,并利用该接口将JS代码作为一个COM对象来调用其函数,然后再通过Invoke等函数将参数透传到HTML JS环境中。这样便可完成在插件窗口环境中使用c++代码调用网页JavaScript函数的功能。而JS代码通过注册在HTML网页中的CLASSID属性找到唯一的插件对象,并在获取到插件对象后便可如同调用JS函数语法一样调用预先定义的插件函数,即完成在网页环境中JavaScript函数调用插件窗口环境中的c++函数,同时考虑到网页JS函数和插件函数之间存在频繁互相调用的情况且方便后续需求扩展,所以在插件窗口加入回调函数Map数据结构,以增加事件派发器机制,其原理在于:在插件初始化时注册对应事件和处理函数在全局函数Map中,当JS层调用一个通用插件函数(相当于上述第二预设消息)时,要求参数中携带事件类型和对应数据数组,并在插件窗口接收到调用信息之后,通过在注册的函数Map中查找对应的事件类型,进而在查找成功后回调对应的事件回调函数,其目的在于:便于后续可以在不更新插件版本的情况下仅通过通用函数便可开发迭代新的功能。另外,插件窗口是网页JavaScript函数与游戏窗口透传信息的中间层,即先由JavaScript函数将参数传递至插件窗口函数,再由插件窗口函数通过上述消息传递机制将参数再传递至游戏窗口进行对应的逻辑处理,回路也是如此。因而,如果在网页JavaScript上新增了一个功能处理函数,只需与该功能处理函数协定一个事件类型,然后通过插件窗口(无需获知事件类型,而只需在Map回调函数查找到该事件类型便可将消息发送到游戏窗口,而插件回调函数Map内携带的函数回调地址则是在游戏窗口注册的)再回调给游戏窗口,这样便不必每次新增功能函数都需要在插件窗口这个中间层增加一个函数来透传消息。
当游戏玩家在外置聊天界面输入框输入聊天信息或者插入表情时,便可采取与游戏窗口内置聊天界面相同的操作,插入的信息或者表情通过客户端和服务端定义的通信协议上传到服务器,然后,在服务器接收到插入的信息或者表情后,再广播给其他游戏玩家操控的客户端,由此,其他游戏玩家操控的客户端便可在接收到插入的信息或者表情后刷新客户端界面显示。
通过本发明至少一个实施例提供的上述技术方案,无需实现一个独立于游戏窗口之外的聊天窗口,而是通过修改原有的游戏窗口设计分辨率,改变游戏窗口本身的聊天界面显示坐标位置从而在视觉上达到外置聊天的效果。由于游戏窗口内嵌在网页的插件窗口中,因此,在改变游戏窗口的同时需要通过窗口消息通知父窗口(即插件窗口)做出相应地改变,同时回调给网页前端脚本JavaScript修改网页样式,进而达到聊天界面外置的效果,以减少不必要的窗口创建及聊天内容信息的同步显示的客户端消耗,提高了整体客户端的流畅度;此外,还可以有效地避免使用网页端来实现(即使用网页自身技术,例如:HTML加上JavaScript来实现纯网页聊天功能,这样去实现势必会引入新的聊天服务器以及实现对应服务端聊天信息存储、转发等相应功能,但这些功能和游戏本身关联较小)聊天功能所带来额外的服务端压力,同时还能够避免客户端二次开发及后期维护。
根据本发明其中一实施例,还提供了一种页面布局的调整装置。图3是根据本发明其中一实施例的页面布局的调整装置的结构框图,如图3所示,该装置可以包括:获取模块10,用于在网页游戏运行过程中获取触发指令,其中,网页游戏在网页内运行,触发指令用于触发将内置聊天界面切换为外置聊天界面,内置聊天界面位于游戏场景界面内部,外置聊天界面位于游戏场景界面外部;调整模块20,用于根据触发指令对网页内的页面布局进行调整。
可选地,图4是根据本发明其中一优选实施例的页面布局的调整装置的结构框图,如图4所示,调整模块20可以包括:第一调整单元200,用于按照内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域,其中,待填充区域的尺寸与内置聊天界面的尺寸相同;处理单元202,用于将内置聊天界面移动并覆盖至待填充区域,得到外置聊天界面,其中,调整后的游戏窗口包括:游戏场景界面和外置聊天界面;第二调整单元204,用于按照调整后的游戏窗口的尺寸对插件窗口的尺寸进行调整并通过插件窗口对页面布局进行适配,其中,游戏窗口内嵌在插件窗口中,插件窗口用于为网页游戏提供运行环境。
可选地,第一调整单元200可以包括:获取子单元(图中未示出),用于获取游戏场景界面的第一分辨率与显示屏幕的第二分辨率;计算子单元(图中未示出),用于采用第一分辨率与第二分辨率,计算缩放比例;调整子单元(图中未示出),用于按照缩放比例以及内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域。
可选地,第二调整单元204包括:第一处理子单元(图中未示出),用于通过向插件窗口发送预设消息,指示插件窗口按照调整后的游戏窗口的尺寸进行适配,其中,第一预设消息中携带的参数信息包括:调整后的游戏窗口的尺寸,第一预设消息的有效时长;第二处理子单元(图中未示出),用于经由插件窗口将调整后的游戏窗口的尺寸传递至页面,指示页面按照调整后的游戏窗口的尺寸对CSS进行适配。
可选地,如图4所示,上述装置还可以包括:提取模块30,用于在插件窗口接收到第二预设消息之后,从第二预设消息中提取事件类型;处理模块40,用于若通过插件窗口查找到与事件类型对应事件回调函数,则将第二预设消息传递至游戏窗口,控制游戏窗口执行对事件回调函数对应的操作。
根据本发明其中一实施例,还提供了一种存储介质,存储介质包括存储的程序,其中,在程序运行时控制存储介质所在设备执行上述页面布局的调整方法。上述存储介质可以包括但不限于:U盘、只读存储器(ROM)、随机存取存储器(RAM)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。
根据本发明其中一实施例,还提供了一种处理器,处理器用于运行程序,其中,程序运行时执行上述页面布局的调整方法。上述处理器可以包括但不限于:微处理器(MCU)或可编程逻辑器件(FPGA)等的处理装置
根据本发明其中一实施例,还提供了一种终端,包括:一个或多个处理器,存储器,显示装置以及一个或多个程序,其中,一个或多个程序被存储在存储器中,并且被配置为由一个或多个处理器执行,程序包括用于执行上述页面布局的调整方法。在一些实施例中,上述终端可以是智能手机(例如:Android手机、iOS手机等)、平板电脑、掌上电脑以及移动互联网设备(Mobile Internet Devices,简称为MID)、PAD等终端设备。上述显示装置可以是触摸屏式的液晶显示器(LCD),该液晶显示器可使得用户能够与终端的用户界面进行交互。此外,上述终端还可以包括:输入/输出接口(I/O接口)、通用串行总线(USB)端口、网络接口、电源和/或相机。
上述本发明实施例序号仅仅为了描述,不代表实施例的优劣。
在本发明的上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述的部分,可以参见其他实施例的相关描述。
在本申请所提供的几个实施例中,应该理解到,所揭露的技术内容,可通过其它的方式实现。其中,以上所描述的装置实施例仅仅是示意性的,例如所述单元的划分,可以为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,单元或模块的间接耦合或通信连接,可以是电性或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外,在本发明各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储介质中。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可为个人计算机、服务器或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。
以上所述仅是本发明的优选实施方式,应当指出,对于本技术领域的普通技术人员来说,在不脱离本发明原理的前提下,还可以做出若干改进和润饰,这些改进和润饰也应视为本发明的保护范围。
Claims (9)
1.一种页面布局的调整方法,其特征在于,包括:
在网页游戏运行过程中获取触发指令,其中,所述网页游戏在网页内的游戏窗口中运行,所述触发指令用于触发将内置聊天界面切换为外置聊天界面,所述内置聊天界面位于游戏场景界面内部,所述外置聊天界面位于所述游戏场景界面外部,所述游戏窗口包括:所述游戏场景界面和所述外置聊天界面;
根据所述触发指令对所述网页内的页面布局进行调整;
其中,根据所述触发指令对所述页面布局进行调整包括:按照所述内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域,其中,所述待填充区域的尺寸与所述内置聊天界面的尺寸相同;将所述内置聊天界面移动并覆盖至所述待填充区域,得到所述外置聊天界面,其中,调整后的游戏窗口包括:所述游戏场景界面和所述外置聊天界面;按照调整后的游戏窗口的尺寸对插件窗口的尺寸进行调整并通过所述插件窗口对所述页面布局进行适配,其中,所述游戏窗口内嵌在所述插件窗口中,所述插件窗口用于为所述网页游戏提供运行环境;
其中,在根据所述触发指令对所述页面布局进行调整之后,还包括:在所述插件窗口接收到第二预设消息之后,从所述第二预设消息中提取事件类型;若通过所述插件窗口查找到与所述事件类型对应事件回调函数,则将所述第二预设消息传递至所述游戏窗口,控制所述游戏窗口执行对所述事件回调函数对应的操作。
2.根据权利要求1所述的方法,其特征在于,按照所述内置聊天界面的尺寸对所述游戏窗口的尺寸进行调整,得到所述待填充区域包括:
获取所述游戏场景界面的第一分辨率与显示屏幕的第二分辨率;
采用所述第一分辨率与所述第二分辨率,计算缩放比例;
按照所述缩放比例以及所述内置聊天界面的尺寸对所述游戏窗口的尺寸进行调整,得到所述待填充区域。
3.根据权利要求1所述的方法,其特征在于,按照所述调整后的游戏窗口的尺寸对所述插件窗口的尺寸进行调整并通过所述插件窗口对所述页面布局进行适配包括:
通过向所述插件窗口发送第一预设消息,指示所述插件窗口按照所述调整后的游戏窗口的尺寸进行适配,其中,所述第一预设消息中携带的参数信息包括:所述调整后的游戏窗口的尺寸,所述第一预设消息的有效时长;
经由所述插件窗口将所述调整后的游戏窗口的尺寸传递至所述页面,指示所述页面按照所述调整后的游戏窗口的尺寸对层叠样式表CSS进行适配。
4.一种页面布局的调整装置,其特征在于,包括:
获取模块,用于在网页游戏运行过程中获取触发指令,其中,所述网页游戏在网页内的游戏窗口中运行,所述触发指令用于触发将内置聊天界面切换为外置聊天界面,所述内置聊天界面位于游戏场景界面内部,所述外置聊天界面位于所述游戏场景界面外部,所述游戏窗口包括:所述游戏场景界面和所述外置聊天界面;
调整模块,用于根据所述触发指令对所述网页内的页面布局进行调整;
其中,所述调整模块包括:第一调整单元,用于按照所述内置聊天界面的尺寸对游戏窗口的尺寸进行调整,得到待填充区域,其中,所述待填充区域的尺寸与所述内置聊天界面的尺寸相同;处理单元,用于将所述内置聊天界面移动并覆盖至所述待填充区域,得到所述外置聊天界面,其中,调整后的游戏窗口包括:所述游戏场景界面和所述外置聊天界面;第二调整单元,用于按照调整后的游戏窗口的尺寸对插件窗口的尺寸进行调整并通过所述插件窗口对所述页面布局进行适配,其中,所述游戏窗口内嵌在所述插件窗口中,所述插件窗口用于为所述网页游戏提供运行环境;
其中,所述装置还包括:提取模块,用于在所述插件窗口接收到第二预设消息之后,从所述第二预设消息中提取事件类型;处理模块,用于若通过所述插件窗口查找到与所述事件类型对应事件回调函数,则将所述第二预设消息传递至所述游戏窗口,控制所述游戏窗口执行对所述事件回调函数对应的操作。
5.根据权利要求4所述的装置,其特征在于,所述第一调整单元包括:
获取子单元,用于获取所述游戏场景界面的第一分辨率与显示屏幕的第二分辨率;
计算子单元,用于采用所述第一分辨率与所述第二分辨率,计算缩放比例;
调整子单元,用于按照所述缩放比例以及所述内置聊天界面的尺寸对所述游戏窗口的尺寸进行调整,得到所述待填充区域。
6.根据权利要求4所述的装置,其特征在于,所述第二调整单元包括:
第一处理子单元,用于通过向所述插件窗口发送第一预设消息,指示所述插件窗口按照所述调整后的游戏窗口的尺寸进行适配,其中,所述第一预设消息中携带的参数信息包括:所述调整后的游戏窗口的尺寸,所述第一预设消息的有效时长;
第二处理子单元,用于经由所述插件窗口将所述调整后的游戏窗口的尺寸传递至所述页面,指示所述页面按照所述调整后的游戏窗口的尺寸对层叠样式表CSS进行适配。
7.一种存储介质,其特征在于,所述存储介质包括存储的程序,其中,在所述程序运行时控制所述存储介质所在设备执行权利要求1至3中任意一项所述的页面布局的调整方法。
8.一种处理器,其特征在于,所述处理器用于运行程序,其中,所述程序运行时执行权利要求1至3中任意一项所述的页面布局的调整方法。
9.一种终端,其特征在于,包括:一个或多个处理器,存储器,显示装置以及一个或多个程序,其中,所述一个或多个程序被存储在所述存储器中,并且被配置为由所述一个或多个处理器执行,所述一个或多个程序包括用于执行权利要求1至3中任意一项所述的页面布局的调整方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710317758.1A CN107145355B (zh) | 2017-05-08 | 2017-05-08 | 页面布局的调整方法及装置、存储介质、处理器和终端 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710317758.1A CN107145355B (zh) | 2017-05-08 | 2017-05-08 | 页面布局的调整方法及装置、存储介质、处理器和终端 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN107145355A CN107145355A (zh) | 2017-09-08 |
CN107145355B true CN107145355B (zh) | 2021-05-25 |
Family
ID=59778133
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201710317758.1A Active CN107145355B (zh) | 2017-05-08 | 2017-05-08 | 页面布局的调整方法及装置、存储介质、处理器和终端 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN107145355B (zh) |
Families Citing this family (12)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN107995169B (zh) * | 2017-11-21 | 2020-06-16 | 厦门点触科技股份有限公司 | 一种基于微服务架构的手机游戏服务端框架系统 |
CN108156248A (zh) * | 2017-12-29 | 2018-06-12 | 贵阳朗玛信息技术股份有限公司 | 一种基于客户端获取适配图像的方法及装置 |
CN111460342B (zh) * | 2019-01-21 | 2023-04-25 | 阿里巴巴集团控股有限公司 | 页面的渲染展示方法、装置、电子设备及计算机存储介质 |
CN110262844B (zh) * | 2019-04-17 | 2022-10-14 | 创新先进技术有限公司 | 对话框组件调用方法、装置、服务器及存储介质 |
CN111008012B (zh) * | 2019-12-06 | 2024-05-03 | 上海米哈游网络科技股份有限公司 | 一种原型设计方法、装置、电子产品及存储介质 |
CN113253880B (zh) * | 2020-02-11 | 2024-03-08 | 腾讯科技(深圳)有限公司 | 互动场景的页面的处理方法、装置及存储介质 |
CN111589168B (zh) * | 2020-05-12 | 2023-03-21 | 腾讯科技(深圳)有限公司 | 即时通讯方法、装置、设备及介质 |
CN112114928B (zh) * | 2020-09-28 | 2023-12-22 | 西安万像电子科技有限公司 | 显示页面的处理方法和装置 |
CN112473137B (zh) * | 2020-12-08 | 2023-11-28 | 网易(杭州)网络有限公司 | 游戏对象的显示方法、装置、存储介质与终端设备 |
CN112527172B (zh) * | 2020-12-30 | 2022-12-16 | 网易(杭州)网络有限公司 | 界面显示方法及装置、计算机可读存储介质、电子设备 |
CN113244615B (zh) * | 2021-06-11 | 2023-07-14 | 腾讯科技(深圳)有限公司 | 聊天面板的显示控制方法和装置、存储介质及电子设备 |
CN113476842A (zh) * | 2021-07-21 | 2021-10-08 | 网易(杭州)网络有限公司 | 一种游戏信息提醒方法、装置、设备及存储介质 |
Family Cites Families (10)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
JP3574106B2 (ja) * | 2001-12-14 | 2004-10-06 | 株式会社スクウェア・エニックス | ネットワークゲームシステム、ゲームサーバ装置、ビデオゲーム装置、ネットワークゲームにおけるメッセージの送信方法及び表示制御方法、プログラム、並びに記録媒体 |
US7549924B2 (en) * | 2003-05-09 | 2009-06-23 | Microsoft Corporation | Instant messaging embedded games |
CN102801650A (zh) * | 2012-08-10 | 2012-11-28 | 上海量明科技发展有限公司 | 即时通信交互界面中显示场景的方法、客户端及系统 |
CN103457838B (zh) * | 2013-08-18 | 2019-04-02 | 苏州量跃信息科技有限公司 | 即时通信中实现自适应界面的方法及系统 |
CN103412710A (zh) * | 2013-08-23 | 2013-11-27 | 苏州辉游网络有限公司 | 游戏对话框 |
CN103618662B (zh) * | 2013-11-22 | 2016-10-05 | 北京奇虎科技有限公司 | 一种实现即时通讯的方法和装置 |
CN104899080A (zh) * | 2014-03-05 | 2015-09-09 | 腾讯科技(深圳)有限公司 | 即时通讯切换实时画面的方法和装置 |
CN106293355B (zh) * | 2015-05-11 | 2020-09-01 | 腾讯科技(深圳)有限公司 | 即时通讯窗口显示的方法和装置 |
CN105404539A (zh) * | 2015-12-30 | 2016-03-16 | 网易(杭州)网络有限公司 | 客户端游戏向网页游戏移植的方法、网页游戏系统及终端 |
CN105843466B (zh) * | 2016-03-14 | 2020-03-31 | 广州趣丸网络科技有限公司 | 一种实时语音的方法及装置 |
-
2017
- 2017-05-08 CN CN201710317758.1A patent/CN107145355B/zh active Active
Non-Patent Citations (5)
Title |
---|
"大话西游手游网页版快捷键介绍教你一些你不知道的技巧";兰雪;《http://m.wy.pipaw.com/xinwen/news248212.html》;20160526;1-2 * |
"猴战将大话西游2【经典版】2015年春节活动实地测试"视频截图;猴战将;《https://v.youku.com/v_show/id_XODgyNDYzODM2.html?spm=a2h0k.11417342.soresults.dtitle》;20150130;1-3 * |
"陈玩大话西游2-排了1年多地宫终于换神兵了。"视频截图;chen4076986;《https://v.youku.com/v_show/id_XNjA4NDEyODM2.html?spm=a2h0k.11417342.soresults.dtitle》;20130913;1-3 * |
大话手游网页版惊喜上线 5·20全品牌大动作;网易大话西游新闻中心;《http://dhxy.163.com/news/2016/05/20/18573_618918.html》;20160520;1-4 * |
网页也能玩大话手游啦!;网易大话西游新闻中心;《http://dhxy.163.com/news/2016/05/25/18573_619718.html》;20160525;1-2 * |
Also Published As
Publication number | Publication date |
---|---|
CN107145355A (zh) | 2017-09-08 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN107145355B (zh) | 页面布局的调整方法及装置、存储介质、处理器和终端 | |
TWI776066B (zh) | 圖片生成方法、裝置、終端、伺服器及儲存媒體 | |
KR102255138B1 (ko) | 메시지 처리 방법과 장치, 저장 매체, 및 컴퓨터 장치 | |
WO2018113140A1 (zh) | 一种视频直播中虚拟礼物显示方法和系统 | |
EP4296851A1 (en) | Method and apparatus for displaying application picture, and terminal, screen projection system and medium | |
CN106331345B (zh) | 一种交互消息展示方法、装置及系统 | |
CN105611215A (zh) | 一种视频通话方法及装置 | |
US12026421B2 (en) | Screen sharing method, apparatus, and device, and storage medium | |
WO2015164823A1 (en) | Messaging with drawn graphic input | |
US20230215076A1 (en) | Image frame display method, apparatus, device, storage medium, and program product | |
CN112347408B (zh) | 渲染方法、装置、电子设备及存储介质 | |
CN111432262B (zh) | 页面视频渲染方法及装置 | |
US20230306694A1 (en) | Ranking list information display method and apparatus, and electronic device and storage medium | |
CN112988299A (zh) | 推荐信息的显示方法、装置、终端及存储介质 | |
CN111249723B (zh) | 游戏中的显示控制的方法、装置、电子设备及存储介质 | |
CN111381749A (zh) | 一种图像显示和处理方法、装置、设备和存储介质 | |
CN104599307A (zh) | 一种在移动终端上采用动画显示图片的方法 | |
CN106874008A (zh) | 一种动态桌面图标的实现方法及装置 | |
CN113034653A (zh) | 一种动画渲染方法及装置 | |
CN113655895B (zh) | 应用于输入法的信息推荐方法、装置及电子设备 | |
CN106383705B (zh) | 在应用瘦客户端中设置鼠标显示状态的方法及装置 | |
CN104102536A (zh) | 一种数据的展示方法和系统 | |
WO2022166943A1 (zh) | 消息发送的方法及装置、电子设备和可读存储介质 | |
CN115908654A (zh) | 基于虚拟形象的交互方法、装置、设备及存储介质 | |
CN113134234A (zh) | 信息显示方法、装置、终端及存储介质 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |