CN112286472A - Ui显示方法及显示设备 - Google Patents

Abstract

本申请公开了一种UI显示方法及显示设备，用以减少重新绘制无需更新的UI元素导致的系统资源的浪费。该显示设备包括：显示器；与所述显示器耦合的控制器，被配置执行：创建至少两个存储区域；对于待显示的每一UI元素，从所述至少两个存储区域中确定一个用于绘制该UI元素的存储区域，并将该UI元素绘制在确定出的存储区域中；绘制完全部待显示的UI元素后，将所述至少两个存储区域中的内容叠加显示；当目标存储区域中的UI元素需要更新时，在所述目标存储区域中重新绘制更新后的UI元素以及与更新的UI元素相关联的UI元素；完成重新绘制后，将所述至少两个存储区域中的内容叠加显示。

Description

UI显示方法及显示设备

技术领域

本申请涉及显示技术领域，尤其涉及一种UI显示方法及显示设备。

背景技术

显示设备在显示用户界面(User Interface，UI)时，通常将UI待显示的各UI元素如图片、文本等绘制在内存中预先划分出的存储区域中，然后将该存储区域中绘制的内容通过显示器显示。

在更新当前显示的UI中的部分UI元素时，为避免仅重新绘制该部分UI元素导致UI显示效果走样，显示设备通常将上述存储区域内已绘制的内容全部清空，并重新在该存储区域内绘制各UI元素。但每次更新部分UI元素时均重新绘制全部UI元素，会浪费大量系统资源，甚至影响显示设备的核心功能。

发明内容

本申请实施例提供一种UI显示方法及显示设备，用以减少重新绘制UI元素导致的系统资源的浪费。

第一方面，提供一种显示设备，包括：

显示器；

与上述显示器耦合的控制器，被配置执行：

创建至少两个存储区域；

对于待显示的每一UI元素，从上述至少两个存储区域中确定一个用于绘制该UI元素的存储区域，并将该UI元素绘制在确定出的存储区域中；绘制完全部待显示的UI元素后，将上述至少两个存储区域中的内容叠加显示；

当上述至少两个存储区域中目标存储区域中的UI元素需要更新时，在所述目标存储区域中重新绘制更新后的UI元素以及与更新的UI元素相关联的UI元素；完成重新绘制后，将所述至少两个存储区域中的内容叠加显示。

第二方面，提供一种UI显示方法，包括：

创建至少两个存储区域；

对于待显示的每一UI元素，从上述至少两个存储区域中确定一个用于绘制该UI元素的存储区域，并将该UI元素绘制在确定出的存储区域中；绘制完全部待显示的UI元素后，将上述至少两个存储区域中的内容叠加显示；

当上述至少两个存储区域中目标存储区域中的UI元素需要更新时，在所述目标存储区域中重新绘制更新后的UI元素以及与更新的UI元素相关联的UI元素；完成重新绘制后，将所述至少两个存储区域中的内容叠加显示。

上述实施例中，显示设备通过将待显示的UI元素分别绘制不同的存储区域中，当需要更新UI元素时，可以仅对绘制有该UI元素的存储区域内的UI元素重新绘制，而无需重新绘制其他存储区域内的UI元素。由此可以有效减少部分UI元素更新时重新绘制UI元素导致的系统资源的浪费。

附图说明

图1A中示例性示出了显示设备200与控制装置100之间操作场景的示意图；

图1B中示例性示出了图1A中控制装置100的配置框图；

图1C中示例性示出了图1A中显示设备200的配置框图；

图1D中示例性示出了显示设备200存储器中操作系统的架构配置框图；

图2中示例性示出了UI元素更新示意图；

图3中示例性示出了UI显示方法流程图；

图4中示例性示出了基于图3所示流程的UI显示示意图；

图5中示例性示出了存储区域确定流程图。

具体实施方式

为使本申请示例性实施例的目的、技术方案和优点更加清楚，下面将结合本申请示例性实施例中的附图，对本申请示例性实施例中的技术方案进行清楚、完整地描述，显然，所描述的示例性实施例仅是本申请一部分实施例，而不是全部的实施例。

基于本申请中示出的示例性实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。此外，虽然本申请中公开内容按照示范性一个或几个实例来介绍，但应理解，可以就这些公开内容的各个方面也可以单独构成一个完整技术方案。

本申请中使用的术语“包括”和“具有”以及他们的任何变形，意图在于覆盖但不排他的包含，例如，包含了一系列组件的产品或设备不必限于清楚地列出的那些组件，而是可包括没有清楚地列出的或对于这些产品或设备固有的其它组件。

本申请中使用的术语“模块”，是指任何已知或后来开发的硬件、软件、固件、人工智能、模糊逻辑或硬件或/和软件代码的组合，能够执行与该元件相关的功能。

本申请中使用的术语“手势”，是指用户通过一种手型的变化或手部运动等动作，用于表达预期想法、动作、目的/或结果的用户行为。

为便于理解本申请实施例提供的UI显示方法及显示设备，下面对显示设备的结构、显示设备和控制装置的交互进行举例说明：

图1A中示例性示出了显示设备200与控制装置100之间操作场景的示意图。如图1A所示，控制装置100和显示设备200之间可以有线或无线方式进行通信。

