一种动态页面展示方法、装置、电子设备及存储介质制造方法及图纸

本公开实施例中提供的动态页面展示方法，属于计算机技术领域，有助于改善展示动态页面时的性能。本公开实施例提供的动态页面展示方法包括：通过根据DSL描述的目标动态页面的页面信息，确定该目标动态页面中包括的各控件在目标位图中的展示逻辑信息树，其中，所述目标位图为展示所述目标动态页面的位图，所述展示逻辑信息树按照所述目标动态页面中包括的控件的展示逻辑，采用树形结构存储相应控件的控件信息；在确定所述目标动态页面中需要展示的界面区域后，根据所述展示逻辑信息树中存储的控件信息绘制所述需要展示的界面区域对应的位图；并根据所述展示逻辑信息树中存储的控件的位置和层级信息展示绘制的位图，有助于提升动态页面展示系统的性能。

A Dynamic Page Display Method, Device, Electronic Equipment and Storage Media

【技术实现步骤摘要】
一种动态页面展示方法、装置、电子设备及存储介质
本公开涉及计算机
，特别是涉及一种动态页面展示方法、装置、电子设备及存储介质。
技术介绍
动态页面指页面的展示内容动态变化的页面，对于电商，社交等需要快速迭代、实时调整的强运营类业务具有重要意义。动态页面的展示内容通常不是写在程序代码中的，而是通过动态化实时更新页面的技术实现动态页面的展示。现有的客户端动态渲染技术主要包括以下四种：1、基于webview的web页面动态化加载；2、本地内置多个模板支持动态切换；3，支持DSL语言的布局引擎；以及，4，基于虚拟机的动态化解决方案。基于webview的web页面动态化，实质是基于浏览器运行网页，页面绘制效率低，运行效率差，系统开销大。而后三种解决方案，实质是通过建立映射表、布局引擎和虚拟机与客户端渲染引擎通讯及调用关系，实现页面渲染。而渲染引擎则基于客户端操作系统原生UI控件搭建动态化页面。由于操作系统提供的UI控件绘制/布局仅支持主线程访问，大量原生UI控件操作导致客户端所在设备的CPU/GPU负担过重，虽然现有技术中部分技术方案在UI渲染过程中，将无需放置在主线程的UI控件操作进行剥离，最小化构建视图对主线程的性能损耗，在展示复杂的动态化页面时，仍然存在效率和性能瓶颈。
技术实现思路
本公开实施例提供一种动态页面展示方法，有助于提升动态页面展示系统的性能，本公开实施例提供了一种动态页面展示方法，包括：根据DSL描述的目标动态页面的页面信息，确定所述目标动态页面中包括的各控件在目标位图中的展示逻辑信息树，其中，所述目标位图为展示所述目标动态页面的位图，所述展示逻辑信息树按照所述目标动态页面中包括的控件的展示逻辑，采用树形结构存储相应控件的控件信息，所述控件信息包括相应控件的：渲染信息、位置信息、尺寸信息和层级信息；确定所述目标动态页面中需要展示的界面区域；根据所述展示逻辑信息树中存储的控件的渲染信息和尺寸信息绘制所述需要展示的界面区域对应的位图；在屏幕中，根据所述展示逻辑信息树中存储的所述控件的位置信息和层级信息展示绘制的所述需要展示的界面区域对应的位图。第二方面，本公开实施例提供了一种动态页面展示装置，包括：展示逻辑信息确定模块，用于根据DSL描述的目标动态页面的页面信息，确定所述目标动态页面中包括的各控件在目标位图中的展示逻辑信息树，其中，所述目标位图为展示所述目标动态页面的位图，所述展示逻辑信息树按照所述目标动态页面中包括的控件的展示逻辑，采用树形结构存储相应控件的控件信息，所述控件信息包括所述相应控件的渲染信息、位置信息、尺寸信息和层级信息；待展示的界面区域确定模块，用于确定所述目标动态页面中需要展示的界面区域；界面区域位图绘制模块，用于根据所述展示逻辑信息树中存储的控件的渲染信息和尺寸信息绘制所述需要展示的界面区域对应的位图；界面区域展示模块，用于在屏幕中，根据所述展示逻辑信息树中存储的所述控件的位置信息和层级信息展示绘制的所述需要展示的界面区域对应的位图。第三方面，本公开实施例还提供了一种电子设备，包括存储器、处理器及存储在所述存储器上并可在处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现本公开实施例所述的动态页面展示方法。第四方面，本公开实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时本公开实施例中所述的动态页面展示方法的步骤。本公开实施例提供了一种动态页面展示方法，通过根据DSL描述的目标动态页面的页面信息，确定所述目标动态页面中包括的各控件在目标位图中的展示逻辑信息树，其中，所述目标位图为展示所述目标动态页面的位图，所述展示逻辑信息树按照所述目标动态页面中包括的控件的展示逻辑，采用树形结构存储相应控件的控件信息，所述控件信息包括相应控件的：渲染信息、位置信息、尺寸信息和层级信息；确定所述目标动态页面中需要展示的界面区域；根据所述展示逻辑信息树中存储的控件的渲染信息和尺寸信息绘制所述需要展示的界面区域对应的位图；在屏幕中，根据所述展示逻辑信息树中存储的所述控件的位置信息和层级信息展示绘制的所述需要展示的界面区域对应的位图，有助于提升动态页面展示系统的性能。附图说明为了更清楚地说明本公开实施例的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本公开的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。图1是本公开实施例一的动态页面展示方法流程图；图2是本公开实施例一的展示的一个页面示意图；图3是本公开实施例一中DSL描述的页面信息示意图；图4是本公开实施例一中展示逻辑信息树示意图；图5是本公开实施例二的动态页面展示方法流程示意图；图6是本公开实施例三的动态页面展示方法中线程运行时序示意图；图7是本公开实施例四的动态页面展示装置的结构示意图之一；图8是本公开实施例四的动态页面展示装置的结构示意图之二。具体实施方式下面将结合本公开实施例中的附图，对本公开实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本公开一部分实施例，而不是全部的实施例。基于本公开中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本公开保护的范围。实施例一本公开实施例提供的一种动态页面展示方法，如图1所示，该方法包括：步骤110至步骤140。步骤110，根据DSL描述的目标动态页面的页面信息，确定所述目标动态页面中包括的各控件在目标位图中的展示逻辑信息树。其中，所述目标位图为展示所述目标动态页面的位图，所述展示逻辑信息树按照所述目标动态页面中包括的控件的展示逻辑，采用树形结构存储相应控件的控件信息，所述控件信息包括所述相应控件的渲染信息、位置信息、尺寸信息和层级信息和事件响应方法信息。具体实施时，可以按照所述目标动态页面中控件的自顶向下从左到右的排布位置关系，从前向后依次存储各控件的所述控件信息。DSL(domain-specificlanguage，领域特定语言)指的是专注于某个应用程序领域的计算机语言，又译作领域专用语言，可以用来描述界面的设计信息。设计师会设计出很多精美的界面，最后交给程序员去用代码编写成漂亮的网页或者App。每个界面如果纯用代码编写，都会面临大量的代码工作量，这里面可能更多的是一些重复的机械性的代码工作。诸如：某个元素设置长宽，设置居中，设置文字，设置距离上个元素XX像素，N个元素一起纵向，横向平均排列等等。现有技术中，为了提高工作效率，出现了把一些设计师产出的长宽、色值、文字、居中，距上等设计元数据(设计的标注信息等)，以一种约定的简洁的语言规则(即DSL)输入给程序代码，由程序和代码(如布局引擎)自动的分析和处理，从而生成真正的界面开发代码的应用，可以大幅度的减少代码量与工作量。本公开实施例中，基于获取的目标动态页面的通过DSL描述的页面信息，进一步进行布局和渲染，确定所述目标动态页面的渲染信息，用于后续进行页面展示。具体实施时，DSL可以为如XML、JSON、js、lua等结构化语言。本公开实施例中仅以结构化语言为XML举例说明页面展示方案。为了提升页面展示效率，本公开实施例中将不必须在本文档来自技高网...

