CN117075786A - 一种页面显示方法及电子设备 - Google Patents
一种页面显示方法及电子设备 Download PDFInfo
- Publication number
- CN117075786A CN117075786A CN202310855298.3A CN202310855298A CN117075786A CN 117075786 A CN117075786 A CN 117075786A CN 202310855298 A CN202310855298 A CN 202310855298A CN 117075786 A CN117075786 A CN 117075786A
- Authority
- CN
- China
- Prior art keywords
- page
- control
- image information
- electronic equipment
- electronic device
- 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
- 238000000034 method Methods 0.000 title claims abstract description 103
- 238000009877 rendering Methods 0.000 claims abstract description 93
- 238000012545 processing Methods 0.000 claims abstract description 52
- 230000008569 process Effects 0.000 claims abstract description 46
- 238000004891 communication Methods 0.000 claims description 45
- 230000006854 communication Effects 0.000 claims description 45
- 238000004590 computer program Methods 0.000 claims description 6
- 238000004140 cleaning Methods 0.000 claims description 2
- 230000006870 function Effects 0.000 description 25
- 238000007726 management method Methods 0.000 description 14
- 230000005236 sound signal Effects 0.000 description 12
- 238000010295 mobile communication Methods 0.000 description 11
- 238000010586 diagram Methods 0.000 description 8
- 230000006978 adaptation Effects 0.000 description 5
- 230000008859 change Effects 0.000 description 5
- 230000000694 effects Effects 0.000 description 5
- 230000003287 optical effect Effects 0.000 description 5
- 238000013528 artificial neural network Methods 0.000 description 4
- 238000004364 calculation method Methods 0.000 description 3
- 230000001413 cellular effect Effects 0.000 description 3
- 230000008878 coupling Effects 0.000 description 3
- 238000010168 coupling process Methods 0.000 description 3
- 238000005859 coupling reaction Methods 0.000 description 3
- 230000036541 health Effects 0.000 description 3
- 229920001621 AMOLED Polymers 0.000 description 2
- 230000003416 augmentation Effects 0.000 description 2
- 230000003190 augmentative effect Effects 0.000 description 2
- 230000000903 blocking effect Effects 0.000 description 2
- 230000003139 buffering effect Effects 0.000 description 2
- 238000013461 design Methods 0.000 description 2
- 238000001514 detection method Methods 0.000 description 2
- 238000005516 engineering process Methods 0.000 description 2
- 239000004973 liquid crystal related substance Substances 0.000 description 2
- 230000007774 longterm Effects 0.000 description 2
- 230000002093 peripheral effect Effects 0.000 description 2
- 238000003672 processing method Methods 0.000 description 2
- 239000002096 quantum dot Substances 0.000 description 2
- 230000009467 reduction Effects 0.000 description 2
- 230000001133 acceleration Effects 0.000 description 1
- 230000000386 athletic effect Effects 0.000 description 1
- QVGXLLKOCUKJST-UHFFFAOYSA-N atomic oxygen Chemical compound [O] QVGXLLKOCUKJST-UHFFFAOYSA-N 0.000 description 1
- 230000007175 bidirectional communication Effects 0.000 description 1
- 238000013529 biological neural network Methods 0.000 description 1
- 230000005540 biological transmission Effects 0.000 description 1
- 239000008280 blood Substances 0.000 description 1
- 210000004369 blood Anatomy 0.000 description 1
- 210000000988 bone and bone Anatomy 0.000 description 1
- 210000004556 brain Anatomy 0.000 description 1
- 230000000295 complement effect Effects 0.000 description 1
- 239000004020 conductor Substances 0.000 description 1
- 238000013500 data storage Methods 0.000 description 1
- 238000001914 filtration Methods 0.000 description 1
- 230000001939 inductive effect Effects 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 229910044991 metal oxide Inorganic materials 0.000 description 1
- 150000004706 metal oxides Chemical class 0.000 description 1
- 230000001537 neural effect Effects 0.000 description 1
- 210000002569 neuron Anatomy 0.000 description 1
- 229910052760 oxygen Inorganic materials 0.000 description 1
- 239000001301 oxygen Substances 0.000 description 1
- 230000007105 physical stamina Effects 0.000 description 1
- 230000005855 radiation Effects 0.000 description 1
- 230000029058 respiratory gaseous exchange Effects 0.000 description 1
- 238000005070 sampling Methods 0.000 description 1
- 239000004065 semiconductor Substances 0.000 description 1
- 238000000926 separation method Methods 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
- 230000001360 synchronised effect Effects 0.000 description 1
- 238000012549 training Methods 0.000 description 1
- 238000012546 transfer Methods 0.000 description 1
- 230000000007 visual effect Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0487—Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
- G06F3/0488—Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
- G06F3/04842—Selection of displayed objects or displayed text elements
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T1/00—General purpose image data processing
- G06T1/20—Processor architectures; Processor configuration, e.g. pipelining
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T15/00—3D [Three Dimensional] image rendering
- G06T15/10—Geometric effects
- G06T15/20—Perspective computation
- G06T15/205—Image-based rendering
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- Computing Systems (AREA)
- Geometry (AREA)
- Computer Graphics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本申请提供一种页面显示方法及电子设备,应用于电子设备,所述电子设备包括屏幕,该方法包括:在屏幕显示第一页面的情况下,电子设备响应于作用在屏幕上的滑动操作,对第一页面中的第一控件进行截图处理,得到第一图片;其中,第一控件的渲染效率小于预设阈值。电子设备在页面滑动过程中显示第二页面,第二页面包括对第一图片渲染后的图像。本方案可以提高页面的渲染效率。本方案可以提高滑动过程中的效率,以及降低了滑动的卡帧问题。
Description
技术领域
本申请实施例涉及电子设备领域,尤其涉及一种页面显示方法及电子设备。
背景技术
目前,在对电子设备的页面进行渲染时,由于使用的图形处理器(graphicsprocessing unit,GPU)硬件芯片的限制,不支持对页面中部分复杂控件(例如弧形控件,以及各类曲线控件)的渲染绘制,导致复杂控件需要先通过中央处理器(central processingunit,CPU)进行大量的数学计算后,拆解成GPU支持的多个简单接口,再调用GPU对多个简单接口进行处理来完成对复杂控件的渲染绘制。
在电子设备的页面刷新时电子设备需要对页面重新进行渲染,因此,页面的刷新过程中需要耗费大量的时间进行CPU计算,导致每个页面的刷新时间较长,刷新帧率较低,从而造成用户的屏幕出现显示卡顿的现象。
发明内容
本申请实施例提供一种页面显示方法及电子设备,可以提高滑动过程中的效率,以及降低了滑动的卡帧问题。
为达到上述目的,本申请的实施例采用如下技术方案:
第一方面,提供了一种页面显示方法,应用于电子设备,所述电子设备包括屏幕,该方法包括:在屏幕显示第一页面的情况下,电子设备响应于作用在屏幕上的滑动操作,对第一页面中的第一控件进行截图处理,得到第一图片;其中,第一控件的渲染效率小于预设阈值;电子设备在页面滑动过程中显示第二页面,第二页面包括对第一图片渲染后的图像。
通过上述技术方案,可以通过在页面滑动时,对页面中渲染效率比较低的页面控件进行截图,然后在滑动过程中使用截图的图片进行渲染。该方案可以提高滑动过程中的效率,以及降低了滑动的卡帧问题。
在第一方面的一种可能的实现方式中,电子设备包括第一缓冲区,对第一页面中的第一控件进行截图处理,得到第一图片,包括:在第一缓冲区中包括第一页面对应的渲染后的图像信息的情况下,电子设备在第一缓冲区中对第一图像信息进行截图处理,得到第一图片;其中,第一图像信息为第一缓冲区中第一控件对应的渲染后的图像信息。由此,通过仅对渲染效率较低的控件对应的图像信息进行截图,可以减少实际使用场景内存开销。其中,由于对一张图片的渲染只需要调用GPU的一次接口就可以完成,相比于对页面中的第一控件直接进行渲染,渲染效率非常高。并且,除了第一控件以外的控件的渲染效率相对来说比较高,GPU对上述渲染效率比较高的控件进行渲染,能够加快GPU渲染的速度,整体能够缩短每帧页面的渲染时长,提高电子设备的页面刷新帧率,克服页面滑动卡顿的问题。
在第一方面的一种可能的实现方式中,电子设备包括第一缓冲区,对第一页面的第一控件进行截图处理,得到第一图片,包括:在第一控件的位置超出电子设备的屏幕的情况下,电子设备将第一控件对应的图像信息移动到第一缓冲区中;电子设备在第一缓冲区中对第一控件对应的图像信息进行渲染,得到渲染后的第二图像信息;电子设备对第二图像信息进行截图处理,得到第一图片。
在第一方面的一种可能的实现方式中,电子设备包括第一缓冲区,第一缓冲区包括屏幕显示页面的渲染后的图像信息,对第一页面的第一控件进行截图处理,得到第一图片,包括:在第一控件的大小超出电子设备的屏幕的情况下,电子设备将第一控件划分为预设数量的控件单元;其中,控件单元的大小未超出电子设备的屏幕;电子设备将各个控件单元的位置对应的图像信息移动到第一缓冲区中,对控件单元对应的图像信息进行渲染,得到渲染后的第三图像信息;电子设备对多个第三图像信息进行截图,得到多个第二图片,多个第二图片包括预设数量的控件单元的截图;电子设备对多个第二图片进行拼接,得到第一图片。由此,若是存在效率比较低的超长控件的情况下,对该超长控件对应的图像信息进行截图,可以优化页面滑动过程中超过一屏的控件的渲染帧率,提升整个页面的渲染帧率。
在第一方面的一种可能的实现方式中,在电子设备将第一控件对应的图像信息或控件单元对应的图像信息移动到第一缓冲区中之前,还包括:电子设备对第一缓冲区中目标区域进行信息清理;其中,目标区域与第一控件或控件单元的大小相同。其中,对第一缓冲区中目标区域进行信息清理后,不会影响对移动到该目标区域的第一控件对应的图像信息或控件单元对应的图像信息。
在第一方面的一种可能的实现方式中,在对第一页面的第一控件进行截图处理,得到第一图片之后,还包括:电子设备对目标区域信息清理前的图像信息进行恢复,得到恢复后的图像信息,电子设备至少对恢复后的图像信息进行渲染处理;或,电子设备重新显示第一页面。
在第一方面的一种可能的实现方式中,电子设备还包括第二缓冲区,电子设备在页面滑动过程中显示第二页面,包括:电子设备将渲染后的第一图片从第一缓冲区发送到第二缓冲区,通过第二缓冲区将渲染后的第一图片发送到电子设备的屏幕;电子设备的屏幕基于渲染后的第一图片显示第二页面。通过双缓冲中实现渲染及送图,可以使页面渲染的效率更高,提升了帧率。
在第一方面的一种可能的实现方式中,电子设备的屏幕基于渲染后的第一图片显示第二页面,包括:电子设备确定渲染后的第一图片的有效图像信息;其中,有效图像信息对应的位置在屏幕范围内;电子设备的屏幕上显示基于有效图像信息显示第二页面。
在第一方面的一种可能的实现方式中,第一页面中还包括第二控件,第二页面包括对第一图片渲染后的图像和对第二控件渲染后的图像。由此,可以通过在页面滑动时,对页面中渲染效率比较低的页面控件在缓冲区中进行截图,然后在滑动过程中使用截图的图片与页面中其余的控件一起进行渲染。该方案可以提高滑动过程中的效率,以及降低了滑动的卡帧问题。
在第一方面的一种可能的实现方式中,方法还包括:第二控件的渲染效率大于第一控件的渲染效率。
在第一方面的一种可能的实现方式中,在电子设备在页面滑动过程中显示第二页面之后,方法还包括:电子设备响应于滑动操作的结束,显示第三页面;其中,第三页面包括对第一控件渲染后的图像。
在第一方面的一种可能的实现方式中电子设备获取第一控件渲染后的第四图像信息;电子设备将第四图像信息替换最后的第二页面对应的图像信息中第一图片,得到第三页面。
第二方面,本申请提供一种电子设备,电子设备包括:通信模块、显示屏、存储器和一个或多个处理器;通信模块、显示屏、存储器和处理器耦合;存储器用于存储计算机程序代码,计算机程序代码包括计算机指令,当计算机指令被电子设备执行时,使得电子设备执行上述第一方面所述的方法。
第三方面,本申请提供了一种计算机可读存储介质,该计算机可读存储介质中存储有计算机指令,当其在电子设备上运行时,使得电子设备可以执行上述第一方面中任一项所述的方法。
第四方面,本申请提供了一种包含计算机指令的计算机程序产品,当其在计算机上运行时,使得计算机可以执行上述第一方面中任一项所述的方法。
第五方面,本申请实施例提供了一种芯片,该芯片包括处理器,处理器用于调用存储器中的计算机程序,以执行如第一方面中任一项所述的方法。
可以理解地,上述提供的第二方面所述的电子设备,以及第三方面所述的计算机可读存储介质及第四方面所述的计算机程序产品,第五方面所述的芯片均用于执行上文所提供的对应的方法,因此,其所能达到的有益效果可参考上文所提供的对应的方法中的有益效果,此处不再赘述。
附图说明
图1为本申请实施例提供的一种页面滑动的场景示意图;
图2为本申请实施例提供的一种渲染显示的流程示意图;
图3为本申请实施例提供的一种电子设备的硬件结构示意图;
图4为本申请实施例提供的一种电子设备的软件结构示意图;
图5为本申请实施例提供的一种页面显示方法的流程示意图;
图6为本申请实施例提供的一种控件截图的示意图;
图7为本申请实施例提供的另一种控件截图的示意图;
图8为本申请实施例提供的另一种控件截图示意图;
图9为本申请实施例提供的一种芯片***的示意图。
具体实施方式
下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行描述,显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都应当属于本申请保护的范围。
需要说明的是,以下术语“第一”、“第二”等仅用于描述目的,而不能理解为指示或暗示相对重要性或者隐含指明所指示的技术特征的数量。由此,限定有“第一”、“第二”等的特征可以明示或者隐含地包括一个或者更多个该特征。此外,术语“包括”和“具有”以及它们任何变形,意图在于覆盖不排他的包含。例如包含了一系列步骤或单元的过程、方法、***、产品或设备没有限定于已列出的步骤或单元,而是可选地还包括没有列出的步骤或单元,或可选地还包括对于这些过程、方法、产品或设备固有的其它步骤或单元。
在本说明书中描述的参考“一个实施例”或“一些实施例”等意味着在本申请的一个或多个实施例中包括结合该实施例描述的特定特征、结构或特点。由此,在本说明书中的不同之处出现的语句“在一个实施例中”、“在一些实施例中”、“在其他一些实施例中”、“在另外一些实施例中”等不是必然都参考相同的实施例,而是意味着“一个或多个但不是所有的实施例”,除非是以其他方式另外特别强调。
在本申请实施例中,“示例性的”或者“例如”等词用于表示作例子、例证或说明。本申请实施例中被描述为“示例性的”或者“例如”的任何实施例或设计方案不应被解释为比其它实施例或设计方案更优选或更具优势。确切而言,使用“示例性的”或者“例如”等词旨在以具体方式呈现相关概念。
如图1所示的页面滑动场景中,电子设备响应于用户对电子设备的页面101的向上滑动操作,在检测到用户的滑动操作结束后,显示为页面102。页面101到页面102,控件1的显示位置发生了变化。在页面滑动过程中,页面是根据滑动轨迹实时的绘制渲染的。
目前,在对电子设备的页面进行渲染时,由于使用的图形处理器(graphicsprocessing unit,GPU)硬件芯片的限制,不支持对页面中部分复杂控件(例如弧形控件,以及各类曲线控件)的渲染绘制,导致复杂控件需要先通过中央处理器(central processingunit,CPU)进行大量的数学计算后,拆解成GPU支持的多个简单接口,再调用GPU对多个简单接口进行处理来完成对复杂控件的渲染绘制。
在电子设备的页面刷新时电子设备需要对页面重新进行渲染,因此,页面的刷新过程中需要耗费大量的时间进行CPU计算,导致每个页面的刷新时间较长,刷新帧率较低,从而造成用户的屏幕出现显示卡顿的现象。
由此,本申请实施例中提供了一种页面显示方法,可以通过在页面滑动时,对页面中渲染效率比较低的页面控件进行截图,然后在滑动过程中使用截图的图片进行渲染,显示页面。该方案可以提高滑动过程中的效率,以及降低了滑动的卡帧问题。
本申请实施例中,电子设备对页面进行渲染和显示可以采用双帧缓冲方案,包含有两个缓冲区,一个缓冲区作为前端缓冲区,另一个缓冲区作为后备缓冲区。在后备缓冲区中承接绘制渲染好的图像信息,然后拷贝到前端缓冲区,在屏幕上显示。如图2所示,GPU可以在缓冲区1对控件进行渲染,并且缓冲区1中负责保存绘制渲染好的图像信息。然后缓冲区1可以将渲染后的图形信息拷贝到缓冲区2中,缓冲区2送图,在屏幕上显示。缓冲区1是负责实际的图形渲染工作,缓冲区2是负责屏幕的显示。当屏幕刷新需要重新渲染时,只需要将缓冲区1的内容拷贝到缓冲区2中,只需要等待内存拷贝的时间,不需要等到图形重新绘制渲染的时间。并且缓冲区1的内容拷贝到缓冲区2后,缓冲区2送图时,缓冲区1可以继续渲染。由此,电子设备通过在双帧缓冲中实现上述页面显示方法,可以使页面渲染的效率更高,提升了帧率。
本申请实施例中的电子设备可以为具有屏幕显示的电子设备。示例性的,本申请实施例中的电子设备具体可以是平板电脑、手机、桌面型、膝上型、手持计算机、笔记本电脑、超级移动个人计算机(ultra-mobile personal computer,UMPC)、上网本,以及蜂窝电话、个人数字助理(personal digital assistant,PDA)、增强现实(augmented reality,AR)\虚拟现实(virtual reality,VR)设备、车载设备等设备,本申请实施例对该电子设备的具体形态不作特殊限制。
本申请实施例提供的页面显示方法的执行主体可以为装置,该执行装置可以为图3所示的电子设备。同时,该执行装置还可以为该电子设备的中央处理器,或者该电子设备中的用于页面显示的控制模块。本申请实施例中以电子设备执行页面显示方法为例,说明本申请实施例提供的页面显示方法。
下面将结合附图对本申请实施例的实施方式进行详细描述。以上述电子设备是手机为例,介绍电子设备(如电子设备400)的硬件结构。其中,图3所示的电子设备400仅仅是电子设备的一个范例,并且电子设备400可以具有比图中所示出的更多的或者更少的部件,可以组合两个或更多的部件,或者可以具有不同的部件配置。图3中所示出的各种部件可以在包括一个或多个信号处理和/或专用集成电路在内的硬件、软件、或硬件和软件的组合中实现。
请参阅图3,图3示出了电子设备的硬件结构示意图,如图3所示,电子设备400可以包括:处理器410,外部存储器接口420,内部存储器421,USB接口430,充电管理模块440,电源管理模块441,电池442,天线1,天线2,移动通信模块450,无线通信模块460,音频模块470,扬声器470A,受话器470B,麦克风470C,耳机接口470D,传感器模块480,按键490,马达491,指示器492,摄像头493,显示屏494,以及用户标识模块(subscriber identificationmodule,SIM)卡接口495等。
其中,上述传感器模块480可以包括压力传感器,陀螺仪传感器,气压传感器,磁传感器,加速度传感器,距离传感器,接近光传感器,指纹传感器,温度传感器,触摸传感器,环境光传感器和骨传导传感器等传感器。
触摸传感器,也称“触控面板”。触摸传感器可以设置于显示屏494,由触摸传感器与显示屏494组成触摸屏,也称“触控屏”。触摸传感器用于检测作用于其上或附近的触摸操作。可以将检测到的触摸操作传递给应用处理器,以确定触摸事件类型,并通过显示屏494提供相应的视觉输出。在另一些实施例中,触摸传感器也可以设置于电子设备400的表面,与显示屏494所处的位置不同。
压力传感器用于感受压力信号,可以将压力信号转换成电信号。在一些实施例中,压力传感器可以设置于显示屏494。压力传感器的种类很多,如电阻式压力传感器,电感式压力传感器,电容式压力传感器等。电容式压力传感器可以是包括至少两个具有导电材料的平行板。当有力作用于压力传感器,电极之间的电容改变。电子设备400根据电容的变化确定压力的强度。当有触摸操作作用于显示屏494,电子设备400根据压力传感器检测所述触摸操作强度。电子设备400也可以根据压力传感器480A的检测信号计算触摸的位置。在一些实施例中,作用于相同触摸位置,但不同触摸操作强度的触摸操作,可以对应不同的操作指令。例如:当有触摸操作强度小于第一压力阈值的触摸操作作用于短消息应用图标时,执行查看短消息的指令。当有触摸操作强度大于或等于第一压力阈值的触摸操作作用于短消息应用图标时,执行新建短消息的指令。
可以理解的是,本申请实施例示意的结构并不构成对电子设备400的具体限定。在另一些实施例中,电子设备400可以包括比图示更多或更少的部件,或者组合某些部件,或者拆分某些部件,或者不同的部件布置。图示的部件可以以硬件,软件或软件和硬件的组合实现。
处理器410可以包括一个或多个处理单元,例如:处理器410可以包括应用处理器(application processor,AP),调制解调处理器,图形处理器(graphics processingunit,GPU),图像信号处理器(image signal processor,ISP),控制器,存储器,视频编解码器,数字信号处理器(digital signal processor,DSP),基带处理器,和/或神经网络处理器(neural-network processing unit,NPU)等。其中,不同的处理单元可以是独立的器件,也可以集成在一个或多个处理器中。
控制器可以是电子设备400的神经中枢和指挥中心。控制器可以根据指令操作码和时序信号,产生操作控制信号,完成取指令和执行指令的控制。
处理器410中还可以设置存储器,用于存储指令和数据。在一些实施例中,处理器410中的存储器为高速缓冲存储器。该存储器可以保存处理器410刚用过或循环使用的指令或数据。如果处理器410需要再次使用该指令或数据,可从所述存储器中直接调用。避免了重复存取,减少了处理器410的等待时间,因而提高了***的效率。
在一些实施例中,处理器410可以包括一个或多个接口。接口可以包括集成电路(inter-integrated circuit,I2C)接口,集成电路内置音频(inter-integrated circuitsound,I2S)接口,脉冲编码调制(pulse code modulation,PCM)接口,通用异步收发传输器(universal asynchronous receiver/transmitter,UART)接口,移动产业处理器接口(mobile industry processor interface,MIPI),通用输入输出(general-purposeinput/output,GPIO)接口,用户标识模块(subscriber identity module,SIM)接口,和/或通用串行总线(universal serial bus,USB)接口等。
I2C接口是一种双向同步串行总线,包括一根串行数据线(serial data line,SDL)和一根串行时钟线(derail clock line,SCL)。在一些实施例中,处理器410可以包含多组I2C总线。处理器410可以通过不同的I2C总线接口分别耦合触摸传感器480K,充电器,闪光灯,摄像头493等。例如:处理器410可以通过I2C接口耦合触摸传感器480K,使处理器410与触摸传感器480K通过I2C总线接口通信,实现电子设备400的触摸功能。
I2S接口可以用于音频通信。在一些实施例中,处理器410可以包含多组I2S总线。处理器410可以通过I2S总线与音频模块470耦合,实现处理器410与音频模块470之间的通信。在一些实施例中,音频模块470可以通过I2S接口向无线通信模块460传递音频信号,实现通过蓝牙耳机接听电话的功能。
PCM接口也可以用于音频通信,将模拟信号抽样,量化和编码。在一些实施例中,音频模块470与无线通信模块460可以通过PCM总线接口耦合。在一些实施例中,音频模块470也可以通过PCM接口向无线通信模块460传递音频信号,实现通过蓝牙耳机接听电话的功能。所述I2S接口和所述PCM接口都可以用于音频通信,两种接口的采样速率不同。
UART接口是一种通用串行数据总线,用于异步通信。该总线为双向通信总线。它将要传输的数据在串行通信与并行通信之间转换。在一些实施例中,UART接口通常被用于连接处理器410与无线通信模块460。例如:处理器410通过UART接口与蓝牙模块通信,实现蓝牙功能。在一些实施例中,音频模块470可以通过UART接口向无线通信模块460传递音频信号,实现通过蓝牙耳机播放音乐的功能。
MIPI接口可以被用于连接处理器410与显示屏494,摄像头493等***器件。MIPI接口包括摄像头串行接口(camera serial interface,CSI),显示屏串行接口(displayserial interface,DSI)等。在一些实施例中,处理器410和摄像头493通过CSI接口通信,实现电子设备400的拍摄功能。处理器410和显示屏494通过DSI接口通信,实现电子设备400的显示功能。
GPIO接口可以通过软件配置。GPIO接口可以配置为控制信号,也可配置为数据信号。在一些实施例中,GPIO接口可以用于连接处理器410与摄像头493,显示屏494,无线通信模块460,音频模块470,传感器模块480等。GPIO接口还可以被配置为I2C接口,I2S接口,UART接口,MIPI接口等。
USB接口430可以是Mini USB接口,Micro USB接口,USB Type C接口等。USB接口430可以用于连接充电器为电子设备400充电,也可以用于电子设备400与***设备之间传输数据。也可以用于连接耳机,通过耳机播放音频。还可以用于连接其他电子设备,例如AR设备等。
可以理解的是,本实施例示意的各模块间的接口连接关系,只是示意性说明,并不构成对电子设备400的结构限定。在另一些实施例中,电子设备400也可以采用上述实施例中不同的接口连接方式,或多种接口连接方式的组合。
充电管理模块440用于从充电器接收充电输入。其中,充电器在本申请实施例中是有线充电器,充电管理模块440可以通过USB接口430(即上述的充电接口)接收有线充电器的充电输入。充电管理模块440为电池442充电的同时,还可以通过电源管理模块441为电子设备供电。
电源管理模块441用于连接电池442,充电管理模块440与处理器410。电源管理模块441接收电池442和/或充电管理模块440的输入,为处理器410,内部存储器421,外部存储器,显示屏494,摄像头493,和无线通信模块460等供电。电源管理模块441还可以用于监测电池容量,电池循环次数,电池健康状态(漏电,阻抗)等参数。在其他一些实施例中,电源管理模块441也可以设置于处理器410中。在另一些实施例中,电源管理模块441和充电管理模块440也可以设置于同一个器件中。
电子设备400的无线通信功能可以通过天线1,天线2,移动通信模块450,无线通信模块460,调制解调处理器以及基带处理器等实现。
天线1和天线2用于发射和接收电磁波信号。电子设备400中的每个天线可用于覆盖单个或多个通信频带。不同的天线还可以复用,以提高天线的利用率。例如:可以将天线1复用为无线局域网的分集天线。在另外一些实施例中,天线可以和调谐开关结合使用。
射频模块可以提供应用在电子设备400上的包括2G/3G/4G/5G等无线通信的解决方案的通信处理模块。射频模块可以包括至少一个滤波器,开关,功率放大器,低噪声放大器(low noise amplifier,LNA)等。射频模块由天线1接收电磁波,并对接收的电磁波进行滤波,放大等处理,传送至调制解调器进行解调。射频模块还可以对经调制解调器调制后的信号放大,经天线1转为电磁波辐射出去。在一些实施例中,射频模块的至少部分功能模块可以被设置于处理器410中。在一些实施例中,射频模块的至少部分功能模块可以与处理器410的至少部分模块被设置在同一个器件中。
移动通信模块450可以提供应用在电子设备400上的包括2G/3G/4G/5G等无线通信的解决方案。移动通信模块450可以包括至少一个滤波器,开关,功率放大器,低噪声放大器(low noise amplifier,LNA)等。移动通信模块450可以由天线1接收电磁波,并对接收的电磁波进行滤波,放大等处理,传送至调制解调处理器进行解调。
移动通信模块450还可以对经调制解调处理器调制后的信号放大,经天线1转为电磁波辐射出去。在一些实施例中,移动通信模块450的至少部分功能模块可以被设置于处理器410中。在一些实施例中,移动通信模块450的至少部分功能模块可以与处理器410的至少部分模块被设置在同一个器件中。
无线通信模块460可以提供应用在电子设备400上的包括无线局域网(wirelesslocal area networks,WLAN)(如无线保真(wireless fidelity,Wi-Fi)网络),蓝牙(bluetooth,BT),全球导航卫星***(global navigation satellite system,GNSS),调频(frequency modulation,FM),近距离无线通信技术(near field communication,NFC),红外技术(infrared,IR)等无线通信的解决方案。例如,本申请实施例中,电子设备400可以通过无线通信模块460接入Wi-Fi网络。
无线通信模块460可以是集成至少一个通信处理模块的一个或多个器件。无线通信模块460经由天线2接收电磁波,将电磁波信号调频以及滤波处理,将处理后的信号发送到处理器410。无线通信模块460还可以从处理器410接收待发送的信号,对其进行调频,放大,经天线2转为电磁波辐射出去。
在一些实施例中,电子设备400的天线1和移动通信模块450耦合,天线2和无线通信模块460耦合,使得电子设备400可以通过无线通信技术与网络以及其他设备通信。所述无线通信技术可以包括全球移动通讯***(global system for mobile communications,GSM),通用分组无线服务(general packet radio service,GPRS),码分多址接入(codedivision multiple access,CDMA),宽带码分多址(wideband code division multipleaccess,WCDMA),时分码分多址(time-division code division multiple access,TD-SCDMA),长期演进(long term evolution,LTE),BT,GNSS,WLAN,NFC,FM,和/或IR技术等。所述GNSS可以包括全球卫星定位***(global positioning system,GPS),全球导航卫星***(global navigation satellite system,GLONASS),北斗卫星导航***(beidounavigation satellite system,BDS),准天顶卫星***(quasi-zenith satellitesystem,QZSS)和/或星基增强***(satellite based augmentation systems,SBAS)。
电子设备400通过GPU,显示屏494,以及应用处理器等实现显示功能。GPU为图像处理的微处理器,连接显示屏494和应用处理器。GPU用于执行数学和几何计算,用于图形渲染。处理器410可包括一个或多个GPU,其执行程序指令以生成或改变显示信息。
显示屏494用于显示图像,视频等。该显示屏494包括显示面板。显示面板可以采用液晶显示屏(liquid crystal display,LCD),有机发光二极管(organic light-emittingdiode,OLED),有源矩阵有机发光二极体或主动矩阵有机发光二极体(active-matrixorganic light emitting diode,AMOLED),柔性发光二极管(flex light-emittingdiode,FLED),Miniled,MicroLed,Micro-oLed,量子点发光二极管(quantum dot lightemitting diodes,QLED)等。在一些实施例中,电子设备400可以包括1个或N个显示屏494,N为大于1的正整数。
本申请实施例中,显示屏494可用于显示电子设备的界面。显示屏494可以用于显示电子设备的***桌面,电子设备的***桌面可以包括多个应用图标。应用图标可以在显示屏494的不同位置进行显示,即构成了电子设备的***桌面的布局。
本申请实施例中,显示屏494可用于显示电子设备的应用界面的显示示意图。
电子设备400可以通过ISP,摄像头493,视频编解码器,GPU,显示屏494以及应用处理器等实现拍摄功能。
ISP用于处理摄像头493反馈的数据。例如,拍照时,打开快门,光线通过镜头被传递到摄像头感光元件上,光信号转换为电信号,摄像头感光元件将所述电信号传递给ISP处理,转化为肉眼可见的图像。ISP还可以对图像的噪点,亮度,肤色进行算法优化。ISP还可以对拍摄场景的曝光,色温等参数优化。在一些实施例中,ISP可以设置在摄像头493中。
摄像头493用于捕获静态图像或视频。物体通过镜头生成光学图像投射到感光元件。感光元件可以是电荷耦合器件(charge coupled device,CCD)或互补金属氧化物半导体(complementary metal-oxide-semiconductor,CMOS)光电晶体管。感光元件把光信号转换成电信号,之后将电信号传递给ISP转换成数字图像信号。ISP将数字图像信号输出到DSP加工处理。DSP将数字图像信号转换成标准的RGB,YUV等格式的图像信号。在一些实施例中,电子设备400可以包括1个或N个摄像头493,N为大于1的正整数。
数字信号处理器用于处理数字信号,除了可以处理数字图像信号,还可以处理其他数字信号。例如,当电子设备400在频点选择时,数字信号处理器用于对频点能量进行傅里叶变换等。
视频编解码器用于对数字视频压缩或解压缩。电子设备400可以支持一种或多种视频编解码器。这样,电子设备400可以播放或录制多种编码格式的视频,例如:动态图像专家组(moving picture experts group,MPEG)1,MPEG2,MPEG3,MPEG4等。
NPU为神经网络(neural-network,NN)计算处理器,通过借鉴生物神经网络结构,例如借鉴人脑神经元之间传递模式,对输入信息快速处理,还可以不断的自学习。通过NPU可以实现电子设备400的智能认知等应用,例如:图像识别,人脸识别,语音识别,文本理解等。
外部存储器接口420可以用于连接外部存储卡,例如Micro SD卡,实现扩展电子设备400的存储能力。外部存储卡通过外部存储器接口420与处理器410通信,实现数据存储功能。例如将音乐,视频等文件保存在外部存储卡中。
内部存储器421可以用于存储计算机可执行程序代码,所述可执行程序代码包括指令。处理器410通过运行存储在内部存储器421的指令,从而执行电子设备400的各种功能应用以及数据处理。例如,在本申请实施例中,处理器410可以通过执行存储在内部存储器421中的指令,内部存储器421可以包括存储程序区和存储数据区。
其中,存储程序区可存储操作***,至少一个功能所需的应用程序(比如声音播放功能,图像播放功能等)等。存储数据区可存储电子设备400使用过程中所创建的数据(比如音频数据,电话本等)等。此外,内部存储器421可以包括高速随机存取存储器,还可以包括非易失性存储器,例如至少一个磁盘存储器件,闪存器件,通用闪存存储器(universalflash storage,UFS)等。
电子设备400可以通过音频模块470,扬声器470A,受话器470B,麦克风470C,耳机接口470D,以及应用处理器等实现音频功能。例如音乐播放,录音等。
音频模块470用于将数字音频信息转换成模拟音频信号输出,也用于将模拟音频输入转换为数字音频信号。音频模块470还可以用于对音频信号编码和解码。在一些实施例中,音频模块470可以设置于处理器410中,或将音频模块470的部分功能模块设置于处理器410中。
扬声器470A,也称“喇叭”,用于将音频电信号转换为声音信号。电子设备400可以通过扬声器470A收听音乐,或收听免提通话。
受话器470B,也称“听筒”,用于将音频电信号转换成声音信号。当电子设备400接听电话或语音信息时,可以通过将受话器470B靠近人耳接听语音。
麦克风470C,也称“话筒”,“传声器”,用于将声音信号转换为电信号。当拨打电话或发送语音信息时,用户可以通过人嘴靠近麦克风470C发声,将声音信号输入到麦克风470C。电子设备400可以设置至少一个麦克风470C。在一些实施例中,电子设备400可以设置两个麦克风470C,除了采集声音信号,还可以实现降噪功能。在一些实施例中,电子设备400还可以设置三个,四个或更多麦克风470C,实现采集声音信号,降噪,还可以识别声音来源,实现定向录音功能等。本申请实施例中,在开启语音控制功能后,在支持的视频应用内,电子设备可以通过麦克风接收到用户的语音信息。
耳机接口470D用于连接有线耳机。耳机接口470D可以是USB接口430,也可以是3.5mm的开放移动电子设备平台(open mobile terminal platform,OMTP)标准接口,美国蜂窝电信工业协会(cellular telecommunications industry association of the USA,CTIA)标准接口。
按键490包括开机键,音量键等。按键490可以是机械按键。也可以是触摸式按键。电子设备400接收按键490输入,产生与电子设备400的用户设置以及功能控制有关的键信号输入。
马达491可以产生振动提示。马达491可以用于来电振动提示,也可以用于触摸振动反馈。例如,作用于不同应用(例如拍照,音频播放等)的触摸操作,可以对应不同的振动反馈效果。作用于显示屏494不同区域的触摸操作,也可对应不同的振动反馈效果。不同的应用场景(例如:时间提醒,接收信息,闹钟,游戏等)也可以对应不同的振动反馈效果。触摸振动反馈效果还可以支持自定义。
指示器492可以是指示灯,可以用于指示充电状态,电量变化,也可以用于指示消息,未接来电,通知等。
SIM卡接口495用于连接SIM卡。SIM卡可以通过***SIM卡接口495,或从SIM卡接口495拔出,实现和电子设备400的接触和分离。电子设备400可以支持1个或N个SIM卡接口,N为大于1的正整数。SIM卡接口495可以支持Nano SIM卡,Micro SIM卡,SIM卡等。
以下实施例中的方法均可以在具有上述硬件结构的电子设备400中实现。同一个SIM卡接口495可以同时***多张卡。所述多张卡的类型可以相同,也可以不同。SIM卡接口495也可以兼容不同类型的SIM卡。SIM卡接口495也可以兼容外部存储卡。电子设备400通过SIM卡和网络交互,实现通话以及数据通信等功能。在一些实施例中,电子设备400采用eSIM,即嵌入式SIM卡。eSIM卡可以嵌在电子设备400中,不能和电子设备400分离。
尽管图3未示出,电子设备400还可以闪光灯、微型投影装置、近场通信(NearFieldCommunication,NFC)装置等,在此不再赘述。
其中,电子设备400的软件***可以采用分层架构,事件驱动架构,微核架构,微服务架构,或云架构。本申请实施例以分层架构的Android***为例,示例性说明电子设备的软件结构。
图4是本申请实施例提供的电子设备的软件结构框图。分层架构可将软件分成若干个层,每一层都有清晰的角色和分工。层与层之间通过软件接口通信。在一些实施例中,将Android***分为三层,从上至下分别为应用程序层(简称应用层,Application),应用程序框架层(简称框架层,Framework),以及内核层(Kernel,也称为驱动层)。例如,如图4所示,电子设备可以包括应用层、框架层和内核层。
应用层:可以包括一系列应用程序包。例如,图4所示的应用层可以包括:通信应用、健康应用、运动应用、***应用和音频应用。其中,通信应用可以包括:信息,通话记录,联系人和通信设置。健康应用可以包括:心率,血氧,压力,呼吸,睡眠和心理周期。运动应用可以包括:锻炼应用,体能年龄,活动记录,锻炼记录和训练状态。***应用可以包括:指南针,天气,闹钟,秒表,消息,海拔气压计和设置。音频应用可以包括本地音乐和在线音乐等。
框架层为应用层的应用程序提供应用编程接口(application programminginterface,API)和编程框架。如图4所示,框架层可以提供用户界面UI适配层和UIKIT框架。
UIKIT框架是一个前端框架,UIKIT框架包括:控件(标签(label)、按钮(button)、图像视图(imageView)、图表(chart)、圆形进度(circleProgress))事件、动画(Animator)、字体、渲染、截图、事件(拖拽、点击、滚动)处理等。应用层的应用可以在UIKIT框架中调用上述功能。例如,在应用的某个渲染效率比较低的控件,要去使用截图功能时,就去UIKIT框架调用该控件对应的截图功能。
其中,UI适配层涉及到渲染流程,渲染流程包括两个中断事件(ER中断和TE中断)和两个线程(UI线程和Display线程),中断和线程属于内核,但是中断的处理过程还有线程的回调函数都是在上层实现的。其中,上报的事件处理,都有对应的两个中断的回调函数去处理中断。也就是在接收到中断上报后,UI适配层向操作***发送消息,其中,渲染的消息发给UI线程,双帧缓冲拷贝以及送图的消息发给Display线程。
内核层可以包括操作***,硬件抽象层(Hal)和驱动。
操作***中包括:内存(Memory),任务Task(UI线程、Display线程),中断(TE中断、ER中断)。操作***可以上报中断处理,其中TE中断的上报频率就是定时的60hz,ER中断是在每次把图送到屏幕上之后会去上报。操作***在接收到UI适配层发给UI线程的消息后,支持UI线程的回调函数会调用UIKIT框架去执行渲染流程。操作***在接收到UI适配层发给Display线程的消息后,支持Display线程的回调函数会去执行拷贝及送图。其中,缓冲区都是属于内存空间。
硬件抽象层(Hal)可以包括LCD(屏幕硬件抽象层)和图形处理器(GPU)抽象接口。UIKIT框架在接收到执行渲染流程的调用请求后,向硬件抽象层发送消息,调用GPU抽象接口进行渲染。
驱动可以包括LCD(屏幕显示驱动)和图形处理器驱动。硬件抽象层在接收到送图消息后,去调用屏幕显示驱动送图。硬件抽象层在接收到GPU调用消息后,则去调用GPU驱动。
本申请实施例提供的一种页面显示方法中,在页面滑动之前,页面中的控件可能存在两种情况,一种是完全显示在页面中,另一种是部分显示在页面中。本申请实施例针对不同状态的控件,对应有不同的处理方法。可以理解的是,页面通常是由多个控件组成,这里的控件是指视图(view)控件。
下面详细介绍本申请实施例提供的页面显示方法,如图5所示,具体步骤包括S501-S503。
S501.在屏幕显示第一页面的情况下,电子设备响应于作用在屏幕上的滑动操作,对第一页面中的第一控件进行截图处理,得到第一图片。
其中,电子设备可以是检测到用户手指在第一页面上的滑动操作,响应于该滑动操作,对第一控件进行截图,得到第一图片。
其中,这里的第一控件是指渲染效率小于预设阈值的控件。其中,第一控件可以是例如半圆弧形控件,在绘制的时候需要去根据数学公式计算,要根据圆心和半径去计算各个点,并且绘制的时候是通过一条线一条线的依次对圆弧进行填充,效率很低。或者第一控件可以是针对文本控件,每个字都要单独去绘制的控件,如果控件包含的字数较多,那么就要多次调用GPU,效率也很低。或者第一控件可以是包括几百个点或者几百条线的控件,也需要多次调用GPU。类似上述的控件,如果把整个控件渲染出来,耗时比较长,渲染效率比较低。
本申请实施例中,可以预先在电子设备中获取各个控件的渲染效率,并且可以预先将渲染效率小于预设阈值的控件记录下来,例如以表格形式存储。这样在每次响应于用户的操作,要去进行截图时,可以直接从存储的表格中确认出渲染效率比较低的控件,对其进行截图。
上述渲染操作是在缓冲区中(设为第一缓冲区)进行的,并且渲染后得到的图像信息也可以保存在第一缓冲区中。其中,这里的第一缓冲区是电子设备上的一个内存块,截图生成的图片也可以保存在电子设备上的其他内存块。
本申请实施例中,第一控件可以是全部处于屏幕内的控件。可以理解的是,电子设备的屏幕与显示页面是大小相同的。对于该类控件,在第一缓冲区中包括第一页面对应的渲染后的图像信息的情况下,电子设备在第一缓冲区中对第一图像信息进行截图处理,可以得到第一图片。其中,这里的第一图像信息为第一缓冲区中第一控件对应的渲染后的图像信息。
第一控件也可以是超出了屏幕的大小的控件。对于该类控件,可以通过将第一控件划分为预设数量的控件单元;其中,控件单元的大小未超出电子设备的屏幕。电子设备可以将各个控件单元的位置对应的图像信息依次移动到第一缓冲区中,对控件单元对应的图像信息分别进行渲染,得到渲染后的第三图像信息。电子设备对多个第三图像信息进行截图,得到多个第二图片,多个第二图片包括预设数量的控件单元的截图。最后,对多个第二图片按照第一控件各个控件单元对应位置进行拼接,得到最终的第一图片。
也就是说,可以是对多个第三图像信息分别进行截图,那么,此时截图的数量就为预设数量。也可以是同时对1个以上的第三图像信息进行截图,那么,此时截图的数量小于预设数量。例如,电子设备将第一控件划分为6个控件单元,单个控件单元的大小未超出电子设备的屏幕,并且两个控件单元的大小也未超出电子设备的屏幕。那么,可以同时对2个的第三图像信息进行截图,那么,此时截图的数量为3。
第一控件还可以是位置超出屏幕,只有部分显示在屏幕内的控件。对于该类控件,可以通过将第一控件对应的图像信息全部移动到第一缓冲区中。电子设备在第一缓冲区中对第一控件对应的图像信息进行渲染,得到渲染后的第二图像信息。电子设备对第二图像信息进行截图处理,得到第一图片。
本申请实施例中,在电子设备将第一控件对应的图像信息或控件单元对应的图像信息移动到第一缓冲区中之前,电子设备要对第一缓冲区中目标区域进行信息清理。其中,目标区域与第一控件或控件单元的大小相同。对第一缓冲区中目标区域进行信息清理后,不会影响对移动到该目标区域的第一控件对应的图像信息或控件单元对应的图像信息。
其中,在对第一页面的第一控件进行截图处理,得到第一图片之后,电子设备对目标区域信息清理前的图像信息进行恢复,得到恢复后的图像信息,电子设备至少对恢复后的图像信息进行渲染处理。也就是说,要恢复到移动之前的第一缓冲区的存储图像信息的状态。或者,电子设备也可以是重新显示第一页面,也就是重新刷新一次页面。
其中,若第一控件包括多个,可以对多个第一控件分别进行截图,并且分别保存截图。在滑动过程中,控件的位置可能发生变化,但是仍然会显示这个控件,由此在截图后,可以重复的应用到后续的显示过程中,只需要对截图进行渲染,不需要重复对控件进行渲染,可以提升渲染效率。
S502.电子设备在页面滑动过程中显示第二页面,第二页面包括对第一图片渲染后的图像。
本申请实施例中,在页面滑动的过程中,页面是会实时刷新显示的。可以理解的是,页面中的图像是一帧一帧变化的,每一帧图像都会按照一定帧率进行渲染。在页面滑动的过程中,电子设备会基于控件的滑动轨迹重新对发生了位置变化的控件进行绘制渲染,页面中显示的是更新的图像。在页面滑动的过程中,页面中如果有控件的位置会发生变化,那么显示的每一帧图像都与上一帧是不一样的。
电子设备中包含第一缓冲区,在页面滑动的过程中电子设备在第一缓冲区中对截图生成的第一图片进行渲染,得到渲染后的图像信息,然后在电子设备的屏幕上基于渲染后的图像信息显示第二页面。也就是说,显示的第二页面,包括对第一图片渲染后的图像。
本申请实施例中,电子设备还包括第二缓冲区,第二缓冲区可以去接收第一缓冲发送的渲染后的第一图片,并送图显示。具体来说,电子设备将渲染后的第一图片从第一缓冲区发送到第二缓冲区,通过第二缓冲区将渲染后的第一图片发送到电子设备的屏幕。电子设备的屏幕基于渲染后的第一图片显示第二页面。通过双缓冲中实现渲染及送图,可以使页面渲染的效率更高,提升了帧率。
本申请实施例中,电子设备确定渲染后的第一图片的有效图像信息;其中,有效图像信息对应的位置在屏幕范围内。电子设备的屏幕上显示基于有效图像信息第二页面。也就是说,要根据滑动过程中,第一控件的实时位置,去确定显示在屏幕内的部分,然后对第一图片中对应的部分进行渲染,得到渲染后的有效图像信息。
本申请实施例中,第一页面中包含有多个控件,多个控件中包含有第一控件与第二控件。第二控件不需要进行截图处理,第二控件的渲染效率是大于预设渲染效率的,也就表示,第二控件的渲染效率也是大于第一控件的渲染效率的。
那么,在页面滑动的过程中显示的第二页面包括对第一图片渲染后的图像和对第二控件渲染后的图像。
在页面滑动的过程中,电子设备在第一缓冲区中对截图生成的第一图片以及页面中除第一控件以外的控件进行渲染,得到渲染后的图像信息。然后将渲染后的图像信息拷贝到第二缓冲区,显示在屏幕页面上。由于对一张图片的渲染只需要调用GPU的一次接口就可以完成,相比于对页面中的第一控件直接进行渲染,渲染效率非常高。并且,除了第一控件以外的控件的渲染效率相对来说比较高,GPU对上述渲染效率比较高的控件进行渲染,能够加快GPU渲染的速度,整体能够缩短每帧页面的渲染时长,提高电子设备的页面刷新帧率,克服页面滑动卡顿的问题。
在页面滑动过程中,由于显示的是对第一图片渲染后显示的图片,而不是对第一控件的数据渲染后显示的第一控件本身,因此,电子设备不接收用户对第一控件的操作。
S503.电子设备响应于滑动操作的结束,显示第三页面;其中,第三页面包括对第一控件渲染后的图像。
本申请实施例中,在电子设备检测到滑动操作结束后,电子设备会释放对应的第一图片,用第一控件本身去进行渲染。具体来说,电子设备可以获取第一控件渲染后的第四图像信息,将第四图像信息替换最后的第二页面对应的图像信息中第一图片,得到上述第三页面。
电子设备在检测到页面滑动结束后,此时显示的第三页面,通过待显示的页面中控件对应的数据进行渲染后,将渲染后的图像信息从第一缓冲区拷贝到第二缓冲区,再进行显示的。其中,检测到滑动操作的结束,可以是电子设备检测到用户手指抬起。也就是说,在滑动操作结束后的页面渲染过程中,是对第一控件本身对应的数据进行渲染,而不会再去对第一图片进行渲染。
其中,第一缓冲区存储的帧图像数据对应的图像大小与屏幕的大小是相对应的。如果屏幕是方屏,那么第一缓冲区存储的帧图像数据对应的图像的大小与屏幕的大小相同。如果屏幕是圆屏,那么第一缓冲区存储的帧图像数据对应的图像的大小可以为能够刚好容纳整个屏幕的方形的大小。缓冲区实际上也是内存块,一般来说,缓冲区的形状都是方形的。
电子设备释放第一控件的第一图片,也就是删除内存中的第一图片,此时第一控件可以更新自己的数据,并且可以节省内存。在一些实施例中,也可以在页面退出后,再去删除内存中的第一图片。例如,若是第一控件为文本内容不会发生改变的文本控件,那么在电子设备检测到页面滑动结束后,可以先不用释放第一图片。电子设备可以在后续的页面滑动过程中,通过对第一图片进行渲染实现对第一控件的渲染。
下面针对不同类型的第一控件截图的具体处理方法分别进行介绍。
请参阅图6,图6为局部控件的截图示意图。如图6所示,屏幕601中,视图控件1只占据屏幕601中的一部分,这里的视图控件1即为局部控件。
在电子设备响应于用户对屏幕页面(设为第一页面)的滑动操作时,在第一缓冲区中截取视图控件1的图片。在执行截图操作之前,电子设备获取组成页面的各个控件对应的渲染效率。将渲染效率小于预设阈值的控件作为待截图的控件,也就是图6中,当前页面中渲染效率小于预设阈值的控件只有视图控件1。
其中,设电子设备中包含有两个缓冲区,由于GPU是将控件渲染在第一缓冲区中。因此,电子设备响应于用户对屏幕页面的滑动操作时,是在第一缓冲区中对视图控件1进行截图。实际上,是对视图控件1对应的渲染好的图像信息进行截图。在截图操作后,得到第一图片,可以保存在电子设备的内存中。
其中,在页面滑动的过程中,电子设备可以根据滑动轨迹获取到每一帧图像中控件在屏幕上的实时位置,每一次渲染都是根据控件的位置在第一缓冲区中对应的位置进行渲染。如果是视图控件1,则在第一缓冲区的对应位置对第一图片进行渲染。如果是页面中的其他控件,则在第一缓冲区的对应位置对该控件的待渲染信息进行渲染。然后,组合成为待显示的页面的渲染后的图像信息,同样的将渲染后的图像信息从第一缓冲区拷贝到第二缓冲区,在屏幕上显示新的页面。
由此,通过仅对渲染效率较低的控件对应的图像信息进行截图,可以减少实际使用场景内存开销。
请参阅图7,图7为超长控件的截图示意图。视图控件2为当前页面中渲染效率小于预设阈值的控件。如图7所示,屏幕701中,视图控件2超过了屏幕的大小,可以是例如长文本说明页等。那么,屏幕对应的第一缓冲区702中也无法容纳全部控件内容。此时,可以通过多次截图拼接来实现长页面截图,具体步骤如下:
在电子设备响应于用户对屏幕页面的滑动操作时,将待截图控件的位置移到屏幕左上角位置处,对处于屏幕区域大小的控件部分对应的图像信息进行截图,然后临时保存。由于图7中的屏幕是圆屏的,第一缓冲区与屏幕是相对应的,也就是将视图控件2的位置移到第一缓冲区的左上角位置处,对处于第一缓冲区区域内的视图控件2部分对应的图像信息进行第一次截图。本申请对控件要去移动到的位置不做限制,可以是第一缓冲区的左上角,也可以是右上角,右下角等,也可以是第一缓冲区的其他位置。
然后,如图7所示,将已截图的部分移除到第一缓冲区的上半部分,对视图控件2剩余部分对应的图像信息进行第二次截图。
此时,电子设备已经在第一缓冲区中截取了视图控件2对应的图像信息的全部。然后,对第一次截图后生成的图片与第二次截图生成的图片进行拼接,保存为一张完整的图片。后续在整个界面互动过程中,使用这一张完整的图片进行绘制渲染。如图7所示的虚线区域为完整的一张图片。
其中,截图的次数可以根据控件的大小决定的,控件超出屏幕的部分越多,那么相应的截图的次数也会更多。
其中,在将划分后的控件部分移动到对应位置进行截图之前,要先把这个位置对应区域原有的图像信息清理掉。然后将控件移动到对应位置后进行渲染处理,在对渲染处理后得到的图像信息进行截图。在截图结束之后,要对页面进行恢复,也就是对上述位置处的控件再渲染一次,由此第二缓冲区中保存的图像信息就会保持不变。
在一些实施例中,在将划分后的控件部分移动到对应位置进行截图之前,可以先对第二缓冲区内的图像信息全部清理掉。然后将控件部分移动到对应位置后进行渲染处理,在对渲染处理后得到的图像信息进行截图。在对所有的控件部分截图结束之后,在第二缓冲区内获取移动之前的页面数据重新进行渲染。这里移动之前的页面数据也包括视图控件2,那么在重新渲染的时候就可以用视图控件2对应的图片对视图控件2的进行渲染。
由此,若是存在效率比较低的超长控件的情况下,对该超长控件对应的图像信息进行截图,可以优化页面滑动过程中超过一屏的控件的渲染帧率,提升整个页面的渲染帧率。
请参阅图8,图8为部分显示控件的截图示意图。如图8所示,视图控件3为当前页面中渲染效率小于预设阈值的控件。如图8所示,屏幕801中,视图控件3的位置超出屏幕,只有部分显示在屏幕页面内。此时,可以通过将视图控件3移动到屏幕中,再对视图控件3进行截图。
其中,在将视图控件3移动到对应位置进行截图之前,要先把这个位置对应区域原有的图像信息清理掉。然后将视图控件3移动到对应位置后进行渲染处理,在对渲染处理后得到的图像信息进行截图。在截图结束之后,要把当前页面恢复回去之后,也就是对上述位置处的控件再渲染一次,由此第一缓冲区中保存的图像信息就会保持不变。
综上所述,本申请实施例的一种页面显示方法,可以通过在页面滑动时,对页面中渲染效率比较低的页面控件在缓冲区中进行截图,然后在滑动过程中使用截图的图片与页面中其余的控件一起进行渲染,在滑动结束后释放渲染后的图片,与原来页面中渲染好的部分一起显示为滑动后的页面。该方案可以提高滑动过程中的效率,以及降低了滑动的卡帧问题。
本申请实施例还提供一种芯片***,如图9所示,该芯片***1200包括至少一个处理器1201和至少一个接口电路1202。处理器1201和接口电路1202可通过线路互联。例如,接口电路1202可用于从其它装置(例如电子设备的存储器)接收信号。又例如,接口电路1202可用于向其它装置(例如处理器1201)发送信号。示例性的,接口电路1202可读取存储器中存储的指令,并将该指令发送给处理器1201。当所述指令被处理器1201执行时,可使得电子设备执行上述实施例中的各个步骤。当然,该芯片***还可以包含其他分立器件,本申请实施例对此不作具体限定。
本申请实施例还提供一种计算机存储介质,该计算机存储介质包括计算机指令,当所述计算机指令在上述电子设备上运行时,使得该电子设备执行上述方法实施例中手机执行的各个功能或者步骤。
本申请实施例还提供一种计算机程序产品,当所述计算机程序产品在计算机上运行时,使得所述计算机执行上述方法实施例中手机执行的各个功能或者步骤。
通过以上实施方式的描述,所属领域的技术人员可以清楚地了解到,为描述的方便和简洁,仅以上述各功能模块的划分进行举例说明,实际应用中,可以根据需要而将上述功能分配由不同的功能模块完成,即将装置的内部结构划分成不同的功能模块,以完成以上描述的全部或者部分功能。
在本申请所提供的几个实施例中,应该理解到,所揭露的***,装置和方法,可以通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如,所述模块或单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个装置,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,装置或单元的间接耦合或通信连接,可以是电性,机械或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是一个物理单元或多个物理单元,即可以位于一个地方,或者也可以分布到多个不同地方。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外,在本申请各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个可读取存储介质中。基于这样的理解,本申请实施例的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该软件产品存储在一个存储介质中,包括若干指令用以使得一个设备(可以是单片机,芯片等)或处理器(processor)执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质包括:U盘、移动硬盘、只读存储器(read only memory,ROM)、随机存取存储器(random access memory,RAM)、磁碟或者光盘等各种可以存储程序代码的介质。
以上内容,仅为本申请的具体实施方式,但本申请的保护范围并不局限于此,任何在本申请揭露的技术范围内的变化或替换,都应涵盖在本申请的保护范围之内。因此,本申请的保护范围应以所述权利要求的保护范围为准。
Claims (13)
1.一种页面显示方法,其特征在于,应用于电子设备,所述电子设备包括屏幕,所述方法包括:
在所述屏幕显示第一页面的情况下,所述电子设备响应于作用在所述屏幕上的滑动操作,对所述第一页面中的第一控件进行截图处理,得到第一图片;其中,所述第一控件的渲染效率小于预设阈值;
所述电子设备在页面滑动过程中显示第二页面,所述第二页面包括对所述第一图片渲染后的图像。
2.根据权利要求1所述的方法,其特征在于,所述电子设备包括第一缓冲区,所述对所述第一页面中的第一控件进行截图处理,得到第一图片,包括:
在所述第一缓冲区中包括所述第一页面对应的渲染后的图像信息的情况下,所述电子设备在所述第一缓冲区中对第一图像信息进行截图处理,得到所述第一图片;其中,所述第一图像信息为所述第一缓冲区中所述第一控件对应的渲染后的图像信息。
3.根据权利要求1所述的方法,其特征在于,所述电子设备包括第一缓冲区,所述对所述第一页面的第一控件进行截图处理,得到第一图片,包括:
在所述第一控件的位置超出所述电子设备的屏幕的情况下,所述电子设备将所述第一控件对应的图像信息移动到所述第一缓冲区中;
所述电子设备在所述第一缓冲区中对所述第一控件对应的图像信息进行渲染,得到渲染后的第二图像信息;
所述电子设备对所述第二图像信息进行截图处理,得到所述第一图片。
4.根据权利要求1或3中所述的方法,其特征在于,所述电子设备包括第一缓冲区,所述第一缓冲区包括所述屏幕显示页面的渲染后的图像信息,所述对所述第一页面的第一控件进行截图处理,得到第一图片,包括:
在所述第一控件的大小超出所述电子设备的屏幕的情况下,所述电子设备将所述第一控件划分为预设数量的控件单元;其中,所述控件单元的大小未超出所述电子设备的屏幕;
所述电子设备将各个控件单元的位置对应的图像信息移动到所述第一缓冲区中,对所述控件单元对应的图像信息进行渲染,得到渲染后的第三图像信息;
所述电子设备对所述多个第三图像信息进行截图,得到多个第二图片,所述多个第二图片包括所述预设数量的控件单元的截图;
所述电子设备对所述多个第二图片进行拼接,得到所述第一图片。
5.根据权利要求3或4所述的方法,其特征在于,在所述电子设备将所述第一控件对应的图像信息或所述控件单元对应的图像信息移动到所述第一缓冲区中之前,还包括:
所述电子设备对所述第一缓冲区中目标区域进行信息清理;其中,所述目标区域与所述第一控件或所述控件单元的大小相同;
其中,在所述对所述第一页面的第一控件进行截图处理,得到第一图片之后,还包括:
所述电子设备对所述目标区域信息清理前的图像信息进行恢复,得到恢复后的图像信息,所述电子设备至少对所述恢复后的图像信息进行渲染处理;或,
所述电子设备重新显示所述第一页面。
6.根据权利要求2-5任一项所述的方法,其特征在于,所述电子设备还包括第二缓冲区,所述电子设备在页面滑动过程中显示第二页面,包括:
所述电子设备将渲染后的第一图片从所述第一缓冲区发送到所述第二缓冲区,通过所述第二缓冲区将所述渲染后的第一图片发送到所述电子设备的屏幕;
所述电子设备的屏幕基于所述渲染后的第一图片显示所述第二页面。
7.根据权利要求6所述的方法,其特征在于,所述电子设备的屏幕基于所述渲染后的第一图片显示所述第二页面,包括:
所述电子设备确定所述渲染后的第一图片的有效图像信息;其中,所述有效图像信息对应的位置在所述屏幕范围内;
所述电子设备的屏幕上显示基于所述有效图像信息显示所述第二页面。
8.根据权利要求1-7任一项所述的方法,其特征在于,所述第一页面中还包括第二控件,所述第二页面包括对所述第一图片渲染后的图像和对所述第二控件渲染后的图像。
9.根据权利要求8所述的方法,其特征在于,所述方法还包括:所述第二控件的渲染效率大于所述第一控件的渲染效率。
10.根据权利要求1-9任一项所述的方法,其特征在于,在所述电子设备在页面滑动过程中显示第二页面之后,所述方法还包括:
所述电子设备响应于所述滑动操作的结束,显示第三页面;其中,所述第三页面包括对所述第一控件渲染后的图像。
11.根据权利要求10所述的方法,其特征在于,
所述电子设备获取所述第一控件渲染后的第四图像信息;
所述电子设备将所述第四图像信息替换最后的第二页面对应的图像信息中第一图片,得到所述第三页面。
12.一种电子设备,其特征在于,所述电子设备包括:通信模块、显示屏、存储器和一个或多个处理器;所述通信模块、所述显示屏、所述存储器和所述处理器耦合;所述存储器用于存储计算机程序代码,所述计算机程序代码包括计算机指令,当所述计算机指令被所述电子设备执行时,使得所述电子设备执行如权利要求1-11任一项所述的方法。
13.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质中存储有计算机指令,当所述计算机指令在电子设备中运行时,使得所述电子设备执行如权利要求1至11中任一项所述的方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310855298.3A CN117075786A (zh) | 2023-07-12 | 2023-07-12 | 一种页面显示方法及电子设备 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310855298.3A CN117075786A (zh) | 2023-07-12 | 2023-07-12 | 一种页面显示方法及电子设备 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN117075786A true CN117075786A (zh) | 2023-11-17 |
Family
ID=88718341
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202310855298.3A Pending CN117075786A (zh) | 2023-07-12 | 2023-07-12 | 一种页面显示方法及电子设备 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN117075786A (zh) |
Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105095200A (zh) * | 2014-04-16 | 2015-11-25 | 北大方正集团有限公司 | 以瀑布流方式显示图片的方法和设备 |
CN106776247A (zh) * | 2016-11-23 | 2017-05-31 | 腾云天宇科技(北京)有限公司 | 一种监控应用中控件的方法、服务器及*** |
US20180101295A1 (en) * | 2016-10-11 | 2018-04-12 | Salesforce.Com, Inc. | System for displaying elements of a scrollable list |
CN111340958A (zh) * | 2020-02-12 | 2020-06-26 | 广东趣炫网络股份有限公司 | 一种SrollView滑动卡顿的优化方法、装置、设备和可读存储介质 |
CN115630241A (zh) * | 2022-10-11 | 2023-01-20 | 阿里云计算有限公司 | 页面显示方法、装置、电子设备及存储介质 |
WO2023103800A1 (zh) * | 2021-12-10 | 2023-06-15 | 华为技术有限公司 | 绘制方法及电子设备 |
-
2023
- 2023-07-12 CN CN202310855298.3A patent/CN117075786A/zh active Pending
Patent Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105095200A (zh) * | 2014-04-16 | 2015-11-25 | 北大方正集团有限公司 | 以瀑布流方式显示图片的方法和设备 |
US20180101295A1 (en) * | 2016-10-11 | 2018-04-12 | Salesforce.Com, Inc. | System for displaying elements of a scrollable list |
CN106776247A (zh) * | 2016-11-23 | 2017-05-31 | 腾云天宇科技(北京)有限公司 | 一种监控应用中控件的方法、服务器及*** |
CN111340958A (zh) * | 2020-02-12 | 2020-06-26 | 广东趣炫网络股份有限公司 | 一种SrollView滑动卡顿的优化方法、装置、设备和可读存储介质 |
WO2023103800A1 (zh) * | 2021-12-10 | 2023-06-15 | 华为技术有限公司 | 绘制方法及电子设备 |
CN115630241A (zh) * | 2022-10-11 | 2023-01-20 | 阿里云计算有限公司 | 页面显示方法、装置、电子设备及存储介质 |
Non-Patent Citations (1)
Title |
---|
郝一鹏: "基于iOS的在线问诊APP患者端的设计与实现", 《中国优秀硕士学位论文全文数据库 信息科技辑》, 15 March 2018 (2018-03-15) * |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US11722449B2 (en) | Notification message preview method and electronic device | |
EP4221164A1 (en) | Display method for electronic device with flexible display and electronic device | |
US11595566B2 (en) | Camera switching method for terminal, and terminal | |
WO2021169337A1 (zh) | 屏下指纹显示方法及电子设备 | |
US20240179237A1 (en) | Screenshot Generating Method, Control Method, and Electronic Device | |
CN112671976B (zh) | 电子设备的控制方法、装置及电子设备、存储介质 | |
US20220174143A1 (en) | Message notification method and electronic device | |
WO2021180089A1 (zh) | 界面切换方法、装置和电子设备 | |
CN115016869A (zh) | 帧率调整方法、终端设备及帧率调整*** | |
US20230251814A1 (en) | Always on display method and electronic device | |
US12027112B2 (en) | Always on display method and mobile device | |
CN114089932A (zh) | 多屏显示方法、装置、终端设备及存储介质 | |
CN113641271A (zh) | 应用窗口的管理方法、终端设备及计算机可读存储介质 | |
CN113473013A (zh) | 图像美化效果的显示方法、装置和终端设备 | |
CN112578981A (zh) | 具有柔性屏幕的电子设备的控制方法及电子设备 | |
US11899929B2 (en) | Method for customizing key of foldable device, device, and storage medium | |
CN115113716A (zh) | 一种息屏显示参数的调节方法和终端设备 | |
CN117724863A (zh) | 一种目标信号处理方法和电子设备 | |
CN114375027A (zh) | 降低功耗的方法和装置 | |
CN117075786A (zh) | 一种页面显示方法及电子设备 | |
CN115185441A (zh) | 控制方法、装置、电子设备及可读存储介质 | |
CN112463086A (zh) | 一种显示控制方法及电子设备 | |
CN117130952B (zh) | 预读方法和预读装置 | |
CN116700578B (zh) | 图层合成方法、电子设备以及存储介质 | |
WO2022252786A1 (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 |