其中，控制装置100被配置为控制显示设备200，其可接收用户输入的操作指令，且将操作指令转换为显示设备200可识别和响应的指令，起着用户与显示设备200之间交互的中介作用。如：用户通过操作控制装置100上频道加减键，显示设备200响应频道加减的操作。

控制装置100可以是遥控器100A，包括红外协议通信或蓝牙协议通信，及其他短距离通信方式等，通过无线或其他有线方式来控制显示设备200。用户可以通过遥控器上按键、语音输入、控制面板输入等输入用户指令，来控制显示设备200。如：用户可以通过遥控器上音量加减键、频道控制键、上/下/左/右的移动按键、语音输入按键、菜单键、开关机按键等输入相应控制指令，来实现控制显示设备200的功能。

控制装置100也可以是智能设备，如移动终端100B、平板电脑、计算机、笔记本电脑等。例如，使用在智能设备上运行的应用程序控制显示设备200。该应用程序通过配置可以在与智能设备关联的屏幕上，通过直观的用户界面(UI)为用户提供各种控制。

示例性的，移动终端100B可与显示设备200安装软件应用，通过网络通信协议实现连接通信，实现一对一控制操作的和数据通信的目的。如：可以使移动终端100B与显示设备200建立控制指令协议，通过操作移动终端100B上提供的用户界面的各种功能键或虚拟按钮，来实现如遥控器100A布置的实体按键的功能。也可以将移动终端100B上显示的音视频内容传输到显示设备200上，实现同步显示功能。

显示设备200可被实施为电视，可提供广播接收电视功能以及计算机支持功能的智能网络电视功能。显示设备示例的包括，数字电视、网络电视、智能电视、互联网协议电视(IPTV)等。

显示设备200，可以是液晶显示器、有机发光显示器、投影显示设备。具体显示设备类型、尺寸大小和分辨率等不作限定。

显示设备200还与服务器300通过多种通信方式进行数据通信。这里可允许显示设备200通过局域网(LAN)、无线局域网(WLAN)和其他网络进行通信连接。服务器300可以向显示设备200提供各种内容和互动。示例的，显示设备200可以发送和接收信息，例如：接收电子节目指南(EPG)数据、接收软件程序更新、或访问远程储存的数字媒体库。服务器300可以一组，也可以多组，可以一类或多类服务器。通过服务器300提供视频点播和广告服务等其他网络服务内容。

图1B中示例性示出了控制装置100的配置框图。如图1B所示，控制装置100包括控制器110、存储器120、通信器130、用户输入接口140、输出接口150、供电电源160。

控制器110包括随机存取存储器(RAM)111、只读存储器(ROM)112、处理器113、通信接口以及通信总线。控制器110用于控制控制装置100的运行和操作，以及内部各部件之间的通信协作、外部和内部的数据处理功能。

示例性的，当检测到用户按压在遥控器100A上布置的按键的交互或触摸在遥控器100A上布置的触摸面板的交互时，控制器110可控制产生与检测到的交互相应的信号，并将该信号发送到显示设备200。

存储器120，用于在控制器110的控制下存储驱动和控制控制装置100的各种运行程序、数据和应用。存储器120，可以存储用户输入的各类控制信号指令。

通信器130在控制器110的控制下，实现与显示设备200之间控制信号和数据信号的通信。如：控制装置100经由通信器130将控制信号(例如触摸信号或按钮信号)发送至显示设备200上，控制装置100可经由通信器130接收由显示设备200发送的信号。通信器130可以包括红外信号接口131和射频信号接口132。例如：红外信号接口时，需要将用户输入指令按照红外控制协议转化为红外控制信号，经红外发送模块进行发送至显示设备200。再如：射频信号接口时，需将用户输入指令转化为数字信号，然后按照射频控制信号调制协议进行调制后，由射频发送端子发送至显示设备200。

用户输入接口140，可包括麦克风141、触摸板142、传感器143、按键144等中至少一者，从而用户可以通过语音、触摸、手势、按压等将关于控制显示设备200的用户指令输入到控制装置100。

输出接口150，通过将用户输入接口140接收的用户指令输出至显示设备200，或者，输出由显示设备200接收的图像或语音信号。这里，输出接口150可以包括LED接口151、产生振动的振动接口152、输出声音的声音输出接口153和输出图像的显示器154等。例如，遥控器100A可从输出接口150接收音频、视频或数据等输出信号，并且将输出信号在显示器154上显示为图像形式、在声音输出接口153输出为音频形式或在振动接口152输出为振动形式。

供电电源160，用于在控制器110的控制下为控制装置100各元件提供运行电力支持。形式可以为电池及相关控制电路。

图1C中示例性示出了显示设备200的硬件配置框图。如图1C所示，显示设备200中可以进一步包括调谐解调器210、通信器220、检测器230、外部装置接口240、控制器250、存储器260、用户接口265、视频处理器270、显示器275、音频处理器280、音频输入接口285、供电电源290。

调谐解调器210，通过有线或无线方式接收广播电视信号，可以进行放大、混频和谐振等调制解调处理，用于从多个无线或有线广播电视信号中解调出用户所选择的电视频道的频率中所携带的音视频信号，以及附加信息(例如EPG数据)。

调谐解调器210，可根据用户选择，以及由控制器250控制，响应用户选择的电视频道的频率以及该频率所携带的电视信号。

