CN106504295B - 渲染图片的方法及装置 - Google Patents

渲染图片的方法及装置 Download PDF

Info

Publication number
CN106504295B
CN106504295B CN201610842081.9A CN201610842081A CN106504295B CN 106504295 B CN106504295 B CN 106504295B CN 201610842081 A CN201610842081 A CN 201610842081A CN 106504295 B CN106504295 B CN 106504295B
Authority
CN
China
Prior art keywords
picture
area
rendered
display interface
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.)
Active
Application number
CN201610842081.9A
Other languages
English (en)
Other versions
CN106504295A (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 Xiaomi Mobile Software Co Ltd
Original Assignee
Beijing Xiaomi Mobile Software 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 Xiaomi Mobile Software Co Ltd filed Critical Beijing Xiaomi Mobile Software Co Ltd
Priority to CN201610842081.9A priority Critical patent/CN106504295B/zh
Publication of CN106504295A publication Critical patent/CN106504295A/zh
Application granted granted Critical
Publication of CN106504295B publication Critical patent/CN106504295B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/002D [Two Dimensional] image generation
    • G06T11/001Texturing; Colouring; Generation of texture or colour

Landscapes

  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Controls And Circuits For Display Device (AREA)

Abstract

本公开是关于一种渲染图片的方法及装置,属于信息处理技术领域。该方法包括:获取待渲染图片的图片数据;将所述待渲染图片的图片数据划分成多个图片区域的图片数据;从所述多个图片区域的图片数据中,确定处于显示界面中的各图片区域的图片数据;根据所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域。本公开实施例将待渲染图片的图片数据划分为多个图片区域的图片数据,并根据显示界面中的各图片区域的图片数据,渲染显示界面中的各图片区域,而不是渲染整张图片,从而节约了渲染时间,节省了终端内存空间,同时避免了终端处理器资源的浪费和可能出现的页面卡顿现象。

Description

渲染图片的方法及装置
技术领域
本公开涉及信息处理技术领域,尤其涉及一种渲染图片的方法及装置。
背景技术
随着信息处理技术的快速发展,终端处理信息的功能越来越强大,终端可以根据用户需求,对各种类型的信息进行处理,比如将图片上的文字处理为纯文本,渲染图片数据等。对于图片来说,终端在显示网页或者应用中的某张图片之前,常常需要对该图片的图片数据进行渲染得到图片,然后显示该图片,之后,用户可以在网页或者应用中浏览该图片。
目前,普遍的渲染图片的方法为:终端获取到整张图片的图片数据后,先解码整张图片的图片数据,然后对解码的图片数据进行渲染,得到整张图片,然后再显示该整张图片。
发明内容
为克服相关技术中存在的问题,本公开提供一种渲染图片的方法及装置。
根据本公开实施例的第一方面,提供一种渲染图片的方法,所述方法包括:
获取待渲染图片的图片数据;
将所述待渲染图片的图片数据划分成多个图片区域的图片数据;
从所述多个图片区域的图片数据中,确定处于显示界面中的各图片区域的图片数据;
根据所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域。
可选地,所述将所述待渲染图片的图片数据划分成多个图片区域的图片数据,包括:
基于所述待渲染图片的图片数据包括的待渲染图片的尺寸,将所述待渲染图片划分成多个图片区域;
从所述待渲染图片的图片数据中,确定所述多个图片区域中的每个图片区域的图片数据。
其中,终端在渲染图片前,首先根据待渲染图片的尺寸,将待渲染图片划分成多个图片区域,从而可以只针对多个图片区域中的一部分图片区域进行渲染,而不是渲染整张图片,因此节约了渲染时间,同时由于不需要存储整张图片的渲染数据,节省了终端内存空间。
可选地,所述从所述多个图片区域的图片数据中,确定处于显示界面中的各图片区域的图片数据,包括:
确定所述待渲染图片位于所述显示界面中的显示范围;
从所述多个图片区域的图片数据中,确定与所述显示范围存在交叠的各图片区域的图片数据。
其中,终端通过确定待渲染图片位于显示界面中的显示范围,并确定与显示范围存在交叠的各图片区域的图片数据,从而可以基于与显示范围存在交叠的各图片区域的图片数据,只渲染处于显示界面中的各图片区域,而不需要渲染此时不在显示界面的图片区域,因此节约了渲染时间,同时避免了页面显示时可能出现的卡顿。
可选地,所述根据所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域,包括:
根据所述显示界面中的各图片区域的图片数据,解码所述显示界面中的各图片区域的图片数据;
基于解码的所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域。
其中,终端对显示界面中的各图片区域的图片数据进行解码,根据解码的图片数据,只渲染解码的图片区域,因此节约了解码时间和渲染时间。
可选地,所述方法还包括:
当所述渲染的图片区域移出所述显示界面时,标记所述渲染的图片区域并将所述标记的图片区域存储到预设内存空间中;
当所述预设内存空间中占用的内存大小大于预设内存大小时,释放所述预设内存空间中标记的图片区域占用的内存。
其中,当预设内存空间中占用的内存大小大于预设内存大小时,终端将移出显示界面的图片区域占用的内存释放,从而可以继续存储新的图片区域,提高渲染效率。
根据本公开实施例的第二方面,提供一种渲染图片的装置,所述装置包括:
获取模块,用于获取待渲染图片的图片数据;
划分模块,用于将所述待渲染图片的图片数据划分成多个图片区域的图片数据;
确定模块,用于从所述多个图片区域的图片数据中,确定处于显示界面中的各图片区域的图片数据;
渲染模块,用于根据所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域。
可选地,所述划分模块包括:
划分子模块,用于基于所述待渲染图片的图片数据包括的待渲染图片的尺寸,将所述待渲染图片划分成多个图片区域;
第一确定子模块,用于从所述待渲染图片的图片数据中,确定所述多个图片区域中的每个图片区域的图片数据。
可选地,所述确定模块包括:
第二确定子模块,用于确定所述待渲染图片位于所述显示界面中的显示范围;
第三确定子模块,用于从所述多个图片区域的图片数据中,确定与所述显示范围存在交叠的各图片区域的图片数据。
可选地,所述渲染模块包括:
解码子模块,用于根据所述显示界面中的各图片区域的图片数据,解码所述显示界面中的各图片区域的图片数据;
渲染子模块,用于基于解码的所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域。
可选地,所述装置还包括:
存储模块,用于当所述渲染的图片区域移出所述显示界面时,标记所述渲染的图片区域并将所述标记的图片区域存储到预设内存空间中;
释放模块,用于当所述预设内存空间中占用的内存大小大于预设内存大小时,释放所述预设内存空间中标记的图片区域占用的内存。
根据本公开实施例的第三方面,提供一种渲染图片的装置,所述装置包括:
处理器;
用于存储处理器可执行指令的存储器;
其中,所述处理器被配置为:
获取待渲染图片的图片数据;
将所述待渲染图片的图片数据划分成多个图片区域的图片数据;
从所述多个图片区域的图片数据中,确定处于显示界面中的各图片区域的图片数据;
根据所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域。
本公开的实施例提供的技术方案可以包括以下有益效果:在本公开实施例中,终端获取待渲染图片的图片数据后,将获取的待渲染图片的图片数据划分为多个图片区域的图片数据,并确定处于显示界面中的各图片区域的图片数据,根据确定的各图片区域的图片数据,渲染显示界面中的各图片区域。通过将待渲染图片划分为多个图片区域,且只渲染处于显示界面中的图片区域,而不是渲染整张图片,因此节约了渲染时间;由于不需要存储整张图片的渲染数据,节省了终端内存空间,同时避免了终端渲染大图片中不需显示的图片区域而引起的处理器资源浪费,以及终端可能出现的页面卡顿现象。
应当理解的是,以上的一般描述和后文的细节描述仅是示例性和解释性的,并不能限制本公开。
附图说明
此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本发明的实施例,并与说明书一起用于解释本发明的原理。
图1是根据一示例性实施例示出的一种渲染图片方法的流程图。
图2是根据一示例性实施例示出的一种渲染图片方法的流程图。
图3是根据一示例性实施例示出的一种划分图片区域方法的示意图。
图4是根据一示例性实施例示出的一种划分图片区域方法的示意图。
图5是根据一示例性实施例示出的网页页面、显示界面与图片区域之间的位置关系示意图。
图6A是根据一示例性实施例示出的一种渲染图片装置的框图。
图6B是根据一示例性实施例示出的一种划分模块的框图。
图6C是根据一示例性实施例示出的一种确定模块的框图。
图6D是根据一示例性实施例示出的一种渲染模块的框图。
图6E是根据一示例性实施例示出的一种渲染图片装置的框图。
图7是根据一示例性实施例示出的一种渲染图片装置的框图。
具体实施方式
这里将详细地对示例性实施例进行说明,其示例表示在附图中。下面的描述涉及附图时,除非另有表示,不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本发明相一致的所有实施方式。相反,它们仅是与如所附权利要求书中所详述的、本发明的一些方面相一致的装置和方法的例子。
在对本公开实施例进行详细的解释说明之前,先对本公开实施例的应用场景予以介绍。网页中通常会含有大量图片,当用户浏览网页时,终端需要先将图片数据解码,然后渲染待显示的图片,之后才能在屏幕上显示该图片,供用户浏览,然而,在某些情况下,终端常常不显示整张图片,而是只显示图片的一部分,比如在图片的上半部分进入显示界面,而图片的下半部分还未进入显示界面,或者图片尺寸大于显示界面尺寸的情况下,终端仍需耗费大量的时间解码整张图片的图片数据,之后的渲染整张图片也会耗费大量的时间,同时存储整张图片也会占用大量的内存,而且在终端将显示的图片存储到预设内存空间之后,由于存储图片占用的内存较大,当用户上下滑动网页时,有些图片移出显示界面,有些图片进入显示界面,使得终端的预设内存空间必须频繁清空数据,以保证能够存储新的图片数据,这样一来,处理大尺寸图片将造成终端处理器资源的浪费和页面的卡顿。因此,本公开实施例提供了一种渲染图片的方法,终端在获取待渲染图片的图片数据之后,将待渲染图片的图片数据划分为多个图片区域的图片数据,并根据显示界面中的各图片区域的图片数据,渲染显示界面中的各图片区域。而不是渲染整张图片,从而节约了渲染时间,节省了终端内存空间,同时避免了终端处理器资源的浪费和可能出现的页面卡顿现象。
图1是根据一示例性实施例示出的一种渲染图片方法的流程图,如图1所示,该渲染图片的方法用于终端中,包括以下步骤。
在步骤101中,获取待渲染图片的图片数据。
在步骤102中,将待渲染图片的图片数据划分成多个图片区域的图片数据。
在步骤103中,从多个图片区域的图片数据中,确定处于显示界面中的各图片区域的图片数据。
在步骤104中,根据显示界面中的各图片区域的图片数据,渲染显示界面中的各图片区域。
在本公开实施例中,终端获取待渲染图片的图片数据后,将获取的待渲染图片的图片数据划分为多个图片区域的图片数据,并确定处于显示界面中的各图片区域的图片数据,根据确定的各图片区域的图片数据,渲染显示界面中的各图片区域。通过将待渲染图片划分为多个图片区域,且只渲染处于显示界面中的图片区域,而不是渲染整张图片,因此节约了渲染时间;由于不需要存储整张图片的渲染数据,节省了终端内存空间,同时避免了终端渲染大图片中不需显示的图片区域而引起的处理器资源浪费,以及终端可能出现的页面卡顿现象。
可选地,将待渲染图片的图片数据划分成多个图片区域的图片数据,包括:
基于待渲染图片的图片数据包括的待渲染图片的尺寸,将待渲染图片划分成多个图片区域;
从待渲染图片的图片数据中,确定多个图片区域中的每个图片区域的图片数据。
可选地,从多个图片区域的图片数据中,确定处于显示界面中的各图片区域的图片数据,包括:
确定待渲染图片位于显示界面中的显示范围;
从多个图片区域的图片数据中,确定与显示范围存在交叠的各图片区域的图片数据。
可选地,根据显示界面中的各图片区域的图片数据,渲染显示界面中的各图片区域,包括:
根据显示界面中的各图片区域的图片数据,解码显示界面中的各图片区域的图片数据;
基于解码的显示界面中的各图片区域的图片数据,渲染显示界面中的各图片区域。
可选地,该方法还包括:
当渲染的图片区域移出显示界面时,标记渲染的图片区域并将标记的图片区域存储到预设内存空间中;
当预设内存空间中占用的内存大小大于预设内存大小时,释放预设内存空间中标记的图片区域占用的内存。
图2是根据一示例性实施例示出的一种渲染图片方法的流程图,如图2所示,该渲染图片的方法用于终端中,包括以下步骤。
在步骤201中,获取待渲染图片的图片数据。
其中,终端显示网页时,且该网页包括的图片需要在显示界面上显示时,终端需要对该图片进行渲染,渲染前终端首先要获取该图片的图片数据,终端获取待渲染图片的图片数据的实现方式可以为:当终端检测到指定操作时,向当前显示的网页对应的网站服务器发送图片数据获取请求,该图片数据获取请求中携带有待渲染图片的标识。当该网站服务器接收到终端发送的图片数据获取请求时,根据待渲染图片的标识,向终端发送待渲染图片的图片数据。
需要说明的是,该指定操作为用户在显示界面中的触发操作,用于指示终端在显示界面中显示待渲染图片,该指定操作可以为对显示界面的点击操作或者滑动操作等。
另外,待渲染图片的标识可以为待渲染图片的图片名称,当然,也可以是待渲染图片的在网站服务器上的存储地址,或者是这三者中的至少两者之间通过预设方式进行组合后的信息等等。
再者,待渲染图片的图片数据可以包括待渲染图片,网站服务器分配给待渲染图片的排版位置,以及待渲染图片的尺寸等。
需要说明的是,由于待渲染图片可以是终端当前显示的网页上的图片,也可以是终端本地存储的图片,所以,当待渲染图片为终端本地存储的图片时,终端可以直接获取本地存储的待渲染图片的图片数据,执行下述步骤202。
在步骤202中,将获取的待渲染图片的图片数据划分成多个图片区域的图片数据。
其中,终端获取到待渲染图片的图片数据之后,根据待渲染图片的图片数据包括的待渲染图片的尺寸,将待渲染图片划分成多个图片区域,然后从待渲染图片的图片数据中,确定多个图片区域中的每个图片区域的图片数据。
其中,根据待渲染图片的图片数据包括的待渲染图片的尺寸,将待渲染图片划分成多个图片区域的实现过程可以为:根据待渲染图片的图片数据包括的待渲染图片的高度和宽度,将待渲染图片纵向等分和/或横向等分为M个图片区域,M可以为任一自然数。比如,待渲染图片的高度为256像素,宽度为128像素,终端可以将待渲染图片纵向等分为4个图片区域,即M为4,得到的每个图片区域的高度为64像素,宽度为128像素,如图3所示。
需要说明的是,将待渲染图片划分成多个图片区域可以通过上述方式实现,当然,实际应用中,还可以是通过下述方式将待渲染图片划分成多个图片区域:将待渲染图片以固定尺寸大小为单位划分为多个图片区域,比如,待渲染图片的高度为256像素,宽度为128像素,终端可以以高度为100像素,宽度为128像素这一固定尺寸大小为单位,将待渲染图片纵向分为3个图片区域,如图4所示,第一图片区域的高度为100像素,宽度为128像素,第二图片区域的高度为100像素,宽度为128像素,第三图片区域的高度为56像素,宽度为128像素。
需要说明的是,上述两种实现方式只是将待渲染图片划分成多个图片区域的其中两种实现方式,当然,实际应用中,还可以是通过其他方式将待渲染图片划分成多个图片区域,本公开实施例在此就不一一列举。
在步骤203中,确定待渲染图片位于显示界面中的显示范围。
其中,终端确定页面在显示界面中的第一区域范围;根据待渲染图片在页面中的排版位置和尺寸,确定待渲染图片在页面中占用的第二区域范围;将第一区域范围和第二区域范围取交集得到待渲染图片位于显示界面中的显示范围。
需要说明的是,该显示界面为终端显示当前网页的显示窗口界面,在显示界面中可以显示当前的整个网页,或者当前网页的一部分,因此,待渲染图片位于显示界面中的显示范围可以是待渲染图片占用的第二区域范围,或者是第二区域范围的一部分。
另外,由于待渲染图片还可以是终端本地存储的图片,所以,显示界面也可以为终端显示待渲染图片的显示窗口界面。
再者,待渲染图片在页面中的排版位置可以用第二区域范围中任意一点的位置表示,比如待渲染图片在页面中的排版位置用第二区域范围中左上角一点的位置表示。
例如,当待渲染图片在页面中的排版位置为(X=1,Y=1),待渲染图片的尺寸为64像素×64像素,且待渲染图片在页面中的排版位置用第二区域范围中左上角一点的位置表示时,终端根据待渲染图片在页面中的排版位置和尺寸,确定待渲染图片在页面中占用的第二区域范围的实现方式可以为:终端根据待渲染图片在页面中的排版位置(X=1,Y=1)和尺寸64像素×64像素,确定(X=1,Y=1)、(X=65,Y=1)、(X=65,Y=65)和(X=1,Y=65)这四点依次连接后划定的区域,并将该区域确定为待渲染图片在页面中占用的第二区域范围。
在步骤204中,从多个图片区域的图片数据中,确定与显示范围存在交叠的各图片区域的图片数据。
本步骤可以为:根据第二区域范围、每个图片区域在待渲染图片中的位置和尺寸,确定每个图片区域在页面中占用的第三区域范围;从每个图片区域中,找出第三区域范围与第一区域范围存在重叠的图片区域,找出的图片区域为与显示范围存在交叠的各图片区域,并进一步确定与显示范围存在交叠的各图片区域的图片数据。
例如,如图5所示,终端将高度为256像素,宽度为128像素的待渲染图片纵向等分为第一图片区域、第二图片区域、第三图片区域和第四图片区域,且每个图片区域的高度为64像素,宽度为128像素,同时待渲染图片在显示界面中占用的显示范围为显示界面左上角高度为100像素,宽度为80像素的区域;终端根据第二区域范围、每个图片区域在待渲染图片中的位置和尺寸,确定这4个图片区域各自在页面中占用的第三区域范围,从每个图片区域中,找出第三区域范围与第一区域范围存在重叠的图片区域为第三图片区域和第四图片区域,第三图片区域和第四图片区域为与显示范围存在交叠的图片区域,并进一步确定第三图片区域的图片数据和第四图片区域的图片数据。
在步骤205中,根据与显示范围存在交叠的各图片区域的图片数据,渲染与显示范围存在交叠的各图片区域。
其中,终端首先对与显示范围存在交叠的各图片区域的图片数据进行解码,然后根据解码的各图片区域的图片数据,按照终端事先设置的渲染步骤,对与显示范围存在交叠的各图片区域进行渲染。
需要说明的是,对与显示范围存在交叠的各图片区域进行渲染之后,终端可以将渲染得到的各图片区域显示在显示界面中,除了显示渲染得到的各图片区域之外,终端还可以对渲染得到的各图片区域执行其他操作。
在步骤206中,当检测到待渲染图片被滑动时,标记滑出显示界面的各图片区域。
其中,当终端检测到用户滑动待显示图片时,从当前显示的各图片区域中,确定已经移出显示界面的图片区域,并将已经移出显示界面的图片区域标记为可废弃图片区域。
在步骤207中,将标记的图片区域存储到预设内存空间中。
其中,终端在将已经移出显示界面的图片区域标记为可废弃图片区域之后,将可废弃图片区域存储到终端的预设内存空间中。
需要说明的是,终端将可废弃图片区域存储到终端的预设内存空间中之后,当终端需要再次显示预设内存空间中存储的任一可废弃图片区域时,可以从该预设内存空间中获取该图片区域,并将该图片区域的可废弃标记删除,然后在终端屏幕上显示该图片区域。
在步骤208中,当预设内存空间中占用的内存大小大于预设内存大小时,释放标记的图片区域占用的内存。
需要说明的是,该预设内存大小可以是由终端事先设置的内存大小,比如,该预设内存大小可以为2GB(GigaByte,吉字节),当该预设内存空间中占用的内存大小大于2GB时,终端可以删除可废弃图片区域。
另外,终端删除可废弃图片区域的实现方式可以是根据可废弃图片区域在预设内存空间中的存储时间的时间长短,通过LRU(Least Recently Used,最近最少使用)算法删除,当然,实际应用中,终端还可以通过其他方式删除可废弃图片区域。
在本公开实施例中,终端首先获取待渲染图片的图片数据,之后,将获取的待渲染图片的图片数据划分为多个图片区域的图片数据,在确定待渲染图片位于显示界面中的显示范围之后,确定与显示范围存在交叠的各图片区域的图片数据,并对确定的各图片区域的图片数据进行解码,然后根据解码的图片数据,渲染显示界面中的各图片区域,当渲染的各图片区域移出显示界面时,将移出显示界面的各图片区域标记为可废弃图片区域,当预设内存空间中占用的内存大小大于预设内存大小时,删除可废弃图片区域。本公开实施例通过将大尺寸图片划分为小尺寸的图片区域,并且只解码和渲染显示界面中的图片区域,从而节约了解码时间和渲染时间,节省了渲染时耗费的终端内存空间,同时避免了终端因解码和渲染当前不显示的图片区域而引起的处理器资源的浪费,以及可能出现的页面卡顿现象。
图6A是根据一示例性实施例示出的一种渲染图片装置600的框图。参照图6,该装置包括获取模块601,划分模块602、确定模块603和渲染模块604。
获取模块601,用于获取待渲染图片的图片数据;
划分模块602,用于将待渲染图片的图片数据划分成多个图片区域的图片数据;
确定模块603,用于从多个图片区域的图片数据中,确定处于显示界面中的各图片区域的图片数据;
渲染模块604,用于根据显示界面中的各图片区域的图片数据,渲染显示界面中的各图片区域。
可选地,参见图6B,划分模块602包括:
划分子模块6021,用于基于待渲染图片的图片数据包括的待渲染图片的尺寸,将待渲染图片划分成多个图片区域;
第一确定子模块6022,用于从待渲染图片的图片数据中,确定多个图片区域中的每个图片区域的图片数据。
可选地,参见图6C,确定模块603包括:
第二确定子模块6031,用于确定待渲染图片位于显示界面中的显示范围;
第三确定子模块6032,用于从多个图片区域的图片数据中,确定与显示范围存在交叠的各图片区域的图片数据。
可选地,参见图6D,渲染模块604包括:
解码子模块6041,用于根据显示界面中的各图片区域的图片数据,解码显示界面中的各图片区域的图片数据;
渲染子模块6042,用于基于解码的显示界面中的各图片区域的图片数据,渲染显示界面中的各图片区域。
可选地,参见图6E,该渲染图片装置600还包括:
存储模块605,用于当渲染的图片区域移出显示界面时,标记渲染的图片区域并将标记的图片区域存储到预设内存空间中;
释放模块606,用于当预设内存空间中占用的内存大小大于预设内存大小时,释放预设内存空间中标记的图片区域占用的内存。
在本公开实施例中,终端获取待渲染图片的图片数据后,将获取的待渲染图片的图片数据划分为多个图片区域的图片数据,并确定处于显示界面中的各图片区域的图片数据,根据确定的各图片区域的图片数据,渲染显示界面中的各图片区域。通过将待渲染图片划分为多个图片区域,且只渲染处于显示界面中的图片区域,而不是渲染整张图片,因此节约了渲染时间;由于不需要存储整张图片的渲染数据,节省了终端内存空间,同时避免了终端渲染大图片中不需显示的图片区域而引起的处理器资源浪费,以及终端可能出现的页面卡顿现象。
关于上述实施例中的装置,其中各个模块执行操作的具体方式已经在有关该方法的实施例中进行了详细描述,此处将不做详细阐述说明。
图7是根据一示例性实施例示出的一种用于渲染图片的装置700的框图。例如,装置700可以是移动电话,计算机,数字广播终端,消息收发设备,游戏控制台,平板设备,医疗设备,健身设备,个人数字助理等。
参照图7,装置700可以包括以下一个或多个组件:处理组件702,存储器704,电源组件706,多媒体组件708,音频组件710,输入/输出(I/O)的接口712,传感器组件714,以及通信组件716。
处理组件702通常控制装置700的整体操作,诸如与显示,电话呼叫,数据通信,相机操作和记录操作相关联的操作。处理组件702可以包括一个或多个处理器720来执行指令,以完成上述的方法的全部或部分步骤。此外,处理组件702可以包括一个或多个模块,便于处理组件702和其他组件之间的交互。例如,处理组件702可以包括多媒体模块,以方便多媒体组件708和处理组件702之间的交互。
存储器704被配置为存储各种类型的数据以支持在装置700的操作。这些数据的示例包括用于在装置700上操作的任何应用程序或方法的指令,联系人数据,电话簿数据,消息,图片,视频等。存储器704可以由任何类型的易失性或非易失性存储设备或者它们的组合实现,如静态随机存取存储器(SRAM),电可擦除可编程只读存储器(EEPROM),可擦除可编程只读存储器(EPROM),可编程只读存储器(PROM),只读存储器(ROM),磁存储器,快闪存储器,磁盘或光盘。
电源组件706为装置700的各种组件提供电源。电源组件706可以包括电源管理系统,一个或多个电源,及其他与为装置700生成、管理和分配电源相关联的组件。
多媒体组件708包括在所述装置700和用户之间的提供一个输出接口的屏幕。在一些实施例中,屏幕可以包括液晶显示器(LCD)和触摸面板(TP)。如果屏幕包括触摸面板,屏幕可以被实现为触摸屏,以接收来自用户的输入信号。触摸面板包括一个或多个触摸传感器以感测触摸、滑动和触摸面板上的手势。所述触摸传感器可以不仅感测触摸或滑动动作的边界,而且还检测与所述触摸或滑动操作相关的持续时间和压力。在一些实施例中,多媒体组件708包括一个前置摄像头和/或后置摄像头。当装置700处于操作模式,如拍摄模式或视频模式时,前置摄像头和/或后置摄像头可以接收外部的多媒体数据。每个前置摄像头和后置摄像头可以是一个固定的光学透镜系统或具有焦距和光学变焦能力。
音频组件710被配置为输出和/或输入音频信号。例如,音频组件710包括一个麦克风(MIC),当装置700处于操作模式,如呼叫模式、记录模式和语音识别模式时,麦克风被配置为接收外部音频信号。所接收的音频信号可以被进一步存储在存储器704或经由通信组件716发送。在一些实施例中,音频组件710还包括一个扬声器,用于输出音频信号。
I/O接口712为处理组件702和外围接口模块之间提供接口,上述外围接口模块可以是键盘,点击轮,按钮等。这些按钮可包括但不限于:主页按钮、音量按钮、启动按钮和锁定按钮。
传感器组件714包括一个或多个传感器,用于为装置700提供各个方面的状态评估。例如,传感器组件714可以检测到装置700的打开/关闭状态,组件的相对定位,例如所述组件为装置700的显示器和小键盘,传感器组件714还可以检测装置700或装置700一个组件的位置改变,用户与装置700接触的存在或不存在,装置700方位或加速/减速和装置700的温度变化。传感器组件714可以包括接近传感器,被配置用来在没有任何的物理接触时检测附近物体的存在。传感器组件714还可以包括光传感器,如CMOS或CCD图像传感器,用于在成像应用中使用。在一些实施例中,该传感器组件714还可以包括加速度传感器,陀螺仪传感器,磁传感器,压力传感器或温度传感器。
通信组件716被配置为便于装置700和其他设备之间有线或无线方式的通信。装置700可以接入基于通信标准的无线网络,如WiFi,2G或3G,或它们的组合。在一个示例性实施例中,通信组件716经由广播信道接收来自外部广播管理系统的广播信号或广播相关信息。在一个示例性实施例中,所述通信组件716还包括近场通信(NFC)模块,以促进短程通信。例如,在NFC模块可基于射频识别(RFID)技术,红外数据协会(IrDA)技术,超宽带(UWB)技术,蓝牙(BT)技术和其他技术来实现。
在示例性实施例中,装置700可以被一个或多个应用专用集成电路(ASIC)、数字信号处理器(DSP)、数字信号处理设备(DSPD)、可编程逻辑器件(PLD)、现场可编程门阵列(FPGA)、控制器、微控制器、微处理器或其他电子元件实现,用于执行上述方法。
在示例性实施例中,还提供了一种包括指令的非临时性计算机可读存储介质,例如包括指令的存储器704,上述指令可由装置700的处理器720执行以完成上述方法。例如,所述非临时性计算机可读存储介质可以是ROM、随机存取存储器(RAM)、CD-ROM、磁带、软盘和光数据存储设备等。
一种非临时性计算机可读存储介质,当所述存储介质中的指令由移动终端的处理器执行时,使得移动终端能够执行一种渲染图片的方法,所述方法包括:
获取待渲染图片的图片数据;
将待渲染图片的图片数据划分成多个图片区域的图片数据;
从多个图片区域的图片数据中,确定处于显示界面中的各图片区域的图片数据;
根据显示界面中的各图片区域的图片数据,渲染显示界面中的各图片区域。
可选地,将待渲染图片的图片数据划分成多个图片区域的图片数据,包括:
基于待渲染图片的图片数据包括的待渲染图片的尺寸,将待渲染图片划分成多个图片区域;
从待渲染图片的图片数据中,确定多个图片区域中的每个图片区域的图片数据。
可选地,从多个图片区域的图片数据中,确定处于显示界面中的各图片区域的图片数据,包括:
确定待渲染图片位于显示界面中的显示范围;
从多个图片区域的图片数据中,确定与显示范围存在交叠的各图片区域的图片数据。
可选地,根据显示界面中的各图片区域的图片数据,渲染显示界面中的各图片区域,包括:
根据显示界面中的各图片区域的图片数据,解码显示界面中的各图片区域的图片数据;
基于解码的显示界面中的各图片区域的图片数据,渲染显示界面中的各图片区域。
可选地,方法还包括:
当渲染的图片区域移出显示界面时,标记渲染的图片区域并将标记的图片区域存储到预设内存空间中;
当预设内存空间中占用的内存大小大于预设内存大小时,释放预设内存空间中标记的图片区域占用的内存。
在本公开实施例中,终端获取待渲染图片的图片数据后,将获取的待渲染图片的图片数据划分为多个图片区域的图片数据,并确定处于显示界面中的各图片区域的图片数据,根据确定的各图片区域的图片数据,渲染显示界面中的各图片区域。通过将待渲染图片划分为多个图片区域,且只渲染处于显示界面中的图片区域,而不是渲染整张图片,因此节约了渲染时间;由于不需要存储整张图片的渲染数据,节省了终端内存空间,同时避免了终端渲染大图片中不需显示的图片区域而引起的处理器资源浪费,以及终端可能出现的页面卡顿现象。
本领域技术人员在考虑说明书及实践这里公开的发明后,将容易想到本发明的其它实施方案。本申请旨在涵盖本发明的任何变型、用途或者适应性变化,这些变型、用途或者适应性变化遵循本发明的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的,本发明的真正范围和精神由下面的权利要求指出。
应当理解的是,本发明并不局限于上面已经描述并在附图中示出的精确结构,并且可以在不脱离其范围进行各种修改和改变。本发明的范围仅由所附的权利要求来限制。

Claims (3)

1.一种渲染图片的方法,其特征在于,所述方法包括:
在检测到指定操作时,向网站服务器发送图片数据获取请求,所述图片数据获取请求中携带有待渲染图片的标识,所述指定操作为用户在显示界面中的触发操作,所述指定操作用于指示终端在所述显示界面中显示所述待渲染图片;接收所述网站服务器发送的所述待渲染图片的图片数据,所述待渲染图片为部分区域进入所述显示界面的图片,所述图片数据包括所述待渲染图片、所述网站服务器分配给所述待渲染图片在网页页面中的排版位置和所述待渲染图片的尺寸;
基于所述待渲染图片的尺寸,将所述待渲染图片划分成多个图片区域;从所述待渲染图片的图片数据中,确定所述多个图片区域中的每个图片区域的图片数据;
确定所述网页页面在所述显示界面中的第一区域范围;根据所述待渲染图片的排版位置和尺寸,确定所述待渲染图片在所述网页页面中占用的第二区域范围;将所述第一区域范围和所述第二区域范围的交集区域范围,确定为所述待渲染图片位于所述显示界面中的显示范围;
基于所述第二区域范围以及所述每个图片区域在所述待渲染图片中的位置和尺寸,确定所述每个图片区域在所述网页页面中占用的第三区域范围,从所述每个图片区域中,确定与所述显示范围存在交叠的各图片区域的图片数据;
根据所述显示界面中的各图片区域的图片数据,解码所述显示界面中的各图片区域的图片数据,基于解码的所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域;
所述方法还包括:
当检测到用户滑动待显示图片时,从当前显示的各图片区域中,确定已经移出所述显示界面的图片区域,将已经移出所述显示界面的图片区域标记为可废弃图片区域,并将标记的图片区域存储到预设内存空间中;
当所述终端检测到用户对所述标记的图片区域执行显示操作时,从所述预设内存空间中获取所述标记的图片区域,删除所述标记并将删除所述标记后的所述图片区域显示在所述显示界面中;
当所述预设内存空间中占用的内存大小大于预设内存大小时,释放所述预设内存空间中标记的图片区域占用的内存。
2.一种渲染图片的装置,其特征在于,所述装置包括:
获取模块,用于获取待渲染图片的图片数据,所述待渲染图片为部分区域进入显示界面的图片,所述图片数据包括所述待渲染图片、网站服务器分配给所述待渲染图片在网页页面中的排版位置和所述待渲染图片的尺寸;
划分模块,用于基于所述待渲染图片的图片数据包括的待渲染图片的尺寸,将所述待渲染图片划分成多个图片区域,并从所述待渲染图片的图片数据中,确定所述多个图片区域中的每个图片区域的图片数据;
确定模块,用于确定所述网页页面在所述显示界面中的第一区域范围,根据所述待渲染图片的排版位置和尺寸,确定所述待渲染图片在所述网页页面中占用的第二区域范围,将所述第一区域范围和所述第二区域范围的交集区域范围,确定为所述待渲染图片位于所述显示界面中的显示范围,基于所述第二区域范围以及所述每个图片区域在所述待渲染图片中的位置和尺寸,确定所述每个图片区域在所述网页页面中占用的第三区域范围,从所述每个图片区域中,确定与所述显示范围存在交叠的各图片区域的图片数据;
渲染模块,用于根据所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域;
所述装置还包括:
存储模块,用于当检测到用户滑动待显示图片时,从当前显示的各图片区域中,确定已经移出所述显示界面的图片区域,将已经移出所述显示界面的图片区域标记为可废弃图片区域,并将标记的图片区域存储到预设内存空间中;
释放模块,用于当所述预设内存空间中占用的内存大小大于预设内存大小时,释放所述预设内存空间中标记的图片区域占用的内存;
所述装置还包括执行当终端检测到用户对所述标记的图片区域执行显示操作时,从所述预设内存空间中获取所述标记的图片区域,删除所述标记并将删除所述标记后的所述图片区域显示在所述显示界面中的模块;
所述渲染模块包括:
解码子模块,用于根据所述显示界面中的各图片区域的图片数据,解码所述显示界面中的各图片区域的图片数据;
渲染子模块,用于基于解码的所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域;
所述获取模块,还用于:
在检测到指定操作时,向所述网站服务器发送图片数据获取请求,所述图片数据获取请求中携带有所述待渲染图片的标识,所述指定操作为用户在所述显示界面中的触发操作,所述指定操作用于指示所述终端在所述显示界面中显示所述待渲染图片;接收所述网站服务器发送的所述待渲染图片的图片数据。
3.一种渲染图片的装置,其特征在于,所述装置包括:
处理器;
用于存储处理器可执行指令的存储器;
其中,所述处理器被配置为:
在检测到指定操作时,向网站服务器发送图片数据获取请求,所述图片数据获取请求中携带有待渲染图片的标识,所述指定操作为用户在显示界面中的触发操作,所述指定操作用于指示终端在所述显示界面中显示所述待渲染图片;接收所述网站服务器发送的所述待渲染图片的图片数据,所述待渲染图片为部分区域进入所述显示界面的图片,所述图片数据包括所述待渲染图片、所述网站服务器分配给所述待渲染图片在网页页面中的排版位置和所述待渲染图片的尺寸;
基于所述待渲染图片的图片数据包括的待渲染图片的尺寸,将所述待渲染图片划分成多个图片区域;从所述待渲染图片的图片数据中,确定所述多个图片区域中的每个图片区域的图片数据;
确定所述网页页面在所述显示界面中的第一区域范围;根据所述待渲染图片的排版位置和尺寸,确定所述待渲染图片在所述网页页面中占用的第二区域范围;将所述第一区域范围和所述第二区域范围的交集区域范围,确定为所述待渲染图片位于所述显示界面中的显示范围;
基于所述第二区域范围以及所述每个图片区域在所述待渲染图片中的位置和尺寸,确定所述每个图片区域在所述网页页面中占用的第三区域范围,从所述每个图片区域中,确定与所述显示范围存在交叠的各图片区域的图片数据;
根据所述显示界面中的各图片区域的图片数据,解码所述显示界面中的各图片区域的图片数据,基于解码的所述显示界面中的各图片区域的图片数据,渲染所述显示界面中的各图片区域;
所述处理器还被配置为:
当检测到用户滑动待显示图片时,从当前显示的各图片区域中,确定已经移出所述显示界面的图片区域,将已经移出所述显示界面的图片区域标记为可废弃图片区域,并将标记的图片区域存储到预设内存空间中;
当所述终端检测到用户对所述标记的图片区域执行显示操作时,从所述预设内存空间中获取所述标记的图片区域,删除所述标记并将删除所述标记后的所述图片区域显示在所述显示界面中;
当所述预设内存空间中占用的内存大小大于预设内存大小时,释放所述预设内存空间中标记的图片区域占用的内存。
CN201610842081.9A 2016-09-22 2016-09-22 渲染图片的方法及装置 Active CN106504295B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201610842081.9A CN106504295B (zh) 2016-09-22 2016-09-22 渲染图片的方法及装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201610842081.9A CN106504295B (zh) 2016-09-22 2016-09-22 渲染图片的方法及装置

Publications (2)

Publication Number Publication Date
CN106504295A CN106504295A (zh) 2017-03-15
CN106504295B true CN106504295B (zh) 2020-11-10

Family

ID=58290450

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201610842081.9A Active CN106504295B (zh) 2016-09-22 2016-09-22 渲染图片的方法及装置

Country Status (1)

Country Link
CN (1) CN106504295B (zh)

Families Citing this family (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108665507A (zh) * 2017-03-31 2018-10-16 珠海金山办公软件有限公司 一种图片透明色设置方法及装置
CN108241118B (zh) * 2017-11-10 2020-08-18 精华电子(苏州)有限公司 一种pcb连板贴片加工系统及方法
CN108510428A (zh) * 2018-03-09 2018-09-07 广东欧珀移动通信有限公司 图片绘制方法及相关产品
CN114022590B (zh) * 2020-12-30 2023-03-24 万翼科技有限公司 图片渲染方法及相关设备
CN114356479B (zh) * 2021-12-27 2024-03-08 珠海豹趣科技有限公司 一种页面渲染方法及装置

Citations (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN105701106A (zh) * 2014-11-27 2016-06-22 广州市动景计算机科技有限公司 网页更新方法及装置

Family Cites Families (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101963984A (zh) * 2010-09-28 2011-02-02 北京伟库电子商务科技有限公司 页面局部区块渲染方法和系统
US9928646B2 (en) * 2013-07-31 2018-03-27 Longsand Limited Rendering hierarchical visualizations of data sets
CN104679509B (zh) * 2015-02-06 2019-11-15 腾讯科技(深圳)有限公司 一种渲染图形的方法和装置

Patent Citations (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN105701106A (zh) * 2014-11-27 2016-06-22 广州市动景计算机科技有限公司 网页更新方法及装置

Also Published As

Publication number Publication date
CN106504295A (zh) 2017-03-15

Similar Documents

Publication Publication Date Title
CN106504295B (zh) 渲染图片的方法及装置
CN104636106B (zh) 图片显示方法和装置、终端设备
EP3128411B1 (en) Interface display method, terminal, computer program and recording medium
US20170139555A1 (en) Method and device for displaying a message
CN105094539B (zh) 参考信息显示方法和装置
CN104238911A (zh) 加载图标显示方法和装置
JP6159892B2 (ja) カーソルの位置決め方法、装置、プログラム、及び記録媒体
CN106095236A (zh) 整理桌面图标的方法及装置
US20210042978A1 (en) Method and device for generating stickers
CN107729098B (zh) 用户界面显示方法及装置
CN105205093B (zh) 图库中图片处理的方法及装置
CN110085066B (zh) 展示阅读信息的方法、装置及电子设备
CN107179837B (zh) 输入方法及装置
CN106126050B (zh) 菜单显示方法及装置
CN107123078A (zh) 显示图像的方法及装置
CN105808102B (zh) 添加边框的方法及装置
CN107390929A (zh) 触控系统的控制方法、装置及存储介质
CN107832112B (zh) 壁纸设置方法及装置
CN105682187A (zh) 图标显示方法及装置
CN109144287B (zh) 一种设置输入法界面的方法及装置
CN105677406A (zh) 应用操作方法及装置
CN111092971A (zh) 一种显示方法、装置和用于显示的装置
CN105975188B (zh) 图片位置调整方法及装置
CN110941670B (zh) 标记状态检测方法、装置、设备及存储介质
CN107562348B (zh) 内容显示方法及装置

Legal Events

Date Code Title Description
C06 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