CN109800039A - 一种用户界面展示方法、装置、电子设备及存储介质 - Google Patents

一种用户界面展示方法、装置、电子设备及存储介质 Download PDF

Info

Publication number
CN109800039A
CN109800039A CN201811436584.1A CN201811436584A CN109800039A CN 109800039 A CN109800039 A CN 109800039A CN 201811436584 A CN201811436584 A CN 201811436584A CN 109800039 A CN109800039 A CN 109800039A
Authority
CN
China
Prior art keywords
business model
user interface
interface
information
data
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.)
Granted
Application number
CN201811436584.1A
Other languages
English (en)
Other versions
CN109800039B (zh
Inventor
陈航
宋洋洋
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Sankuai Online Technology Co Ltd
Original Assignee
Beijing Sankuai Online Technology Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Beijing Sankuai Online Technology Co Ltd filed Critical Beijing Sankuai Online Technology Co Ltd
Priority to CN201811436584.1A priority Critical patent/CN109800039B/zh
Publication of CN109800039A publication Critical patent/CN109800039A/zh
Application granted granted Critical
Publication of CN109800039B publication Critical patent/CN109800039B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Landscapes

  • User Interface Of Digital Computer (AREA)
  • Processing Or Creating Images (AREA)

Abstract

本公开的用户界面展示方法,属于计算机技术领域,有助于改善现有技术中在展示用户界面时效率低下的问题。本公开提供了一种用户界面展示方法包括:针对用户界面中的每一个业务模型,获取该业务模型的数据;通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息;在确定该业务模型需要显示时,根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片;确定该业务模型在用户界面中的显示位置;并在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片。本公开提供的用户界面展示方法,通过对用户界面中的每个业务模型分别进行数据获取、排版、用户界面图片绘制及展示,提升了用户界面展示效率。

Description

一种用户界面展示方法、装置、电子设备及存储介质
技术领域
本公开涉及计算机技术领域,特别是涉及一种用户界面展示方法、装置、电子设备及存储介质。
背景技术
前端界面展示过程中,界面的布局和渲染是两个必要的步骤。布局和渲染的效率,直接决定前端界面的展示效率。传统的用户界面展示技术方案中,对用户界面的布局和渲染采用控件添加、拼接等形式进行排列组合,而操作系统提供的用户界面控件布局或渲染接口,仅支持主线程访问。大量的用户界面控件操作将导致CPU(中央处理单元)/GPU(图形处理单元)负担过重,降低系统性能。
尽管,现有技术中通常会将界面展示过程中不必要在主线程中执行的操作,由异步线程执行,但是,当构建复杂的用户界面视图时,在最终的用户界面控件布局或渲染接口步骤,异步线程需要将大量的界面数据同步到主线程,通过调用系统的控件进行界面渲染,仍然会存在性能瓶颈。并且,现有技术中在进行界面渲染和展示时,一个页面作为整体进行渲染展示,当页面中某个区域显示的内容发生变化时,无法局部进行渲染和显示,也会导致界面展示效率低下。
发明内容
本公开提供一种用户界面展示方法,有助于提升用户界面展示系统的性能,本公开实施例提供了一种用户界面展示方法,包括:
针对用户界面中的每一个业务模型,获取该业务模型的数据;
通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息;
在确定该业务模型需要显示时,根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片;
确定该业务模型在用户界面中的显示位置;
在确定该业务模型需要显示时,在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片。
第二方面,本公开实施例提供了一种用户界面展示装置,包括:
业务模型数据获取模块,用于针对用户界面中的每一个业务模型,获取该业务模型的数据;
界面绘制信息确定模块,用于通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息;
用户界面图片绘制模块,用于在确定该业务模型需要显示时,根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片;
显示位置确定模块,用于确定该业务模型在用户界面中的显示位置;
用户界面图片展示模块,用于在确定该业务模型需要显示时,在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片。
第三方面,本公开实施例还提供了一种电子设备,包括存储器、处理器及存储在所述存储器上并可在处理器上运行的计算机程序,所述处理器执行所述计算机程序时实现本公开实施例所述的用户界面展示方法。
第四方面,本公开实施例提供了一种计算机可读存储介质,其上存储有计算机程序,该程序被处理器执行时本公开实施例中所述的用户界面展示方法的步骤。
本公开实施例提供了一种用户界面展示方法,通过针对用户界面中的每一个业务模型,获取该业务模型的数据;通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息;在确定该业务模型需要显示时,根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片;确定该业务模型在用户界面中的显示位置;在确定该业务模型需要显示时,在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片,有助于改善现有技术中在展示用户界面时效率低下的问题。
附图说明
为了更清楚地说明本公开实施例的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本公开的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。
图1是本公开实施例一的用户界面展示方法流程图;
图2是本公开实施例一的展示的一个用户界面示意图;
图3是本公开实施例二的用户界面展示方法线程执行示意图之一;
图4是本公开实施例二的用户界面展示方法线程执行示意图之二;
图5是本公开实施例三的用户界面展示装置的结构示意图之一;
图6是本公开实施例三的用户界面展示装置的结构示意图之二。
具体实施方式
下面将结合本公开实施例中的附图,对本公开实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例是本公开一部分实施例,而不是全部的实施例。基于本公开中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本公开保护的范围。
实施例一
本公开实施例提供的一种用户界面展示方法,如图1所示,该方法包括:步骤110至步骤150。
步骤110,针对用户界面中的每一个业务模型,获取该业务模型的数据。
以移动终端的用户界面展示为例,当用户滑动移动终端屏幕,或打开某个应用时,移动终端需要刷新展示用户界面,在此过程中,首先需要获取待展示的用户界面中包括的业务模型的数据。本公开实施例中所述的业务模型的数据指待展示的用户界面各区域对应的业务模型的数据。其中,业务模型可以对应功能模块、不同应用软件等。
以用户界面为图2所示商家卡片列表为例,所述用户界面中包括3个业务模型,分别为业务模型210、业务模型220和业务模型230。
在本公开的一些实施例中,移动终端的客户端在检测到需要刷新展示用户界面后,通过主线程构建每个业务模型的请求参数,并创建与每个业务模型对应的数据请求任务,然后,由网络线程执行所述数据请求任务,向服务器获取用户界面中包括的各业务模型的数据。其中,数据请求任务携带相应业务模型的请求参数,例如:业务模型的数据访问地址。具体到图2所示的用户界面中,移动终端的主线程分别构建业务模型210、业务模型220和业务模型230的请求参数,并创建与业务模型210、业务模型220和业务模型230一一对应的数据请求任务1至3。然后,由网络线程执行所述数据请求任务1至3。
在本公开的一些实施例中,所述网络线程可以为主线程。在本公开的另一些实施例中,所述网络线程为主线程的异步线程,网络线程可以通过网络线程队列获取数据请求任务,并依次执行各数据请求任务。在本公开的又一些实施例中,还可以通过共享内存或其他线程间通信的方式,实现主线程和异步线程之间的数据通信,获取数据请求任务。
在本公开的一些实施例中,所述数据请求任务根据携带的相应业务模型的请求参数,访问后台服务器,以获取该业务模型的数据。
在本公开的一些实施例中,所述业务模型的数据包括在所述用户界面内展示的相应业务模型的控件的数据。具体到图2所示用户界面,数据请求任务3将获取到包含了店铺名称,图片,评级,配送时长,客单价,优惠活动等店铺属性的商家数据。
本步骤中获取的各业务模型的数据的过程是预加载数据的过程。例如,当用户切换至某个用户界面之后,首先对该用户界面的业务模型数据进行预加载。在具体应用过程中,用户的操作是无法预先获知的。可能用户会浏览当前用户界面中的业务模块,也可能用户会连续快速切换用户界面,或者,用户也可能删除当前用户界面中的某个或某些业务模型。具体实施时,可以通过算法对用户的行为进行预测,从而实现模型数据预加载,以提升用户界面展示效率。比如根据用户的历史操作习惯数据预测用户可能会选择的业务模型,然后对这些业务模型进行预加载。但是,预测可能存在错误的情况,如果上一次预测会加载的业务模型在本次预测时,认为不会再被预加载,则会停止不会再被预加载的业务模型的排版和绘制过程。为了应对在这种情况下的业务模型的变化,在本公开的一些实施例中,需要根据用户的操作对不需要预加载的业务模型的数据执行移除操作,以减少冗余数据,提升后续步骤的数据处理效率。所述针对用户界面中的每一个业务模型,获取该业务模型的数据的步骤之后,还包括:获取对所述用户界面中的所述业务模型的移除操作;删除与所述移除操作针对的所述业务模型对应的数据。
在本公开的一些实施例中,可以通过监控用户的移除操作,其中,所述移除操作包括但不限于:移除某个业务模型的操作、移除当前用户界面的操作。进一步的,移除当前用户界面的操作可以为切换当前用户界面至其他用户界面的操作,此时可以认为移除了该用户界面上的所有业务模型。本公开具体实施时,移除当前用户界面的操作可以看作是移除当前用户界面内全部业务模型的操作。在获取到用户对当前用户界面中的所述业务模型的移除操作之后,进一步删除用户的移除操作所移除的某个或某些所述业务模型对应的数据。
步骤120,通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息。
之后,对于获取的每个业务模型的数据进行排版处理,确定每个业务模型的界面绘制信息。其中,业务模型的界面绘制信息至少包括绘制业务模型对应的用户界面中各控件时调用系统的绘制接口所需要参数。
排版处理的目的是确认用户界面中各业务模型的展示区域的界面绘制信息,其中,每个业务模型的展示区域的界面的界面绘制信息包括绘制该业务模型的展示区域的界面中包括的各控件的绘制参数。在本公开的一些实施例中,所述绘制参数至少包括以下任意一项:布局信息、层级信息、渲染信息。其中,所述布局信息可以为UI(用户接口)控件的大小、位置,层级信息可以为UI控件的展示层级(图顶层、底层等),渲染信息可以为UI控件的背景色、展示字体、字号、透明度、边框等控件视觉属性信息。
在本公开的一些实施例中,可以通过预先建立从业务模型到布局信息和渲染信息的转换规则,并根据所述转换规则在具体排版过程中将业务模型数据解析构建成可以直接用于调用绘制接口的包含布局信息、层级信息、渲染信息等的绘制接口参数。
在本公开的一些实施例中,该业务模型的数据包括在所述用户界面内展示的相应业务模型的控件的数据,所述通过对该业务模型的数据进行排版处理,确定该业务模型的界面绘制信息,包括:按照所述用户界面的预设展示属性对所述控件进行排版处理,确定各所述控件的绘制参数;根据各所述控件的绘制参数,确定该业务模型的界面绘制信息;其中,所述绘制参数至少包括以下任意一项:布局信息、层级信息、渲染信息。例如,对于不同的用户界面,业务人员会定义界面包含的业务模型,以及各业务模型的展示属性。
其中,所述展示属性用于指示每个业务模型的展示位置、展示风格。例如,图2所示的用户界面的展示属性为列表,用户界面中第一个展示的业务模型210的左上角坐标为用户界面的左上角坐标,业务模型210的展示区域为宽W*高H的界面区域,后续的每个业务模型的展示位置(如业务模型220和230的展示位置)根据业务模型210的展示位置和展示区域高H确定;在每个业务模型中的数据中还包括所述用户界面内展示的相应业务模型的控件的数据,如图2中的业务模型230的数据中还包括:店铺名称,图片,评级,配送时长,客单价,优惠活动等店铺属性的商家数据。所述预设展示属性还用于指示每个业务模型的控件的展示位置、展示风格等。例如,图片展示在在业务模型对应的展示区域的左侧,图片展示底层、店铺名称展示在业务模型对应的展示区域的右侧最上方,加粗字体显示等。
排版任务被执行时,基于携带的业务模型数据执行排版操作,确定每个业务模型数据中包括的控件的绘制参数。各业务模型的数据中包括的所有控件的绘制参数,构成了该业务模型的界面绘制信息。
步骤130,在确定该业务模型需要显示时,根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片。
在本公开的一些实施例中,所述根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片的步骤,包括:根据该业务模型对应的界面绘制信息,调用系统的绘制接口绘制该业务模型对应的用户界面图片。例如,在确定了各业务模型的界面绘制信息之后,对于每个业务模型,根据其界面绘制信息调用系统提供的绘制接口绘制相应业务模型对应的用户界面图片。
例如,业务模型230的界面中包括店铺名称,图片,评级,配送时长,客单价,优惠活动等店铺属性,则业务模型230的数据中将包括上述店铺属性对应的控件。而不同的店铺属性可能对应不同的控件,也可能对应相同的控件。例如,图片对应图片控件,而店铺名称、星级、配送时长,客单价属性对应文本控件。对于一个业务模型,以其界面绘制信息中各控件的绘制参数调用相应的绘制接口,就可以在该业务模型对应的用户界面图片的相应位置绘制出该控件。最后,当该业务模型内的所有控件绘制完成时,就得到了业务模型对应的用户界面图片。
本公开的一些实施例中,在分别根据所述界面绘制信息绘制相应业务模型对应的用户界面图片时,优选的,按照所述业务模型在所述用户界面中的显示区域的显示先后顺序,分别根据所述界面绘制信息绘制相应业务模型对应的用户界面图片。例如,当用户界面中业务模型的显示顺序是从上到下显示时,则首先绘制用户界面最上方的业务模型的用户界面图片,然后再依次绘制从上到下显示的各业务模型的用户界面图片。通常,用户界面展示顺序与用户界面中业务模型的显示顺序匹配,通过按照所述业务模型在所述用户界面中的显示区域的显示先后顺序,分别根据所述界面绘制信息绘制相应业务模型对应的用户界面图片有助于提升用户界面展示的速度。
在本公开的一些实施例中,各业务模型的数据中还包括显示位置信息。根据显示位置信息和显示顺序,确定个业务模型的用户界面图片的绘制顺序。
步骤140,确定该业务模型在用户界面中的显示位置。
具体实施时,根据各业务模型的业务数据中包括的相对显示位置信息和当前用户界面中最上方业务模型在用户界面中的显示位置,可以进一步确定当前用户界面内包括的每个业务模型在用户界面中的显示位置。
步骤150,在确定该业务模型需要显示时,在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片。
按照上述方法绘制每个业务模型对应的用户界面图片之后,调用界面显示接口,在屏幕显示区域内展示所述用户界面的当前显示区域中包括的所述业务模型对应的用户界面图片。
在本公开的一些实施例中,屏幕显示区域可能小于用户界面,即用户界面需要分多屏显示,此时,需要首先确定当前需要显示的业务模型,并仅展示需要显示的业务模型。在展示需要显示的业务模型时,首先将该业务模型在用户界面中的显示位置与屏幕上的显示位置进行映射,之后在屏幕上的对应位置展示该业务模型对应的用户界面图片。
在本公开的一些实施例中,屏幕上显示的业务模型根据用户操作而变化,所述在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片的步骤之后,还包括:获取在所述用户界面上执行的滑动操作;根据所述滑动操作的方向和速度,确定需要显示的业务模型。例如,当用户界面包括多屏数据时,用户通过在所述用户界面上执行的滑动操作,以切换业务模型。则可以通过获取在所述用户界面上执行的滑动操作产生的触摸数据,并根据所述触摸数据计算得到所述滑动操作的方向和速度,进一步,根据确定的滑动操作的方向和速度,确定需要显示的业务模型。例如,用户在显示用户界面的屏幕上执行向上滑动操作时,将屏幕上方显示的业务模型对应的用户界面图片向上移除屏幕,将屏幕以外的业务模型对应的用户界面图片向上移入屏幕。进一步的,在确定一处需要移出或移入哪些业务模型对应的用户界面图片时,根据滑动操作的速度进一步确定。如果滑动操作的速度快,则固定时间内滑动的距离长,按照预设的滑动距离和屏幕长度的比值,或者按照预设的滑动距离和用户界面长度的比值,确定用户界面的移动距离,从而确定移出或移入的业务模型。
本公开实施例提供了一种用户界面展示方法,通过针对用户界面中的每一个业务模型,获取该业务模型的数据;通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息;在确定该业务模型需要显示时,根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片;确定该业务模型在用户界面中的显示位置;在确定该业务模型需要显示时,在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片,有助于改善现有技术中在展示用户界面时效率低下的问题。通过对用户界面中的每个业务模型分别进行数据获取、排版、用户界面图片绘制,并根据显示需要,对需要展示的业务模型的用户界面图片进行独立展示,避免了出现整体用户界面显示缓慢、以及用户界面需要整体刷新带来的展示效率低下的问题。
本公开实施例提供了一种用户界面展示方法,采用绘制控件的方式实现页面的构建,不依赖系统View System(视图系统),仅使用系统少量标准图形绘制接口绘制界面图片,最终由主线程展示界面图片。最终产出的用户界面图片是一张位图,视图层级、数量大幅降低,性能消耗属常数级。因此,本公开在展示用户界面的过程中,仅有极少的操作必须由主进程执行,减少主进程执行的操作,尤其适用于构建复杂用户界面,有助于提升界面绘制性能,降低系统界面绘制瓶颈。并且,由于仅使用系统少量标准图形绘制接口(如图2中的用户界面仅使用了图片绘制接口和文本绘制接口)绘制界面图片,并且,不同平台的标准图形绘制接口基本相同,有助于实现用户界面展示方法对不同平台的兼容性。
实施例二
基于实施例一,本公开优选实施例提供的一种用户界面展示方法,采用主线程、异步线程和任务队列相结合,完成用户界面的布局和渲染,通过异步执行排版任务、绘制任务,得到用户界面中各个业务模型的用户界面图片。任务队列作为线程之间的数据传输通道。如图3所示,用于用户界面绘制的异步线程至少包括:网络线程、异步排版线程、异步绘制线程,其中,所述网络线程、异步排版线程、异步绘制线程分别对应网络线程队列、排版任务队列和绘制任务队列。
下面,结合移动终端的客户端在检测到需要刷新展示用户界面后,进行用户界面展示的应用场景和图3详细说明用户界面展示的技术方案。如图3所示,本公开实施例提供的一种用户界面展示方法包括步骤310至步骤360。
步骤310,通过主线程构建每个业务模型的请求参数,并创建与每个业务模型对应的数据请求任务,然后,将数据请求任务放入网络线程队列中,由网络线程队列通过执行所述数据请求任务,向服务器获取用户界面中包括的各业务模型的数据。
步骤320所述网络线程通过网络线程队列获取数据请求任务,并依次执行各数据请求任务,并生成排版任务。在本公开的一些实施例中,所述数据请求任务根据携带的相应业务模型的请求参数,访问后台服务器,以获取该业务模型的数据。
获取到的用户界面中包括的业务模型的数据参见实施例一,本实施例不再赘述。
所述网络线程进一步根据业务模型数据生成排版任务,并将生成排版任务按照业务模型的展示顺序依次放入排版任务队列。所述排版任务携带各业务模型的数据。
步骤330,对于每个所述业务模型,在异步线程中对该业务模型的数据进行排版处理,确定该业务模型的界面绘制信息。
在本公开的一些实施例中,该业务模型的数据包括在所述用户界面内展示的该业务模型的控件的数据,所述按照所述用户界面的预设展示属性对所述控件进行排版处理,确定各所述控件的绘制参数的步骤,包括:在异步线程中按照所述用户界面的预设展示属性,对该业务模型的控件进行排版处理,确定各所述控件的绘制参数。进一步的,所述根据各所述控件的绘制参数,确定该业务模型的界面绘制信息的步骤,包括:在异步线程中根据该业务模型的控件的绘制参数,确定该业务模型的界面绘制信息。在本公开的一些实施例中,所述异步线程为异步排版线程。所述异步排版线程通过执行排版任务队列中的排版任务,对该业务模型的数据进行排版处理,确定该业务模型的界面绘制信息。
在本公开的一些实施例中,为了提升系统性能,可以过异步线程执行排版、图片绘制操作。例如,对于每个业务模型的数据,可以创建相应的异步排版线程,然后,每个异步排版线程分别对所述业务模型的数据执行排版操作。或者,创建一个异步排版线程,由此异步排版线程分别对各所述业务模型的数据执行排版操作。
在本公开的一些优选实施中,可以通过创建排版任务队列以及异步排版线程来实现业务模型的排版操作。例如,首先根据业务模型数据生成排版任务,并将生成排版任务按照业务模型的展示顺序依次放入排版任务队列。所述排版任务携带各业务模型的数据。然后,由异步排版线程依次从所述排版任务队列中取出排版任务,并执行所述排版任务。
具体排版处理的技术方案参见实施例一,本实施例不再赘述。在本公开的另一些实施例中,排版任务可以通过调用预设的排版引擎确定每个业务模型的界面绘制信息。
获取到的每个业务模型的界面绘制信息参见实施例一,本实施例不再赘述。
所有排版任务执行完相应业务模型的排版处理之后,异步排版线程通知主线程用户界面排版完成。
在本公开的一些实施中,所述获取对所述用户界面中的所述业务模型的移除操作的步骤,还包括:在主线程中获取对所述用户界面中的所述业务模型的移除操作;相应的,所述删除与所述移除操作针对的所述业务模型对应的数据的步骤,包括:若与所述移除操作针对的所述业务模型非正在进行排版处理的业务模型,在所述异步线程中删除与所述移除操作针对的所述业务模型对应的数据。
在用户界面加载或排版的过程中,用户可能会执行删除业务模型或切换用户界面的操作(即删除当前用户界面中全部业务模型的操作),为了提升界面展示效率,主线程将实时检测业务模型的移除操作,并在检测到业务模型的移除操作后,进一步确定所述移除操作移除的一个或多个业务模型。然后,主线程将业务模型的移除信息(例如,移除的业务模型的标识)发送至异步线程(如前述异步排版线程),由所述异步线程判断移除的所述业务模型是否正在进行排版处理,若没有(如已经排版完成或尚未开始排版),则删除移除的所述业务模型对应的数据。
步骤340,对于每个所述业务模型,主线程根据该业务模型的界面绘制信息,创建绘制任务,并将所述绘制任务依次放入绘制任务队列。
之后,主线程按照各业务模型在所述用户界面中的显示区域的显示先后顺序,根据相应所述业务模型的界面绘制信息,分别创建绘制任务,并将绘制任务依次放入绘制任务队列。
步骤350,在异步线程中通过所述绘制任务队列依次获取绘制任务,并执行绘制操作。在本公开的一些实施例中,所述根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片的步骤,包括:在异步线程中根据该业务模型的所述界面绘制信息绘制该业务模型对应的用户界面图片。在本公开的一些实施例中,可以通过创建异步绘制线程通过执行绘制任务队列中的绘制任务,绘制相应业务模型对应的用户界面图片。
在本公开的一些实施例中,所述在异步线程中根据该业务模型的所述界面绘制信息绘制该业务模型对应的用户界面图片,包括:依次获取预先创建的绘制任务队列中存储的绘制任务,其中,所述绘制任务包括需要绘制的业务模型对应的界面绘制信息;通过异步绘制线程分别执行所述绘制任务,所述绘制任务被执行时根据所述界面绘制信息绘制相应业务模型对应的用户界面图片。
所述界面绘制信息是根据相应业务模型对应的用户界面中的控件的绘制参数生成的,所述绘制任务被执行时根据所述界面绘制信息绘制相应业务模型对应的用户界面图片包括:所述绘制任务基于所述界面绘制信息中各所述控件的绘制参数,调用相应绘制接口,绘制相应业务模型对应的用户界面图片。例如,调用图片绘制接口在用户界面图片的指定位置绘制店铺图片、调用文本绘制接口在用户界面图片的指定位置绘制店铺名称等,最终绘制得到各业务模型对应的用户界面图片。
步骤360,主线程执行用户界面展示。
用户界面包括的所有业务模型的用户界面图片绘制完成之后,异步线程,如异步绘制线程通知主线程用户界面绘制完成。主线程根据当前屏幕区域需要展示的业务模型,将需要展示业务模型的用户界面图片,在相应的屏幕位置,按照显示的先后顺序进行展示。
在移动终端运行过程中,用户会操作移动终端,导致用户界面需要更新。进一步的,用户界面展示完成之后,主线程通过定期检测用户界面更新操作或通过事件监控等方式获取用户界面更新操作。例如,当用户由上向下拖动移动终端的商户列表时,图2所示的用户界面的最下方业务模型230将移除屏幕显示区域,因此,需要更新显示用户界面。
在本公开的另一些实施例中,如图4所示,在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片的步骤之后,还包括:
步骤370,根据在所述用户界面上执行的滑动操作的方向和速度,更新所述绘制任务队列中的绘制任务。
主线程获取在所述用户界面上执行的滑动操作,并根据用户滑动的方向和速度,提前计算出接下来屏幕需要展示的区域用户界面中包括的业务模型,将该区域包括的业务模型对应的绘制任务加入绘制任务队列。同时,主线程确定即将消失在屏幕展示区域的业务模型,并将还区域内的业务模型对应的绘制任务移出所述绘制任务队列,终止其绘制操作。
通过根据用户操作对绘制任务执行入队和出队操作,控制绘制任务队列中的绘制任务在可控数量范围内,避免用户快速拖动用户界面时绘制任务队列中任务过多导致绘制不及时的问题发生。
本公开实施例提供了一种用户界面展示方法,通过将现有技术中在主线程中执行的用户界面的布局和渲染操作拆分成不同的任务,并由异步线程执行各任务,实现了整个界面绘制过程的完全异步化,解决了现有技术中其他方案在构建复杂页面时仍然存在的性能瓶颈。
实施例三
本公开实施例提供了一种用户界面展示装置,如图5所示,所述装置包括:
业务模型数据获取模块510,用于针对用户界面中的每一个业务模型,获取该业务模型的数据;
界面绘制信息确定模块520,用于通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息;
用户界面图片绘制模块530,用于在确定该业务模型需要显示时,根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片;
显示位置确定模块540,用于确定该业务模型在用户界面中的显示位置;
用户界面图片展示模块550,用于在确定该业务模型需要显示时,在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片。
在本公开的一些实施例中,该业务模型的数据包括在所述用户界面内展示的该业务模型的控件的数据,所述界面绘制信息确定模块520进一步用于:
按照所述用户界面的预设展示属性对所述控件进行排版处理,确定各所述控件的绘制参数;
根据各所述控件的绘制参数,确定该业务模型的界面绘制信息;
其中,所述绘制参数至少包括以下任意一项:布局信息、层级信息、渲染信息。
在本公开的一些实施例中,所述按照所述用户界面的预设展示属性对所述控件进行排版处理,确定各所述控件的绘制参数的步骤,包括:
在异步线程中按照所述用户界面的预设展示属性,对该业务模型的控件进行排版处理,确定各所述控件的绘制参数;
所述根据各所述控件的绘制参数,确定该业务模型的界面绘制信息的步骤,包括:
在异步线程中根据该业务模型的控件的绘制参数,确定该业务模型的界面绘制信息。
在本公开的一些实施例中,如图6所示,所述装置还包括:
移除操作获取模块560,用于获取对所述用户界面中的所述业务模型的移除操作;
模型数据删除模块570,用于删除与所述移除操作针对的所述业务模型对应的数据。
在本公开的一些实施例中,所述获取对所述用户界面中的所述业务模型的移除操作的步骤,还包括:
在主线程中获取对所述用户界面中的所述业务模型的移除操作;
所述删除与所述移除操作针对的所述业务模型对应的数据的步骤,包括:
若与所述移除操作针对的所述业务模型非正在进行排版处理的业务模型,在所述异步线程中删除与所述移除操作针对的所述业务模型对应的数据。
在本公开的一些实施例中,所述用户界面图片绘制模块530进一步用于:
在异步线程中根据该业务模型的所述界面绘制信息绘制该业务模型对应的用户界面图片。
在本公开的一些实施例中,如图6所示,所述在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片之后,所述装置还包括:
滑动操作获取模块580,用于获取在所述用户界面上执行的滑动操作;
待显示模型确定模块590,用于根据所述滑动操作的方向和速度,确定需要显示的业务模型。
在本公开的一些实施例中,所述用户界面图片绘制模块530进一步用于:
根据该业务模型对应的界面绘制信息,调用系统的绘制接口绘制该业务模型对应的用户界面图片。
本公开实施例提供的用户界面展示装置,用于实现本公开实施例一和实施例二中所述的用户界面展示方法的各步骤,装置的各模块的具体实施方式参见相应步骤,此处不再赘述。
本公开实施例提供了一种用户界面展示装置,通过针对用户界面中的每一个业务模型,获取该业务模型的数据;通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息;在确定该业务模型需要显示时,根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片;确定该业务模型在用户界面中的显示位置;在确定该业务模型需要显示时,在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片,有助于改善现有技术中在展示用户界面时效率低下的问题。通过对用户界面中的每个业务模型分别进行数据获取、排版、用户界面图片绘制,并根据显示需要,对需要展示的业务模型的用户界面图片进行独立展示,避免了出现整体用户界面显示缓慢、以及用户界面需要整体刷新带来的展示效率低下的问题。
本公开实施例提供了一种用户界面展示装置,采用绘制控件的方式实现页面的构建,不依赖系统View System(视图系统),仅使用系统少量标准图形绘制接口绘制界面图片,最终由主线程展示界面图片。最终产出的用户界面图片是一张位图,视图层级、数量大幅降低,性能消耗属常数级。因此,本公开在展示用户界面的过程中,仅有极少的操作必须由主进程执行,减少主进程执行的操作,尤其适用于构建复杂用户界面,有助于提升界面绘制性能,降低系统界面绘制瓶颈。并且,由于仅使用系统少量标准图形绘制接口(如图2中的用户界面仅使用了图片绘制接口和文本绘制接口)绘制界面图片,并且,不同平台的标准图形绘制接口基本相同,有助于实现用户界面展示方法对不同平台的兼容性。
本公开实施例提供了一种用户界面展示装置,通过将现有技术中在主线程中执行的用户界面的布局和渲染操作拆分成不同的任务,并由异步线程执行各任务,实现了整个界面绘制过程的完全异步化,解决了现有技术中其他方案在构建复杂页面时仍然存在的性能瓶颈。
进一步的,通过根据用户操作对绘制任务执行入队和出队操作,控制绘制任务队列中的绘制任务在可控数量范围内,避免用户快速拖动用户界面时绘制任务队列中任务过多导致绘制不及时的问题发生。
相应的,本公开还提供了一种电子设备,包括存储器、处理器及存储在所述存储器上并可在处理器上运行的计算机程序,所述处理器执行所述计算机程序时实现如本公开实施例一和实施例二所述的用户界面展示方法。所述电子设备可以为PC机、移动终端、个人数字助理、平板电脑等。
本公开还提供了一种计算机可读存储介质,其上存储有计算机程序,该程序被处理器执行时实现如本公开实施例一和实施例二所述的用户界面展示方法的步骤。
本说明书中的各个实施例均采用递进的方式描述,每个实施例重点说明的都是与其他实施例的不同之处,各个实施例之间相同相似的部分互相参见即可。对于装置实施例而言,由于其与方法实施例基本相似,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
以上对本公开提供的一种用户界面展示方法及装置进行了详细介绍,本文中应用了具体个例对本公开的原理及实施方式进行了阐述,以上实施例的说明只是用于帮助理解本公开的方法及其核心思想;同时,对于本领域的一般技术人员,依据本公开的思想,在具体实施方式及应用范围上均会有改变之处,综上所述,本说明书内容不应理解为对本公开的限制。
通过以上的实施方式的描述,本领域的技术人员可以清楚地了解到各实施方式可借助软件加必需的通用硬件平台的方式来实现,当然也可以通过硬件实现。基于这样的理解,上述技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来,该计算机软件产品可以存储在计算机可读存储介质中,如ROM/RAM、磁碟、光盘等,包括若干指令用以使得一台计算机设备(可以是个人计算机,服务器,或者网络设备等)执行各个实施例或者实施例的某些部分所述的方法。

Claims (18)

1.一种用户界面展示方法,其特征在于,包括:
针对用户界面中的每一个业务模型,获取该业务模型的数据;
通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息;
在确定该业务模型需要显示时,根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片;
确定该业务模型在用户界面中的显示位置;
在确定该业务模型需要显示时,在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片。
2.根据权利要求1所述的方法,其特征在于,该业务模型的数据包括在所述用户界面内展示的该业务模型的控件的数据,所述通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息的步骤,包括:
按照所述用户界面的预设展示属性对所述控件进行排版处理,确定各所述控件的绘制参数;
根据各所述控件的绘制参数,确定该业务模型的界面绘制信息;
其中,所述绘制参数至少包括以下任意一项:布局信息、层级信息、渲染信息。
3.根据权利要求2所述的方法,其特征在于,所述按照所述用户界面的预设展示属性对所述控件进行排版处理,确定各所述控件的绘制参数的步骤,包括:
在异步线程中按照所述用户界面的预设展示属性,对该业务模型的控件进行排版处理,确定各所述控件的绘制参数;
所述根据各所述控件的绘制参数,确定该业务模型的界面绘制信息的步骤,包括:
在异步线程中根据该业务模型的控件的绘制参数,确定该业务模型的界面绘制信息。
4.根据权利要求1所述的方法,其特征在于,所述针对用户界面中的每一个业务模型,获取该业务模型的数据的步骤之后,还包括:
获取对所述用户界面中的所述业务模型的移除操作;
删除与所述移除操作针对的所述业务模型对应的数据。
5.根据权利要求4所述的方法,其特征在于,所述获取对所述用户界面中的所述业务模型的移除操作的步骤,还包括:
在主线程中获取对所述用户界面中的所述业务模型的移除操作;
所述删除与所述移除操作针对的所述业务模型对应的数据的步骤,包括:
若与所述移除操作针对的所述业务模型非正在进行排版处理的业务模型,在所述异步线程中删除与所述移除操作针对的所述业务模型对应的数据。
6.根据权利要求1所述的方法,其特征在于,所述根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片的步骤,包括:
在异步线程中根据该业务模型的所述界面绘制信息绘制该业务模型对应的用户界面图片。
7.根据权利要求1所述的方法,其特征在于,所述在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片的步骤之后,还包括:
获取在所述用户界面上执行的滑动操作;
根据所述滑动操作的方向和速度,确定需要显示的业务模型。
8.根据权利要求1至7任一项所述的方法,其特征在于,所述根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片的步骤,包括:
根据该业务模型对应的界面绘制信息,调用系统的绘制接口绘制该业务模型对应的用户界面图片。
9.一种用户界面展示装置,其特征在于,包括:
业务模型数据获取模块,用于针对用户界面中的每一个业务模型,获取该业务模型的数据;
界面绘制信息确定模块,用于通过对该业务模型的数据进行排版处理,确定该业务模型对应的界面绘制信息;
用户界面图片绘制模块,用于在确定该业务模型需要显示时,根据该业务模型对应的界面绘制信息绘制该业务模型对应的用户界面图片;
显示位置确定模块,用于确定该业务模型在用户界面中的显示位置;
用户界面图片展示模块,用于在确定该业务模型需要显示时,在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片。
10.根据权利要求9所述的装置,其特征在于,该业务模型的数据包括在所述用户界面内展示的该业务模型的控件的数据,所述界面绘制信息确定模块进一步用于:
按照所述用户界面的预设展示属性对所述控件进行排版处理,确定各所述控件的绘制参数;
根据各所述控件的绘制参数,确定该业务模型的界面绘制信息;
其中,所述绘制参数至少包括以下任意一项:布局信息、层级信息、渲染信息。
11.根据权利要求10所述的装置,其特征在于,所述按照所述用户界面的预设展示属性对所述控件进行排版处理,确定各所述控件的绘制参数的步骤,包括:
在异步线程中按照所述用户界面的预设展示属性,对该业务模型的控件进行排版处理,确定各所述控件的绘制参数;
所述根据各所述控件的绘制参数,确定该业务模型的界面绘制信息的步骤,包括:
在异步线程中根据该业务模型的控件的绘制参数,确定该业务模型的界面绘制信息。
12.根据权利要求9所述的装置,其特征在于,还包括:
移除操作获取模块,用于获取对所述用户界面中的所述业务模型的移除操作;
模型数据删除模块,用于删除与所述移除操作针对的所述业务模型对应的数据。
13.根据权利要求12所述的装置,其特征在于,所述获取对所述用户界面中的所述业务模型的移除操作的步骤,还包括:
在主线程中获取对所述用户界面中的所述业务模型的移除操作;
所述删除与所述移除操作针对的所述业务模型对应的数据的步骤,包括:
若与所述移除操作针对的所述业务模型非正在进行排版处理的业务模型,在所述异步线程中删除与所述移除操作针对的所述业务模型对应的数据。
14.根据权利要求9所述的装置,其特征在于,所述用户界面图片绘制模块进一步用于:
在异步线程中根据该业务模型的所述界面绘制信息绘制该业务模型对应的用户界面图片。
15.根据权利要求9所述的装置,其特征在于,所述在所确定的显示位置在屏幕中对应的位置展示该业务模型对应的用户界面图片之后,所述装置还包括:
滑动操作获取模块,用于获取在所述用户界面上执行的滑动操作;
待显示模型确定模块,用于根据所述滑动操作的方向和速度,确定需要显示的业务模型。
16.根据权利要求9至15任一项所述的装置,其特征在于,所述用户界面图片绘制模块进一步用于:
根据该业务模型对应的界面绘制信息,调用系统的绘制接口绘制该业务模型对应的用户界面图片。
17.一种电子设备,包括存储器、处理器及存储在所述存储器上并可在处理器上运行的计算机程序,其特征在于,所述处理器执行所述计算机程序时实现权利要求1至8任意一项所述的用户界面展示方法。
18.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,该程序被处理器执行时实现权利要求1至8任意一项所述的用户界面展示方法的步骤。
CN201811436584.1A 2018-11-28 2018-11-28 一种用户界面展示方法、装置、电子设备及存储介质 Active CN109800039B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201811436584.1A CN109800039B (zh) 2018-11-28 2018-11-28 一种用户界面展示方法、装置、电子设备及存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201811436584.1A CN109800039B (zh) 2018-11-28 2018-11-28 一种用户界面展示方法、装置、电子设备及存储介质

Publications (2)

Publication Number Publication Date
CN109800039A true CN109800039A (zh) 2019-05-24
CN109800039B CN109800039B (zh) 2020-01-24

Family

ID=66556308

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201811436584.1A Active CN109800039B (zh) 2018-11-28 2018-11-28 一种用户界面展示方法、装置、电子设备及存储介质

Country Status (1)

Country Link
CN (1) CN109800039B (zh)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110764838A (zh) * 2019-09-19 2020-02-07 北京三快在线科技有限公司 服务模型的加载方法、系统、电子设备及存储介质
CN113138763A (zh) * 2021-04-14 2021-07-20 招商银行股份有限公司 页面搭建方法、装置、设备及计算机可读存储介质

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20140181701A1 (en) * 2012-12-20 2014-06-26 Sap Ag Model-Based User Interface
EP2963543A1 (en) * 2014-06-30 2016-01-06 Sap Se User interface generation using a model layer
CN108171610A (zh) * 2017-12-28 2018-06-15 中国平安人寿保险股份有限公司 页面生成方法、页面生成设备、存储介质及装置
CN108733371A (zh) * 2018-05-16 2018-11-02 北京奇艺世纪科技有限公司 一种界面生成方法、装置及设备
CN108829485A (zh) * 2018-06-25 2018-11-16 腾讯科技(深圳)有限公司 应用界面布局的更新方法、装置、存储介质及计算机设备
CN108846087A (zh) * 2018-06-12 2018-11-20 恒生电子股份有限公司 一种页面渲染方法、装置、终端及服务器

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20140181701A1 (en) * 2012-12-20 2014-06-26 Sap Ag Model-Based User Interface
EP2963543A1 (en) * 2014-06-30 2016-01-06 Sap Se User interface generation using a model layer
CN108171610A (zh) * 2017-12-28 2018-06-15 中国平安人寿保险股份有限公司 页面生成方法、页面生成设备、存储介质及装置
CN108733371A (zh) * 2018-05-16 2018-11-02 北京奇艺世纪科技有限公司 一种界面生成方法、装置及设备
CN108846087A (zh) * 2018-06-12 2018-11-20 恒生电子股份有限公司 一种页面渲染方法、装置、终端及服务器
CN108829485A (zh) * 2018-06-25 2018-11-16 腾讯科技(深圳)有限公司 应用界面布局的更新方法、装置、存储介质及计算机设备

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110764838A (zh) * 2019-09-19 2020-02-07 北京三快在线科技有限公司 服务模型的加载方法、系统、电子设备及存储介质
CN113138763A (zh) * 2021-04-14 2021-07-20 招商银行股份有限公司 页面搭建方法、装置、设备及计算机可读存储介质

Also Published As

Publication number Publication date
CN109800039B (zh) 2020-01-24

Similar Documents

Publication Publication Date Title
CN110096277B (zh) 一种动态页面展示方法、装置、电子设备及存储介质
US10157593B2 (en) Cross-platform rendering engine
CN110221889B (zh) 一种页面展示方法、装置、电子设备及存储介质
CN104216691B (zh) 一种创建应用的方法及装置
US9436385B2 (en) Invocation control over keyboard user interface
US20140019892A1 (en) Systems and Methods for Generating Application User Interface with Practically Boundless Canvas and Zoom Capabilities
JP2020517039A (ja) オーバーレイコンテンツとのページの相互作用機能の維持
US9836187B2 (en) Semantic card view
US20140325418A1 (en) Automatically manipulating visualized data based on interactivity
JPH08512412A (ja) ディスプレイ・コンポジティング・システム
KR20060052717A (ko) 가상 데스크 탑, 프로그램 예의 배열을 리콜링하는 방법, 애플리케이션 예를 관리하는 방법 및 애플리케이션을 관리하는 방법
KR20140030160A (ko) 터치 가능 명령 실행을 위한 콤팩트 제어 메뉴
KR102702653B1 (ko) 실시간 협업을 위한 라이브 잉크 프레즌스
US10643580B2 (en) Method and device for switching playing mode of a mobile terminal, storage medium and program
US20170249770A1 (en) Information processing apparatus, moving image reproduction method, and computer readable medium
US20150370439A1 (en) Gpu-optimized scrolling systems and methods
EP3008620B1 (en) Tethered selection handle
CN110704769A (zh) 流程图生成方法、装置、设备及计算机存储介质
CN109800039A (zh) 一种用户界面展示方法、装置、电子设备及存储介质
US20060098029A1 (en) System, method and program to generate a blinking image
JP5899364B1 (ja) プレイヤの意図を予測してレンダリングするためのリソース配分を決定するプログラム、電子装置、システム及び方法
CN107615229B (zh) 用户界面装置和用户界面装置的画面显示方法
JP2014002678A (ja) オブジェクト表示方法、プログラム、及び装置
KR20140077115A (ko) 3d 에서의 객체 그룹들의 정의
CN116521043B (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