调谐解调器210，根据电视信号的广播制式不同，可以接收信号的途径有很多种，诸如：地面广播、有线广播、卫星广播或互联网广播等；以及根据调制类型不同，可以数字调制方式或模拟调制方式；以及根据接收电视信号的种类不同，可以解调模拟信号和数字信号。

在其他一些示例性实施例中，调谐解调器210也可在外部设备中，如外部机顶盒等。这样，机顶盒通过调制解调后输出电视信号，经过外部装置接口240输入至显示设备200中。

通信器220，是用于根据各种通信协议类型与外部设备或外部服务器进行通信的组件。例如显示设备200可将内容数据发送至经由通信器220连接的外部设备，或者，从经由通信器220连接的外部设备浏览和下载内容数据。通信器220可以包括WIFI模块221、蓝牙通信协议模块222、有线以太网通信协议模块223等网络通信协议模块或近场通信协议模块，从而通信器220可根据控制器250的控制接收控制装置100的控制信号，并将控制信号实现为WIFI信号、蓝牙信号、射频信号等。

检测器230，是显示设备200用于采集外部环境或与外部交互的信号的组件。检测器230可以包括图像采集器231，如相机、摄像头等，可以用于采集外部环境场景，以自适应变化显示设备200的显示参数；以及用于采集用户的属性或与用户交互手势，以实现显示设备与用户之间互动的功能。还可以包括光接收器232，用于采集环境光线强度，以自适应显示设备200的显示参数变化等。

在其他一些示例性实施例中，检测器230，还可以包括温度传感器，如通过感测环境温度，显示设备200可自适应调整图像的显示色温。示例性的，当温度偏高的环境时，可调整显示设备200显示图像色温偏冷色调；当温度偏低的环境时，可以调整显示设备200显示图像色温偏暖色调。

在其他一些示例性实施例中，检测器230，还可以包括声音采集器，如麦克风，可以用于接收用户的声音，如用户控制显示设备200的控制指令的语音信号；或者，可以采集用于识别环境场景类型的环境声音，实现显示设备200可以自适应环境噪声。

外部装置接口240，是提供控制器210控制显示设备200与外部设备间数据传输的组件。外部装置接口240可按照有线/无线方式与诸如机顶盒、游戏装置、笔记本电脑等外部设备连接，可接收外部设备的诸如视频信号(例如运动图像)、音频信号(例如音乐)、附加信息(例如EPG)等数据。

其中，外部装置接口240可以包括：高清多媒体接口(HDMI)端子241、复合视频消隐同步(CVBS)端子242、模拟或数字分量端子243、通用串行总线(USB)端子244、组件(Component)端子(图中未示出)、红绿蓝(RGB)端子(图中未示出)等任一个或多个。

控制器250，通过运行存储在存储器260上的各种软件控制程序(如操作系统和各种应用程序)，来控制显示设备200的工作和响应用户的操作。

如图1C所示，控制器250包括随机存取存储器(RAM)251、只读存储器(ROM)252、图形处理器253、CPU处理器254、通信接口255、以及通信总线256。其中，RAM251、ROM252以及图形处理器253、CPU处理器254通信接口255通过通信总线256相连接。

ROM252，用于存储各种系统启动指令。如在接收到开机信号时，显示设备200电源开始启动，CPU处理器254运行ROM252中的系统启动指令，将存储在存储器260的操作系统拷贝至RAM251中，以开始运行启动操作系统。当操作系统启动完成后，CPU处理器254再将存储器260中各种应用程序拷贝至RAM251中，然后，开始运行启动各种应用程序。

图形处理器253，用于产生各种图形对象的屏幕图像，如图标、图像以及操作菜单等。图形处理器253可以包括运算器，用于通过接收用户输入各种交互指令进行运算，进而根据显示属性显示各种对象；以及包括渲染器，用于产生基于运算器得到的各种对象，将进行渲染的结果显示在显示器275上。

CPU处理器254，用于执行存储在存储器260中的操作系统和应用程序指令。以及根据接收的用户输入指令，来执行各种应用程序、数据和内容的处理，以便最终显示和播放各种音视频内容。

在一些示例性实施例中，CPU处理器254，可以包括多个处理器。多个处理器可包括一个主处理器以及多个或一个子处理器。主处理器，用于在显示设备预加载模式中执行显示设备200的一些初始化操作，和/或，在正常模式下显示画面的操作。多个或一个子处理器，用于执行在显示设备待机模式等状态下的一种操作。

通信接口255，可包括第一接口到第n接口。这些接口可以是经由网络被连接到外部设备的网络接口。

控制器250可以控制显示设备200的整体操作。例如：响应于接收到用于选择在显示器275上显示的GUI对象的用户输入命令，控制器250便可以执行与由用户输入命令选择的对象有关的操作。

其中，该对象可以是可选对象中的任何一个，例如超链接或图标。该与所选择的对象有关的操作，例如显示连接到超链接页面、文档、图像等操作，或者执行与图标相对应的程序的操作。该用于选择GUI对象的用户输入命令，可以是通过连接到显示设备200的各种输入装置(例如，鼠标、键盘、触摸板等)输入命令或者是与用户说出语音相对应的语音命令。

