CN106095461A - 在界面中显示组件的方法及装置 - Google Patents
在界面中显示组件的方法及装置 Download PDFInfo
- Publication number
- CN106095461A CN106095461A CN201610457963.3A CN201610457963A CN106095461A CN 106095461 A CN106095461 A CN 106095461A CN 201610457963 A CN201610457963 A CN 201610457963A CN 106095461 A CN106095461 A CN 106095461A
- Authority
- CN
- China
- Prior art keywords
- assembly
- subitem
- viewing area
- interface
- described assembly
- 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.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
- Telephone Function (AREA)
Abstract
本发明公开了一种在界面中显示组件的方法及装置。其中,组件的组件子项的总数量大于组件中处于显示区域内的组件子项的数量。该方法包括:在界面上的组件被移动之前,对组件中,处于显示区域之外的组件子项,进行界面元素的预加载,在界面上的组件被移动时,对从显示区域之外进入显示区域的组件子项,进行界面元素的渲染,从而减少了组件子项进入显示区域时对界面元素加载的等待,提升了界面响应速度。
Description
技术领域
本发明涉及界面显示领域,具体地,涉及一种在界面中显示组件的方法及装置。
背景技术
组件,是对数据和方法的封装。
通常,终端应用中都会在界面中使用一些组件。界面中常用的组件例如列表组件等。这些组件通常在进入显示区域时,进行界面元素的加载,在加载完成后,进行渲染。但是,在界面元素的数据量较大时,会出现显示卡顿的现象,用户体验较差。
发明内容
有鉴于此,本发明的目的是提供一种在界面中显示组件的方法及装置,以实现提升界面响应速度的目的。
本发明实施例的一个方面中,提供了一种在界面中显示组件的方法。其中,所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量。该方法包括:在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载;在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染。
可选地,所述在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载包括:在界面上的所述组件被移动之前,根据用户的操作,预测所述组件的移动方向;根据预测的移动方向,确定即将进入显示区域的组件子项;对所述即将进入显示区域的组件子项进行界面元素的预加载。
可选地,所述在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载由后台线程异步执行。
可选地,所述方法还包括:对所述组件,进行预设类型资源的懒加载。
可选地,所述方法还包括:根据用户对预留组件子项数量的设置,在所述组件中,设置相应数量的、处于显示区域外的组件子项。
可选地,所述组件为列表组件,所述组件子项为所述列表组件的列表项。
本发明实施例的另一个方面中,提供了一种在界面中显示组件的装置。其中,所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量。该装置包括:预加载模块,被配置为在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载。渲染模块,被配置为在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染。
可选地,所述预加载模块包括:预测子模块,被配置为在界面上的所述组件被移动之前,根据用户的操作,预测所述组件的移动方向。组件确定子模块,被配置为根据预测的移动方向,确定即将进入显示区域的组件子项。预加载子模块,被配置为对所述即将进入显示区域的组件子项进行界面元素的预加载。
可选地,所述装置还包括:懒加载模块,被配置为对所述组件,进行预设类型资源的懒加载。
可选地,所述装置还包括:预留设置模块,被配置为根据用户对预留组件子项数量的设置,在所述组件中,设置相应数量的、处于显示区域外的组件子项。
可选地,所述组件为列表组件,所述组件子项为所述列表组件的列表项。
通过上述技术方案,由于本发明实施例所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量,在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载,在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染,从而减少了组件子项进入显示区域时对界面元素加载的等待,提升了界面响应速度。
本发明的其他特征和优点将在随后的具体实施方式部分予以详细说明。
附图说明
附图是用来提供对本发明的进一步理解,并且构成说明书的一部分,与下面的具体实施方式一起用于解释本发明,但并不构成对本发明的限制。在附图中:
图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所示,原生列表组件原始包括处于显示区域内的八个子项,则通过该设置,可以预留出处于显示区域外的六个子项。通过该实施方式,可以更加灵活地根据实际需要来优化组件的性能。
可见,通过本发明实施例,减少了组件子项进入显示区域时对界面元素加载的等待,提升了界面响应速度。尤其对于资源比较紧张的移动终端来说,应用本发明实施例提供的方法可以提高移动终端界面响应速度,提高用户体验。
下面,结合上述各实施例,对本发明一种可能的实施方式进行详细介绍。
图3是根据本发明另一示例性实施例示出的在界面中显示组件的方法的流程图。其中,所述组件为列表组件,所述组件子项为所述列表组件的列表项。所述列表组件的列表项的总数量大于所述组件中处于显示区域内的列表项的数量。例如,该方法可以应用于图1所示的移动设备110。如图3所示,该方法可以包括:
在步骤300中,根据用户对预留列表项数量的设置,在列表组件中,设置相应数量的、处于显示区域外的列表项。
在步骤310中,在界面上的列表组件被移动之前,根据用户的操作,预测列表组件的移动方向。
在步骤311中,根据预测的移动方向,确定即将进入显示区域的列表项。
在步骤312中,对即将进入显示区域的列表项进行界面元素的预加载。
例如,由于列表组件中各个列表项中具有共同的一些界面元素,已经显示的一些列表项已经将这些共同的界面元素放入了缓存,因此,可以从缓存中读取出这些共同的界面元素预加载到即将进入显示区域的列表项。
在步骤313中,在界面上的列表组件被移动时,进行图片资源的懒加载。
在步骤320中,在界面上的列表组件被移动时,对从显示区域之外进入显示区域的列表项,进行界面元素的渲染。
可见,通过本发明实施例,减少了列表项进入显示区域时对界面元素加载的等待,提升了界面响应速度。
图4是根据本发明一示例性实施例示出的在界面中显示组件的装置400的框图。其中,所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量。例如,该装置可以配置于图1所示的移动设备110。如图4所示,该装置可以包括:预加载模块410、渲染模块420。
该预加载模块410,可以被配置为在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载。
该渲染模块420,可以被配置为在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染。
可见,通过本发明实施例,减少了组件子项进入显示区域时对界面元素加载的等待,提升了界面响应速度。
图5是根据本发明另一示例性实施例示出的在界面中显示组件的装置400的框图。该装置中,所述预加载模块410可以包括:预测子模块411、组件确定子模块412、预加载子模块413。
该预测子模块411,可以被配置为在界面上的所述组件被移动之前,根据用户的操作,预测所述组件的移动方向。
该组件确定子模块412,可以被配置为根据预测的移动方向,确定即将进入显示区域的组件子项。
该预加载子模块413,可以被配置为对所述即将进入显示区域的组件子项进行界面元素的预加载。
通过该实施方式,可以根据用户实际使用,对进行预加载的组件子项进行准确判断,避免大量额外组件子项被执行界面元素的预加载,节省存储空间。
一种可能的实施方式中,如图5所示,该装置还可以包括:懒加载模块430,可以被配置为对所述组件,进行预设类型资源的懒加载,从而进一步提高界面响应速度。
另一种可能的实施方式中,如图5所示,该装置还可以包括:预留设置模块440,可以被配置为根据用户对预留组件子项数量的设置,在所述组件中,设置相应数量的、处于显示区域外的组件子项。通过该实施方式,可以更加灵活地根据实际需要来优化组件的性能。
以上结合附图详细描述了本发明的优选实施方式,但是,本发明并不限于上述实施方式中的具体细节,在本发明的技术构思范围内,可以对本发明的技术方案进行多种简单变型,这些简单变型均属于本发明的保护范围。
另外需要说明的是,在上述具体实施方式中所描述的各个具体技术特征,在不矛盾的情况下,可以通过任何合适的方式进行组合。为了避免不必要的重复,本发明对各种可能的组合方式不再另行说明。
此外,本发明的各种不同的实施方式之间也可以进行任意组合,只要其不违背本发明的思想,其同样应当视为本发明所公开的内容。
Claims (10)
1.一种在界面中显示组件的方法,其特征在于,所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量,所述方法包括:
在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载;
在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染。
2.根据权利要求1所述的方法,其特征在于,所述在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载包括:
在界面上的所述组件被移动之前,根据用户的操作,预测所述组件的移动方向;
根据预测的移动方向,确定即将进入显示区域的组件子项;
对所述即将进入显示区域的组件子项进行界面元素的预加载。
3.根据权利要求1所述的方法,其特征在于,所述在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载由后台线程异步执行。
4.根据权利要求1所述的方法,其特征在于,所述方法还包括:
对所述组件,进行预设类型资源的懒加载。
5.根据权利要求1所述的方法,其特征在于,所述方法还包括:
根据用户对预留组件子项数量的设置,在所述组件中,设置相应数量的、处于显示区域外的组件子项。
6.根据权利要求1-5任一项所述的方法,其特征在于,所述组件为列表组件,所述组件子项为所述列表组件的列表项。
7.一种在界面中显示组件的装置,其特征在于,所述组件的组件子项的总数量大于所述组件中处于显示区域内的组件子项的数量,所述装置包括:
预加载模块,被配置为在界面上的所述组件被移动之前,对所述组件中,处于显示区域之外的组件子项,进行界面元素的预加载;
渲染模块,被配置为在界面上的所述组件被移动时,对从显示区域之外进入显示区域的所述组件子项,进行界面元素的渲染。
8.根据权利要求7所述的装置,其特征在于,所述预加载模块包括:
预测子模块,被配置为在界面上的所述组件被移动之前,根据用户的操作,预测所述组件的移动方向;
组件确定子模块,被配置为根据预测的移动方向,确定即将进入显示区域的组件子项;
预加载子模块,被配置为对所述即将进入显示区域的组件子项进行界面元素的预加载。
9.根据权利要求7所述的装置,其特征在于,所述装置还包括:
懒加载模块,被配置为对所述组件,进行预设类型资源的懒加载。
10.根据权利要求7所述的装置,其特征在于,所述装置还包括:
预留设置模块,被配置为根据用户对预留组件子项数量的设置,在所述组件中,设置相应数量的、处于显示区域外的组件子项。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201610457963.3A CN106095461A (zh) | 2016-06-21 | 2016-06-21 | 在界面中显示组件的方法及装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201610457963.3A CN106095461A (zh) | 2016-06-21 | 2016-06-21 | 在界面中显示组件的方法及装置 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN106095461A true CN106095461A (zh) | 2016-11-09 |
Family
ID=57239025
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201610457963.3A Pending CN106095461A (zh) | 2016-06-21 | 2016-06-21 | 在界面中显示组件的方法及装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN106095461A (zh) |
Cited By (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN106658142A (zh) * | 2016-12-09 | 2017-05-10 | 广州华多网络科技有限公司 | 界面配置方法及装置 |
CN108271060A (zh) * | 2016-12-30 | 2018-07-10 | 深圳市优朋普乐传媒发展有限公司 | 一种列表加载方法及装置 |
CN108958831A (zh) * | 2018-06-12 | 2018-12-07 | 北京奇艺世纪科技有限公司 | 一种ViewGroup动态布局方法、装置及电子设备 |
CN109298905A (zh) * | 2018-08-15 | 2019-02-01 | 深圳点猫科技有限公司 | 利用前端编程语言优化图片懒加载的方法以及电子设备 |
CN109683978A (zh) * | 2017-10-17 | 2019-04-26 | 阿里巴巴集团控股有限公司 | 一种流式布局界面渲染的方法、装置以及电子设备 |
WO2019218384A1 (zh) * | 2018-05-14 | 2019-11-21 | 优视科技新加坡有限公司 | 显示处理方法、装置、存储介质及电子终端 |
CN112540761A (zh) * | 2020-12-11 | 2021-03-23 | 网易(杭州)网络有限公司 | 控件的显示控制方法和装置 |
Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20130174096A1 (en) * | 2011-12-30 | 2013-07-04 | Research In Motion Limited | Method and apparatus pertaining to the presentation of icons |
CN103314373A (zh) * | 2010-12-20 | 2013-09-18 | 赛贝斯股份有限公司 | 移动设备上大数据集的有效处理 |
CN104536791A (zh) * | 2014-12-29 | 2015-04-22 | 北京奇虎科技有限公司 | 基于移动终端的页面资源加载方法及装置 |
CN104965659A (zh) * | 2015-07-06 | 2015-10-07 | 无锡天脉聚源传媒科技有限公司 | 一种页面信息的预加载方法及装置 |
-
2016
- 2016-06-21 CN CN201610457963.3A patent/CN106095461A/zh active Pending
Patent Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN103314373A (zh) * | 2010-12-20 | 2013-09-18 | 赛贝斯股份有限公司 | 移动设备上大数据集的有效处理 |
US20130174096A1 (en) * | 2011-12-30 | 2013-07-04 | Research In Motion Limited | Method and apparatus pertaining to the presentation of icons |
CN104536791A (zh) * | 2014-12-29 | 2015-04-22 | 北京奇虎科技有限公司 | 基于移动终端的页面资源加载方法及装置 |
CN104965659A (zh) * | 2015-07-06 | 2015-10-07 | 无锡天脉聚源传媒科技有限公司 | 一种页面信息的预加载方法及装置 |
Cited By (8)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN106658142A (zh) * | 2016-12-09 | 2017-05-10 | 广州华多网络科技有限公司 | 界面配置方法及装置 |
CN108271060A (zh) * | 2016-12-30 | 2018-07-10 | 深圳市优朋普乐传媒发展有限公司 | 一种列表加载方法及装置 |
CN109683978A (zh) * | 2017-10-17 | 2019-04-26 | 阿里巴巴集团控股有限公司 | 一种流式布局界面渲染的方法、装置以及电子设备 |
WO2019218384A1 (zh) * | 2018-05-14 | 2019-11-21 | 优视科技新加坡有限公司 | 显示处理方法、装置、存储介质及电子终端 |
CN108958831A (zh) * | 2018-06-12 | 2018-12-07 | 北京奇艺世纪科技有限公司 | 一种ViewGroup动态布局方法、装置及电子设备 |
CN109298905A (zh) * | 2018-08-15 | 2019-02-01 | 深圳点猫科技有限公司 | 利用前端编程语言优化图片懒加载的方法以及电子设备 |
CN112540761A (zh) * | 2020-12-11 | 2021-03-23 | 网易(杭州)网络有限公司 | 控件的显示控制方法和装置 |
CN112540761B (zh) * | 2020-12-11 | 2024-06-25 | 网易(杭州)网络有限公司 | 控件的显示控制方法和装置 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN106095461A (zh) | 在界面中显示组件的方法及装置 | |
EP3040804B1 (en) | Electronic device for controlling power and method therefor | |
CN106066805A (zh) | 一种终端应用程序启动的方法、装置及终端 | |
EP2703987A2 (en) | Data Display Method and Apparatus | |
CN105474158B (zh) | 滑动工具条以切换标签 | |
KR102078753B1 (ko) | 화면 구성 방법 및 그 전자 장치 | |
KR20070093585A (ko) | 이동 통신 단말기에서 어플리케이션으로의 빠른 접근 방법및 장치 | |
CN104965659A (zh) | 一种页面信息的预加载方法及装置 | |
US10628018B2 (en) | Method and user interface (UI) for customized user access to application functionalities | |
CN103593116A (zh) | 便携式终端工具栏的显示和控制方法、及其装置 | |
CN105630531B (zh) | 移动终端的应用的运行状态的显示方法和装置 | |
CN105608390A (zh) | 图片隐藏及显示方法、图片处理系统、及电子设备 | |
US11397597B2 (en) | Application processing method and apparatus | |
CN103237113A (zh) | 信息显示的方法及电子设备 | |
KR102335373B1 (ko) | 화면 표시를 제어하는 전자 장치 및 방법 | |
CN103870123A (zh) | 一种信息处理方法及电子设备 | |
CN103513969A (zh) | 应用程序入口建立方法、装置和终端 | |
CN109558187B (zh) | 一种用户界面渲染方法及装置 | |
CN104035921A (zh) | 一种信息处理方法及电子设备 | |
CN110619102B (zh) | 一种页面元素的监听的方法及装置 | |
US20150234576A1 (en) | Method and apparatus for displaying information and electronic device adapted to the method | |
CN103870120A (zh) | 一种信息处理方法及电子设备 | |
CN105068718A (zh) | 一种信息处理方法及电子设备 | |
US20170139584A1 (en) | User account switching interface | |
CN111831185B (zh) | 应用的识别码的展示方法及装置 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
C06 | Publication | ||
PB01 | Publication | ||
C10 | Entry into substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
RJ01 | Rejection of invention patent application after publication | ||
RJ01 | Rejection of invention patent application after publication |
Application publication date: 20161109 |