在界面中显示组件的方法及装置制造方法及图纸

技术编号:13986067 阅读:59 留言:0更新日期:2016-11-13 02:08
本发明专利技术公开了一种在界面中显示组件的方法及装置。其中,组件的组件子项的总数量大于组件中处于显示区域内的组件子项的数量。该方法包括:在界面上的组件被移动之前,对组件中,处于显示区域之外的组件子项,进行界面元素的预加载,在界面上的组件被移动时,对从显示区域之外进入显示区域的组件子项,进行界面元素的渲染,从而减少了组件子项进入显示区域时对界面元素加载的等待,提升了界面响应速度。

【技术实现步骤摘要】

本专利技术涉及界面显示领域,具体地,涉及一种在界面中显示组件的方法及装置
技术介绍
组件,是对数据和方法的封装。通常,终端应用中都会在界面中使用一些组件。界面中常用的组件例如列表组件等。这些组件通常在进入显示区域时,进行界面元素的加载,在加载完成后,进行渲染。但是,在界面元素的数据量较大时,会出现显示卡顿的现象,用户体验较差。
技术实现思路
有鉴于此,本专利技术的目的是提供一种在界面中显示组件的方法及装置,以实现提升界面响应速度的目的。本专利技术实施例的一个方面中,提供了一种在界面中显示组件的方法。其中,所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量。该方法包括:在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载;在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染。可选地,所述在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载包括:在界面上的所述组件被移动之前,根据用户的操作,预测所述组件的移动方向;根据预测的移动方向,确定即将进入显示区域的组件子项;对所述即将进入显示区域的组件子项进行界面元素的预加载。可选地,所述在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载由后台线程异步执行。可选地,所述方法还包括:对所述组件,进行预设类型资源的懒加载。可选地,所述方法还包括:根据用户对预留组件子项数量的设置,在所述组件中,设置相应数量的、处于显示区域外的组件子项。可选地,所述组件为列表组件,所述组件子项为所述列表组件的列表项。本专利技术实施例的另一个方面中,提供了一种在界面中显示组件的装置。其中,所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量。该装置包括:预加载模块,被配置为在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载。渲染模块,被配置为在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染。可选地,所述预加载模块包括:预测子模块,被配置为在界面上的所述组件被移动之前,根据用户的操作,预测所述组件的移动方向。组件确定子模块,被配置为根据预测的移动方向,确定即将进入显示区域的组件子项。预加载子模块,被配置为对所述即将进入显示区域的组件子项进行界面元素的预加载。可选地,所述装置还包括:懒加载模块,被配置为对所述组件,进行预设类型资源的懒加载。可选地,所述装置还包括:预留设置模块,被配置为根据用户对预留组件子项数量的设置,在所述组件中,设置相应数量的、处于显示区域外的组件子项。可选地,所述组件为列表组件,所述组件子项为所述列表组件的列表项。通过上述技术方案,由于本专利技术实施例所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量,在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载,在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染,从而减少了组件子项进入显示区域时对界面元素加载的等待,提升了界面响应速度。本专利技术的其他特征和优点将在随后的具体实施方式部分予以详细说明。附图说明附图是用来提供对本专利技术的进一步理解,并且构成说明书的一部分,与下面的具体实施方式一起用于解释本专利技术,但并不构成对本专利技术的限制。在附图中:图1是根据一示例性实施例示出的实施环境示意图。图2是根据本专利技术一示例性实施例示出的在界面中显示组件的方法的流程图。图3是根据本专利技术另一示例性实施例示出的在界面中显示组件的方法的流程图。图4是根据本专利技术一示例性实施例示出的在界面中显示组件的装置的框图。图5是根据本专利技术另一示例性实施例示出的在界面中显示组件的装置的框图。具体实施方式以下结合附图对本专利技术的具体实施方式进行详细说明。应当理解的是,此处所描述的具体实施方式仅用于说明和解释本专利技术,并不用于限制本专利技术。图1是根据一示例性实施例示出的实施环境示意图。如图1所示,该实施环境可以包括:移动设备110。移动设备110可以是手机、平板电脑等移动设备。在图1中,移动设备110以手机为例来示意。一种应用场景中,移动设备110上运行有界面中包括列表组件120的应用。其中,该列表组件120包括处于显示区域内的列表项01~08、以及预留的一些列表项a1、a2、a3、b1、b2、b3。该列表组件120的列表项的总数量大于该列表组件120中处于显示区域内的列表项的数量。在图1中,预留的列表项a1、a2、a3、b1、b2、b3以虚线绘制,以表示这些列表项处于显示区域之外,并未在界面显示。图2是根据本专利技术一示例性实施例示出的在界面中显示组件的方法的流程图。其中,所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量。例如,该方法可以应用于图1所示的移动设备110。如图2所示,该方法可以包括:在步骤210中,在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载。其中,所述组件可以为Google直接发布的原生组件,也就是没有经过运营商,或者手机制造商处理过的系统提供的组件。例如,本专利技术实施例所述组件可以为原生列表组件,根据本专利技术实施例提供的方法,可以对原生列表组件进行列表项的扩展,从而可以使列表组件预留出一部分处于显示区域之外的列表项。一种可能的实施方式中,可以在界面上的所述组件被移动之前,根据用户的操作,预测所述组件的移动方向,根据预测的移动方向,确定即将进入显示区域的组件子项,对所述即将进入显示区域的组件子项进行界面元素的预加载。结合图1所示实施环境,假设移动设备110为触摸屏手机,则可以分析用户手势操作以及加速度确定出即将进入显示区域的列表项。假设用户之前向下翻动列表组件120,则可以确定即将进入显示区域的列表项为列表项a3。通过该实施方式,可以根据用户实际使用,对进行预加载的组件子项进行准确判断,避免大量额外组件子项被执行界面元素的预加载,节省存储空间。其中,进行界面元素的预加载可以由后台线程异步执行。所述界面元素例如可以包括:文本、图标等等。在步骤220中,在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染。一种可能的实施方式中,还可以对所述组件进行预设类型资源的懒加载,从而进一步提高界面响应速度。例如,可以对所述组件进行图片资源的懒加载。例如,如果在组件子项进入显示区域时,需要展示的图片还未加载完成,则可以先加载较容易加载的、预置默认图片进行显示,待需要展示的图片加载完成,再以需要展示的图片替代预置默认图片进行显示。一种可能的实施方式中,还可以根据用户对预留组件子项数量的设置,在所述组件中,设置相应数量的、处于显示区域外的组件子项。例如,如图1所示,原生列表组件原始包括处于显示区域内的八个子项,则通过该设置,可以预留出处于显示区域外的六个子项。通过该实施方式,可以更加灵活地根据实际需要来优化组件的性能。可见,通过本专利技术实施例,减少了组件子项进入显示区域时对界面元素加载的等待,提升了界面响应速度。尤其本文档来自技高网...

【技术保护点】
一种在界面中显示组件的方法,其特征在于,所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量,所述方法包括:在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载;在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染。

【技术特征摘要】
1.一种在界面中显示组件的方法,其特征在于,所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量,所述方法包括:在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载;在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染。2.根据权利要求1所述的方法,其特征在于,所述在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载包括:在界面上的所述组件被移动之前,根据用户的操作,预测所述组件的移动方向;根据预测的移动方向,确定即将进入显示区域的组件子项;对所述即将进入显示区域的组件子项进行界面元素的预加载。3.根据权利要求1所述的方法,其特征在于,所述在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载由后台线程异步执行。4.根据权利要求1所述的方法,其特征在于,所述方法还包括:对所述组件,进行预设类型资源的懒加载。5.根据权利要求1所述的方法,其特征在于,所述方法还包括:根据用户对预留组件子项数量的设置,在所述组件中,设置相应数量的、处于显示区域外的组件子项。6.根据...

【专利技术属性】
技术研发人员:徐旺
申请(专利权)人:东软集团股份有限公司
类型:发明
国别省市:辽宁;21

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1