存储器260，用于存储驱动和控制显示设备200运行的各种类型的数据、软件程序或应用程序。存储器260可以包括易失性和/或非易失性存储器。而术语“存储器”包括存储器260、控制器250的RAM251和ROM252、或显示设备200中的存储卡。

在一些实施例中，存储器260具体用于存储驱动显示设备200中控制器250的运行程序；存储显示设备200内置的和用户从外部设备下载的各种应用程序；存储用于配置由显示器275提供的各种GUI、与GUI相关的各种对象及用于选择GUI对象的选择器的视觉效果图像等数据。

在一些实施例中，存储器260具体用于存储调谐解调器210、通信器220、检测器230、外部装置接口240、视频处理器270、显示器275、音频处理器280等的驱动程序和相关数据，从外部装置接口接收的外部数据(例如音视频数据)或用户接口接收的用户数据(例如按键信息、语音信息、触摸信息等)。

在一些实施例中，存储器260具体存储用于表示操作系统(OS)的软件和/或程序，这些软件和/或程序可包括，例如：内核、中间件、应用编程接口(API)和/或应用程序。示例性的，内核可控制或管理系统资源，以及其它程序所实施的功能(如所述中间件、API或应用程序)；同时，内核可以提供接口，以允许中间件、API或应用程序访问控制器，以实现控制或管理系统资源。

图1D中示例性示出了显示设备200存储器中操作系统的架构配置框图。该操作系统架构从上到下依次是应用层、中间件层和内核层。

应用层，系统内置的应用程序以及非系统级的应用程序都属于应用层，其负责与用户进行直接交互。应用层可包括多个应用程序，如NETFLIX应用程序、设置应用程序、媒体中心应用程序等。这些应用程序可被实现为Web应用，其基于WebKit引擎来执行，具体可基于HTML、层叠样式表(CSS)和JavaScript来开发并执行。

这里，HTML，全称为超文本标记语言(HyperText Markup Language)，是一种用于创建网页的标准标记语言，通过标记标签来描述网页，HTML标签用以说明文字、图形、动画、声音、表格、链接等，浏览器会读取HTML文档，解释文档内标签的内容，并以网页的形式显示出来。

CSS，全称为层叠样式表(Cascading Style Sheets)，是一种用来表现HTML文件样式的计算机语言，可以用来定义样式结构，如字体、颜色、位置等的语言。CSS样式可以直接存储与HTML网页或者单独的样式文件中，实现对网页中样式的控制。

JavaScript，是一种应用于Web网页编程的语言，可以插入HTML页面并由浏览器解释执行。其中Web应用的交互逻辑都是通过JavaScript实现。JavaScript可以通过浏览器，封装JavaScript扩展接口，实现与内核层的通信，

中间件层，可以提供一些标准化的接口，以支持各种环境和系统的操作。例如，中间件层可以实现为与数据广播相关的中间件的多媒体和超媒体信息编码专家组(MHEG)，还可以实现为与外部设备通信相关的中间件的DLNA中间件，还可以实现为提供显示设备内各应用程序所运行的浏览器环境的中间件等。

内核层，提供核心系统服务，例如：文件管理、内存管理、进程管理、网络管理、系统安全权限管理等服务。内核层可以被实现为基于各种操作系统的内核，例如，基于Linux操作系统的内核。

内核层也同时提供系统软件和硬件之间的通信，为各种硬件提供设备驱动服务，例如：为显示器提供显示驱动程序、为摄像头提供摄像头驱动程序、为遥控器提供按键驱动程序、为WIFI模块提供WiFi驱动程序、为音频输出接口提供音频驱动程序、为电源管理(PM)模块提供电源管理驱动等。

用户接口265，接收各种用户交互。具体的，用于将用户的输入信号发送给控制器250，或者，将从控制器250的输出信号传送给用户。示例性的，遥控器100A可将用户输入的诸如电源开关信号、频道选择信号、音量调节信号等输入信号发送至用户接口265，再由用户接口265转送至控制器250；或者，遥控器100A可接收经控制器250处理从用户接口265输出的音频、视频或数据等输出信号，并且显示接收的输出信号或将接收的输出信号输出为音频或振动形式。

在一些实施例中，用户可在显示器275上显示的图形用户界面(GUI)输入用户命令，则用户接口265通过GUI接收用户输入命令。确切的说，用户接口265可接收用于控制选择器在GUI中的位置以选择不同的对象或项目的用户输入命令。

或者，用户可通过输入特定的声音或手势进行输入用户命令，则用户接口265通过传感器识别出声音或手势，来接收用户输入命令。

视频处理器270，用于接收外部的视频信号，根据输入信号的标准编解码协议，进行解压缩、解码、缩放、降噪、帧率转换、分辨率转换、图像合成等视频数据处理，可得到直接在显示器275上显示或播放的视频信号。

示例的，视频处理器270，包括解复用模块、视频解码模块、图像合成模块、帧率转换模块、显示格式化模块等。

其中，解复用模块，用于对输入音视频数据流进行解复用处理，如输入MPEG-2流(基于数字存储媒体运动图像和语音的压缩标准),则解复用模块将其进行解复用成视频信号和音频信号等。

视频解码模块，用于对解复用后的视频信号进行处理，包括解码和缩放处理等。

图像合成模块，如图像合成器，其用于将图形生成器根据用户输入或自身生成的GUI信号，与缩放处理后视频图像进行叠加混合处理，以生成可供显示的图像信号。