【技术保护点】
1.一种动态页面展示方法，其特征在于，包括：根据DSL描述的目标动态页面的页面信息，确定所述目标动态页面中包括的各控件在目标位图中的展示逻辑信息树，其中，所述目标位图为展示所述目标动态页面的位图，所述展示逻辑信息树按照所述目标动态页面中包括的控件的展示逻辑，采用树形结构存储相应控件的控件信息，所述控件信息包括所述相应控件的渲染信息、位置信息、尺寸信息和层级信息；确定所述目标动态页面中需要展示的界面区域；根据所述展示逻辑信息树中存储的控件的渲染信息和尺寸信息绘制所述需要展示的界面区域对应的位图；在屏幕中，根据所述展示逻辑信息树中存储的所述控件的位置信息和层级信息展示绘制的所述需要展示的界面区域对应的位图。

【技术特征摘要】
1.一种动态页面展示方法，其特征在于，包括：根据DSL描述的目标动态页面的页面信息，确定所述目标动态页面中包括的各控件在目标位图中的展示逻辑信息树，其中，所述目标位图为展示所述目标动态页面的位图，所述展示逻辑信息树按照所述目标动态页面中包括的控件的展示逻辑，采用树形结构存储相应控件的控件信息，所述控件信息包括所述相应控件的渲染信息、位置信息、尺寸信息和层级信息；确定所述目标动态页面中需要展示的界面区域；根据所述展示逻辑信息树中存储的控件的渲染信息和尺寸信息绘制所述需要展示的界面区域对应的位图；在屏幕中，根据所述展示逻辑信息树中存储的所述控件的位置信息和层级信息展示绘制的所述需要展示的界面区域对应的位图。2.根据权利要求1所述的方法，其特征在于，所述控件信息还包括：事件响应方法，所述在屏幕中，根据所述展示逻辑信息树中存储的所述控件的位置信息和层级信息展示绘制的所述需要展示的界面区域对应的位图的步骤之后，还包括：接收对屏幕中展示的所述位图的触发操作；根据所述触发操作针对的所述位图的位置、所述位图对应的所述目标动态页面的位置和所述展示逻辑信息树中存储的控件的位置信息、尺寸信息和层级信息，确定所述触发操作针对的控件，以及所述控件的事件响应方法；修改所述触发操作针对的控件的渲染信息，重新绘制与所述需要展示的界面区域对应的位图并刷新显示，以更新所述触发操作针对的所述控件的显示效果；执行所述控件的事件响应方法；恢复所述触发操作针对的所述控件的渲染信息，重新绘制与所述需要展示的界面区域对应的位图并刷新显示，以恢复所述触发操作针对的所述控件的显示效果。3.根据权利要求1或2所述的方法，其特征在于，所述根据DSL描述的目标动态页面的页面信息，确定所述目标动态页面中包括的各控件在目标位图中的展示逻辑信息树的步骤之前，包括：在异步线程中获取DSL描述的目标动态页面的页面信息。4.根据权利要求1或2所述的方法，其特征在于，所述根据DSL描述的目标动态页面的页面信息，确定所述目标动态页面中包括的各控件在目标位图中的展示逻辑信息树的步骤，包括：在异步线程中对获取的所述DSL描述的目标动态页面的页面信息进行解析，确定所述目标动态页面中包括的控件和各所述控件的至少部分控件信息；在异步线程中按照所述至少部分控件信息和所述目标动态页面的预设布局信息，对所述目标动态页面中包括的各所述控件进行布局处理，确定各所述控件的控件信息，其中，所述控件信息包括：在所述目标动态页面中位置信息、尺寸信息、层级信息、渲染信息、事件响应方法；按照各所述控件在展示所述目标动态页面的目标位图中的展示逻辑，采用树形结构存储各所述控件的控件信息，生成所述目标动态页面的展示逻辑信息树。5.根据权利要求1或2所述的方法，其特征在于，所述根据所述展示逻辑信息树中存储的控件的渲染信息和尺寸信息绘制所述需要展示的界面区域对应的位图的步骤，包括：根据所述展示逻辑信息树中存储的控件信息，确定所述需要展示的界面区域中包括的控件；通过调用系统的绘制接口，根据所述界面区域中包括的各控件的渲染信息和尺寸信息绘制所述需要展示的界面区域的位图。6.一种动态页面展示装置，其特征在于，包括：展示逻辑信息确定模块，用于根据DSL描述的目标动态页...

【专利技术属性】
技术研发人员：陈航，宋洋洋，
申请(专利权)人：北京三快在线科技有限公司，
类型：发明
国别省市：北京,11