帧率转换模块，用于对输入视频的帧率进行转换，如将输入的60Hz视频的帧率转换为120Hz或240Hz的帧率，通常的格式采用如插帧方式实现。

显示格式化模块，用于将帧率转换模块输出的信号，改变为符合诸如显示器显示格式的信号，如将帧率转换模块输出的信号进行格式转换以输出RGB数据信号。

显示器275，用于接收源自视频处理器270输出的图像信号，进行显示视频、图像以及菜单操控界面。例如，显示器可以显示来自调谐解调器210接收的广播信号中的视频，也可以显示来自通信器220或外部装置接口240输入的视频，还可以显示在存储器260中存储的图像。显示器275，同时显示显示设备200中产生且用于控制显示设备200的用户操控界面UI。

以及，显示器275可以包括用于呈现画面的显示屏组件以及驱动图像显示的驱动组件。或者，倘若显示器275为一种投影显示器，还可以包括一种投影装置和投影屏幕。

音频处理器280，用于接收外部的音频信号，根据输入信号的标准编解码协议，进行解压缩和解码，以及降噪、数模转换、和放大处理等音频数据处理，得到可以在扬声器286中播放的音频信号。

示例性的，音频处理器280可以支持各种音频格式。例如MPEG-2、MPEG-4、高级音频编码(AAC)、高效AAC(HE-AAC)等格式。

音频输出接口285，用于接收源自音频处理器280输出的音频信号。例如，音频输出接口可以输出经由调谐解调器210接收的广播信号中的音频，也可以输出经由通信器220或外部装置接口240输入的音频，还可以输出在存储器260中存储的音频。音频输出接口285可包括扬声器286，或输出至外接设备的发生装置的外接音响输出端子287，如耳机输出端子。

在其他一些示例性实施例中，视频处理器270可以包括一个或多个芯片组成。音频处理器280，也可以包括一个或多个芯片组成。

以及，在其他一些示例性实施例中，视频处理器270和音频处理器280，可以为单独的芯片，也可以与控制器250一起集成在一个或多个芯片中。

供电电源290，用于在控制器250的控制下，将外部电源输入的电力为显示设备200提供电源供电支持。供电电源290可以是安装在显示设备200内部的内置电源电路，也可以是安装在显示设备200外部的电源。

用户界面(User Interface，UI)，通常指显示设备的显示界面，是用户与显示设备之间进行交互和信息交换的媒介。在一些实施例中，显示设备通过显示UI的各种UI元素如图片、填充图形、文字等，向用户传达信息，并根据外部输入的指令做出相应的反馈，比如根据用户通过控制装置输入的指令更新当前显示的UI元素，从而实现和用户交互的目的。

当需要显示UI时，在一些实施例中，显示设备将待显示的各UI元素绘制在内存中划分出的一块存储区域中，然后将该存储区域内的内容显示在显示屏上。当需要更新UI中的部分UI元素时，为了避免仅重新绘制该部分UI元素导致UI显示效果走样，显示设备会清空该存储区域，并重新绘制更新后的UI元素以及存储区域清空前绘制的其他UI元素。为便于理解，下面结合图2举例描述：

参见图2，图2中示例性示出了UI元素更新示意图。如图2左图所示，更新前的UI400包括两个UI元素：背景图片401、文本402和文本403。需要注意的是，图2中的虚线框只是为了便于标识文本402和文本403，并不属于UI的组成部分。

当需要更新UI元素时，比如需要对图2左图中的文本402做放大处理时，预期将得到如图2右图所示的更新效果。对比图2左右两图可见，文本402放大前后对背景图片401的遮挡区域发生改变，如果仅在存储空间中重新绘制文本402而不重新绘制背景图片401，则会导致背景图片401显示效果走样(走样效果未在图2中示出)。

为避免上述问题，显示设备通常清空用于绘制UI元素的存储区域，并在该存储区域中重新绘制部分UI元素更新后的各UI元素，来实现对UI元素的更新。但UI通常包括数量较多的UI元素，而且绘制UI元素需要占用一定的系统资源，例如绘制图片涉及的解压、解码等操作，文本绘制涉及的字库字形解码、文本渲染等操作，这些操作均占用系统的运算资源，若每次更新部分UI元素都重新绘制所有UI元素，会导致在无需更新的UI元素的绘制上浪费大量的系统资源。

为此，本申请实施例提供一种UI显示方法，用以减少更新部分UI元素时重新绘制所有UI元素造成的系统资源的浪费。为便于理解本申请实施例提供的UI显示方法，下面结合图3举例描述。

参见图3，图3中示例性示出了UI显示方法流程图。在一个实施例中，该方法可由显示设备的控制器执行。如图3所示，该方法包括如下步骤S501～S503：

步骤S501，创建至少两个存储区域。

本步骤S501中创建的至少两个存储区域可专门用于绘制UI元素。作为一个实施例，本步骤S501中的至少两个存储区域可在内存中创建。

在一个例子中，显示设备可利用现有的图形库比如DirectFB创建上述至少两个存储区域。作为一个实施例，创建的每一存储区域均对应显示设备的显示屏上的各个像素点。

现有的图形库大部分具有能够创建多个用于绘制UI元素的存储区域的特性，且创建的多个存储区域的内容可以叠加显示在显示屏上。作为一个实施例，将多个存储区域的内容叠加显示在显示屏上可包括：按照预设的存储区域的叠加关系和像素混合算法对多个存储区域进行像素混合运算，并将像素混合运算的结果通过显示器的显示屏显示。其中，像素混合运算可由专门的硬件执行，也可由控制器中的CPU执行。具体的像素混合运算目前已有较为完善的技术，在此不做详细说明。

在一个例子中，创建的存储区域的数量可根据多种因素确定，比如显示设备的处理能力、需要显示的UI元素的种类等等。作为一个实施例，存储区域的数量可人工预先配置在显示设备中，以使显示设备在需要显示UI时读取该预先配置的存储区域的数量，并创建相应数量的存储区域。

在一个实施例中，显示设备在创建至少两个存储区域后，可配置这至少两个存储区域的叠加关系和像素混合算法。配置存储区域的叠加关系时，可根据各存储区域所用于绘制的UI元素、UI显示效果等因素配置。以创建两个存储区域分别记为区域A、区域B为例，则可配置存储区域的叠加关系为区域A叠加在区域B上。

步骤S502，对于待显示的每一UI元素，从上述至少两个存储区域中确定一个用于绘制该UI元素的存储区域，并将该UI元素绘制在确定出的存储区域中；绘制完全部待显示的UI元素后，将上述至少两个存储区域中的内容叠加显示。

步骤S502中的每一UI元素可以属于同一个UI，在一个实施例中，UI可以为普通的图形界面，也可为基于浏览器的UI。

作为一个实施例，用于绘制UI元素的存储区域可通过多种方式确定，下文举例描述，在此暂不赘述。

在将UI元素绘制在确定出的存储区域时，在一个例子中，显示设备可将UI元素转换成对应的像素点阵，并将该像素点阵绘制在存储区域中的相应位置。关于将UI元素转换为对应的像素点阵的过程，目前本领域已有较为成熟的技术，在此不详细描述。至于转换得到的像素点阵在存储区域中的相应位置，作为一个实施例，可由显示设备根据UI布局文件确定，这里的UI布局文件限定了各UI元素在UI界面中的显示位置。

关于如何将至少两个存储区域中的内容叠加，上文已进行简要描述。在显示叠加后的内容时，作为一个实施例，显示设备可依次读取叠加后的内容的每个像素点的颜色值，并在显示屏的对应像素点显示对应的颜色，直至将叠加后的内容全部显示在显示屏上。

步骤S503，当目标存储区域中的UI元素需要更新时，在该目标存储区域中重新绘制更新后的UI元素以及与更新的UI元素相关联的UI元素；完成重新绘制后，将上述至少两个存储区域中的内容叠加显示。

本步骤S503中的目标存储区域为上述步骤S501中创建的至少两个存储区域中的至少一个存储区域。

在一个例子中，需要更新UI元素的情况可包括：需要增加UI元素、需要删除UI元素、需要替换UI元素等等。作为一个实施例，本步骤S503中的目标存储区域可通过如下方式确定：在当前显示的UI元素需要更新时，确定绘制有该UI元素的存储区域为目标存储区域；在需要增加UI元素时，确定用于绘制增加的UI元素的存储区域为目标存储区域；等等。作为一个实施例，可根据外部输入指令确定需要更新UI元素，这里的外部输入指令可为用户操作控制装置输入的指令。

在一个例子中，与更新的UI元素相关联的UI元素可包括：在目标存储区域中与更新的UI元素具有遮挡关系的UI元素。例如可包括：在所述目标存储区域中遮挡更新的UI元素的第一UI元素和被更新的UI元素遮挡的第二UI元素。其中，更新的UI元素可包括更新前的UI元素和更新后的UI元素，其中，更新前的UI元素或更新后的UI元素可能为空，即不存在更新前的UI元素或更新后的UI元素。例如，在增加UI元素的情况下，不存在更新前的UI元素；在删除UI元素的情况下，不存在更新后的UI元素。

本步骤S503中，在目标存储区域中重新绘制更新后的UI元素以及与更新的UI元素相关联的UI元素有多种实现方式，下面通过两个实施例举例描述：

实施例1：

显示设备可清空更新的UI元素在目标存储区域中对应的区域(为便于描述，以下记为更新区域)，在更新区域中绘制更新后的UI元素，并重新绘制与更新的UI元素相关联的UI元素在更新区域内的部分。其中，更新区域可根据更新前、后的UI元素在目标存储区域中占用的存储区域确定。例如，可确定更新后的UI元素的外接矩形，并将该外接矩形在目标存储区域中所占用的区域确定为更新区域。

上述与更新的UI元素相关联的UI元素，作为一个实施例，可由显示设备根据UI的布局文件中记录的各UI元素的显示位置，确定出与更新的UI元素具有遮挡关系的UI元素，并从确定出的UI元素中选择需要绘制在目标存储区域内的UI元素作为与更新的UI元素相关联的UI元素。作为另一个实施例，显示设备可从需要绘制在目标存储区域的UI元素中，根据UI的布局文件选择与更新的UI元素具有遮挡关系的作为与更新的UI元素相关联的UI元素。

作为一个实施例，显示设备可预先根据UI的布局文件中各UI元素的位置确定UI元素之间的遮挡关系并记录，当需要更新UI元素时，根据记录的遮挡关系确定更新的UI元素的关联元素。具体的，在记录UI元素之间的遮挡关系时，可判断用于绘制各UI元素的存储区域，并记录绘制在相同存储区域内的UI元素的遮挡关系。

作为一个实施例，显示设备在绘制与更新的UI元素相关联的每一UI元素时，可将该UI元素转换成对应的像素点阵，并将该像素点阵中与更新区域对应的部分绘制在更新区域中。

作为一个实施例，若不存在与更新的UI元素相关联的UI元素，则显示设备可直接在清空的更新区域内绘制更新后的UI元素。

实施例2：

显示设备可清空整个目标存储区域，并对目标存储区域重新绘制。该重新绘制的内容包括：更新后的UI元素和清空前的目标存储区域内绘制的无需更新的UI元素。该重新绘制的过程可包括：遍历包含更新后的UI元素在内的待显示的UI元素，确定用于绘制各UI元素的存储区域，并将确定出的存储区域为目标存储区域的UI元素绘制在目标存储区域中。

至此，完成对重新绘制更新后的UI元素以及与更新的UI元素相关联的UI元素的举例描述。基于本申请提供的构思能够得到的其他实现方式，均应视为在本申请的保护范围内。

显示设备在完成对目标存储区域的重新绘制后，将该目标存储区域与其他各存储区域中的内容叠加显示，由此完成对显示的部分UI元素的更新。

至此，完成对图3所示流程的描述。

通过图3所示流程，本申请能够将不同UI元素绘制在不同的存储区域中，从而减少部分UI元素更新情况下重新绘制UI元素所占用的系统资源。

为便于理解上述图3所示流程，下面结合图4举一个简单的例子：

参见图4，图4中示例性示出了基于图3所示流程的UI显示示意图。如图4中左上角的图所示，显示设备在内存中创建了两个存储区域，分别记为区域A和区域B。

假设待显示的UI为图2中的UI400，则显示设备可通过上述步骤S502，如图4中左上角图所示，将背景图片401绘制在区域B中，将文本402和文本403绘制在区域A中，并将区域A和区域B叠加显示，得到如图4右上角图所示的显示结果。

当需要更新文本402时，如图4中左下角图所示，显示设备通过上述步骤S503确定需要更新区域A中的文本402，在区域A中绘制更新后的文本402，并在完成对文本402的绘制后，将区域A和区域B叠加显示，得到如图4右下角图所示的更新后的显示结果。

至此，完成对图4的描述。

通过对图4的描述可见，采用本申请实施例提供的UI显示方法，可以在需要更新部分UI元素时，有效减少对无需更新的UI元素(比如图4中的背景图片401)的重新绘制所占用的系统资源。

下面对上述步骤S502中，如何确定用于绘制UI元素的存储区域进行举例描述：

在一些实施例中，各个UI元素的更新频率具有较大差异。比如UI元素中的背景图片和菜单选项，背景图片本身往往并不和用户交互也就无需更新，而菜单选项需要承载和用户交互的功能，常常需要进行放大缩小、变亮变暗等处理，以对用户进行不同的提示。

由于各个UI元素的更新频率具有较大差异，在一个实施例中，可按照UI元素的更新频率确定用于绘制该UI元素的存储区域，从而将更新频率较高的UI元素和更新频率较低的UI元素分别绘制在不同的存储区域中，由此在后续更新频率较高的UI元素频繁更新、需要重新绘制时，无需将绘制在不同存储区域中更新频率较低的UI元素重新绘制，有效节约系统资源。

在一些实施例中，各UI元素的透明度存在较大差异。依然以UI元素中的背景图片和菜单选项为例，背景图片通常不具有透明度，而菜单选项通常有一定的透明度。这里透明度的差异体现了最终呈现的UI界面中各UI元素的叠加关系，比如具有透明度的菜单选项通常叠加于不具有透明度的背景图片之上。

由于各UI元素的透明度存在较大差异，在一个实施例中，可按照UI元素的透明度确定用于绘制该UI元素的存储区域，从而将具有透明度的UI元素和不具有透明度的UI元素分别绘制在不同的存储区域中，由此在后续具有透明度的UI元素更新时，无需将绘制在不同存储区域中的不具有透明度的UI元素重新绘制，有效节约系统资源。

下面结合图5举例描述显示设备如何确定用于绘制UI元素的存储区域：

参见图5，图5中示例性示出了存储区域确定流程图。如图5所示，该流程可包括如下步骤：

步骤S601，确定UI元素的文件格式。

在一个例子中，不同更新频率的UI元素通常文件格式不同。比如更新频率较低的背景图片通常为jpg格式，更新频率较高的文本内容为txt格式，填充图形为png格式，由文本和填充图形、文本和图片等组合而成的UI元素具有特定的文件格式，比如包格式。作为一个实施例，显示设备可对于待显示的每一UI元素确定其文件格式。

步骤S602，依据预设的文件格式和存储区域的对应关系，将与上述UI元素的文件格式对应的存储区域确定为用于绘制上述UI元素的存储区域。

在一个实施例中，文件格式和存储区域的对应关系可由人工根据工作经验、UI显示效果等因素预设在显示设备中。具体的，文件格式和存储区域的对应关系在设置时，可与上述图3所示流程中的存储区域的配置、存储区域的叠加关系和像素混合算法的配置互相参照，以确保最终UI显示无误。

在一个实施例中，不同透明度的UI元素通常文件格式也不同，在需要将不同透明度的UI元素绘制在不同的存储区域时，可参考图5所示的根据UI元素的文件格式确定用于绘制UI元素的存储区域的流程。

至此，完成对图5所示流程的描述。

需要说明的是，上述绘制UI元素的存储区域的确定方式只是示例，实际应用时存在其他确定UI元素的存储区域的方式，在此不再一一举例描述。

如上面实施例所述，本申请实施例通过将不同的UI元素绘制在不同的存储区域中，当需要更新目标存储区域中的部分UI元素时，只需在目标存储区域重新绘制UI元素，由此能够有效减少部分UI元素更新的情况下重新绘制UI元素所占用的系统资源。

尽管已描述了本申请的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例作出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本申请范围的所有变更和修改。

显然，本领域的技术人员可以对本申请进行各种改动和变型而不脱离本申请的精神和范围。这样，倘若本申请的这些修改和变型属于本申请权利要求及其等同技术的范围之内，则本申请也意图包含这些改动和变型在内。

Claims (10)

1.一种显示设备，其特征在于，包括：

显示器；

与所述显示器耦合的控制器，被配置执行：

创建至少两个存储区域；

对于待显示的每一UI元素，从所述至少两个存储区域中确定一个用于绘制该UI元素的存储区域，并将该UI元素绘制在确定出的存储区域中；绘制完全部待显示的UI元素后，将所述至少两个存储区域中的内容叠加显示；

当所述至少两个存储区域中目标存储区域中的UI元素需要更新时，在所述目标存储区域中重新绘制更新后的UI元素以及与更新的UI元素相关联的UI元素；完成重新绘制后，将所述至少两个存储区域中的内容叠加显示。

2.根据权利要求1所述的显示设备，其特征在于，所述从所述至少两个存储区域中确定一个用于绘制该UI元素的存储区域，包括：

确定所述UI元素的文件格式；

依据预设的文件格式和存储区域的对应关系，将与所述UI元素的文件格式对应的存储区域确定为用于绘制所述UI元素的存储区域。

3.根据权利要求1所述的显示设备，其特征在于，所述与更新的UI元素相关联的UI元素，包括：

在所述目标存储区域中遮挡更新的UI元素的第一UI元素，以及被更新的UI元素遮挡的第二UI元素；所述更新的UI元素包括更新前的UI元素和更新后的UI元素。

4.根据权利要求1所述的显示设备，其特征在于，所述在所述目标存储区域中重新绘制更新后的UI元素以及与更新的UI元素相关联的UI元素，包括：

清空更新的UI元素在所述目标存储区域中对应的区域；

在所述区域内绘制更新后的UI元素，并重新绘制与更新的UI元素相关联的UI元素在所述区域内的部分。

5.根据权利要求1所述的显示设备，其特征在于，所述控制器还被配置为：

创建所述至少两个存储区域后，配置各存储区域的叠加关系和像素混合算法；

所述将所述至少两个存储区域中的内容叠加显示，包括：

根据所述存储区域的叠加关系和像素混合算法，对所述至少两个存储区域中的内容进行像素混合运算，并将运算结果通过所述显示器显示。

6.一种UI显示方法，其特征在于，所述方法包括：

创建至少两个存储区域；

对于待显示的每一UI元素，从所述至少两个存储区域中确定一个用于绘制该UI元素的存储区域，并将该UI元素绘制在确定出的存储区域中；绘制完全部待显示的UI元素后，将所述至少两个存储区域中的内容叠加显示；

当所述至少两个存储区域中目标存储区域中的UI元素需要更新时，在所述目标存储区域中重新绘制更新后的UI元素以及与更新的UI元素相关联的UI元素；完成重新绘制后，将所述至少两个存储区域中的内容叠加显示。

7.根据权利要求6所述的方法，其特征在于，所述从所述至少两个存储区域中确定一个用于绘制该UI元素的存储区域，包括：

确定所述UI元素的文件格式；

依据预设的文件格式和存储区域的对应关系，将与所述UI元素的文件格式对应的存储区域确定为用于绘制所述UI元素的存储区域。

8.根据权利要求6所述的方法，其特征在于，所述与更新的UI元素相关联的UI元素，包括：

在所述目标存储区域中遮挡更新的UI元素的第一UI元素，以及被更新的UI元素遮挡的第二UI元素；所述更新的UI元素包括更新前的UI元素和更新后的UI元素。

9.根据权利要求8所述的方法，其特征在于，所述在所述目标存储区域中重新绘制更新后的UI元素以及与更新的UI元素相关联的UI元素，包括：

清空更新的UI元素在所述目标存储区域中对应的区域；

在所述区域内绘制更新后的UI元素，并重新绘制所述第一UI元素和第二UI元素在所述区域内的部分。

10.根据权利要求6所述的方法，其特征在于，所述方法还包括：

创建所述至少两个存储区域后，配置各存储区域的叠加关系和像素混合算法；

所述将所述至少两个存储区域中的内容叠加显示，包括：

根据所述存储区域的叠加关系和像素混合算法，对所述至少两个存储区域中的内容进行像素混合运算，并显示运算结果。

Images