CN107329666A - 显示控制方法及装置、存储介质、电子设备 - Google Patents

Abstract

本申请提供了一种显示控制方法及装置、存储介质、电子设备，该方法包括根据一包含多个基本单元的预设列表容器中各基本单元与预设列表容器中一预设轴线的相对位置确定各基本单元的旋转参数；根据旋转参数对各基本单元进行旋转处理；根据各基本单元在预设列表容器中排列顺序在显示区域渲染各基本单元；当检测到作用于显示区域的一触摸滑动事件时，控制各基本单元在第一方向上跟随触摸滑动事件的滑动轨迹移动并根据移动后的位置更新所述旋转参数，其中，第一方向为各基本单元在显示区域的排列方向。提供了一种方便快捷的透视效果实现方式。

Description

显示控制方法及装置、存储介质、电子设备

技术领域

本申请涉及图像显示领域，尤其涉及一种显示控制方法及装置、存储介质、电子设备。

背景技术

随着移动智能终端以及游戏业的发展，涌现出大量的、不同题材的手游，以满足用户的需求。信息的展示是广泛应用的一项功能，比如2D角色卡牌的展示。

然而，现有技术中2D角色卡牌等基本单元的渲染显示存在以下问题：UI编辑器本身无法实现透视效果，并且无法实现跟随玩家的滑动操作沿着设定曲线实现UI面板透视动态变化的效果。

需要说明的是，在上述背景技术部分公开的信息仅用于加强对本申请的背景的理解，因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

本申请的目的在于提供一种显示控制及装置、存储介质、电子设备，进而至少在一定程度上克服由于相关技术的限制和缺陷而导致的一个或者多个问题。

根据本申请的一个方面，提供一种显示控制方法，在终端的处理器上执行软件应用并在终端的显示器上渲染得到的图形用户界面，图形用户界面至少包含一显示区域，该方法包括：

根据一包含多个基本单元的预设列表容器中各基本单元与预设列表容器中预设轴线的相对位置确定各基本单元的旋转参数；

根据旋转参数对各基本单元进行旋转处理；

根据各基本单元在预设列表容器中排列顺序在显示区域渲染各基本单元；

当检测到作用于显示区域的一触摸滑动事件时，控制各基本单元在第一方向上跟随触摸滑动事件的滑动轨迹移动并根据移动后的位置更新旋转参数，其中，第一方向为各基本单元在显示区域的排列方向。

在本申请的一种示例性实施例中，预设轴线为预设列表容器中垂直于第二方向的中轴线，其中，第二方向为各基本单元在预设列表容器的排列方向。

在本申请的一种示例性实施例中，显示区域位于显示器的中心位置。

在本申请的一种示例性实施例中，根据包含多个基本单元的预设列表容器中各基本单元与预设列表容器中预设轴线的相对位置确定各基本单元的旋转参数，包括：

根据预设列表容器中各基本单元与预设列表容器中预设轴线的相对距离确定各基本单元的旋转角度，旋转角度与相对距离正相关。

在本申请的一种示例性实施例中，根据包含多个基本单元的预设列表容器中各基本单元与预设列表容器中预设轴线的相对位置确定各基本单元的旋转参数，包括：

以各基本单元上远离预设轴线的侧边作为旋转轴，以垂直于显示器向内的方向作为旋转方向，其中，侧边经过对应的基本单元并且垂直于多个基本单元的渲染显示排列方向。

在本申请的一种示例性实施例中，根据包含多个基本单元的预设列表容器中各基本单元与预设列表容器中预设轴线的相对位置确定各基本单元的旋转参数，包括：

以各基本单元上靠近预设轴线的侧边作为旋转轴，以垂直于显示器向内的方向作为旋转方向，其中，侧边经过对应的基本单元并且垂直于多个基本单元的渲染显示排列方向。

在本申请的一种示例性实施例中，列表容器通过UI编辑器预先制作。

根据本申请的一个方面，提供一种显示控制装置，在终端的处理器上执行软件应用并在终端的显示器上渲染得到的图形用户界面，图形用户界面至少包含一显示区域，装置包括：

旋转参数确定单元，用于根据一包含多个基本单元的预设列表容器中各基本单元与预设列表容器中预设轴线的相对位置确定各基本单元的旋转参数；

旋转处理单元，用于根据旋转参数对各基本单元进行旋转处理；

渲染单元，用于根据各基本单元在预设列表容器中排列顺序在显示区域渲染各基本单元；

检测单元，用于当检测到作用于显示区域的一触摸滑动事件时，控制各基本单元在第一方向上跟随触摸滑动事件的滑动轨迹移动并根据移动后的位置更新旋转参数，其中，第一方向为各基本单元在显示区域的排列方向。

根据本申请的一个方面，提供一种计算机可读存储介质，其上存储有计算机程序，计算机程序被处理器执行时实现以上任意一项的显示控制方法。

根据本申请的一个方面，提供一种电子设备，包括：

处理器；以及

存储器，用于存储处理器的可执行指令；

其中，处理器配置为经由执行可执行指令来执行以上任意一项的显示控制方法。

本申请一种示例性实施例提供的一种显示控制方法中，根据一包含多个基本单元的预设列表容器中各基本单元与预设列表容器中一预设轴线的相对位置确定各基本单元的旋转参数；根据旋转参数对各基本单元进行旋转处理；根据各基本单元在预设列表容器中排列顺序在显示区域渲染各基本单元；当检测到作用于显示区域的一触摸滑动事件时，控制各基本单元在第一方向上跟随触摸滑动事件的滑动轨迹移动并根据移动后的位置更新所述旋转参数，其中，第一方向为各基本单元在显示区域的排列方向。实现图形用户界面中的基本单元沿着预定曲线呈现动态透视效果，形成整体界面的空间感与纵深感，并且根据用户的滑动操作，透视的基本单元能够实时根据设定曲线进行动态变化。

附图说明

通过参照附图来详细描述其示例性实施例，本申请的上述和其它特征及优点将变得更加明显。显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。在附图中：

图1为本申请一种显示控制方法的流程图；

图2为本申请一示例性实施例中基本单元的示意图；

图3为本申请一示例性实施例中旋转轴确定的示意图；

图4为本申请另一示例性实施例中旋转轴确定的示意图；

图5为本申请一示例性实施例中基本单元渲染效果示意图；

图6为本申请另一示例性实施例中基本单元渲染效果示意图；

图7为本申请一示例性实施例中滑动操作基本单元的示意图。

具体实施方式

需要说明的是，在不冲突的情况下，本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本发明。

为了使本技术领域的人员更好地理解本发明方案，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分的实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都应当属于本发明保护的范围。

需要说明的是，本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本发明的实施例。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、***、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。

本发明实施例提供了显示控制方法，其特征在于，在终端的处理器上执行软件应用并在所述终端的显示器上渲染得到的图形用户界面，所述图形用户界面至少包含一显示区域。图1是根据本发明实施例的一种显示控制的流程图。如图1所示，在本实施例中该方法包括步骤如下：

步骤S110，根据一包含多个基本单元的预设列表容器中各基本单元与所述预设列表容器中一预设轴线的相对位置确定所述各基本单元的旋转参数。

步骤S120，根据所述旋转参数对所述各基本单元进行旋转处理。

所述预设列表容器包含多个待显示的基本单元，还可以包含所述多个待显示的基本单元的相对位置。比如，第二基本单元与第一显示单元的相对距离值，第三基本单元与第二基本单元的相对距离值，第三基本单元与第一基本单元的相对距离值；又比如，第一基本单元、第二基本单元、第三基本单元依次相邻排列，则第一基本单元与第二基本单元之间的距离个距离单位，第一基本单元与第三基本单元之间的距离为两个距离单位。需要说明的是，所述预设列表容器包含多个待显示的基本单元，并不局限于上述示例中的3个，也可以是2个、4个、或者其它个数。

所述预设列表容器包含多个待显示的基本单元(多个待显示的基本单元也可以并不同时在显示区域中显示)，所述基本单元所呈现的内容包含文本、图像、或者文字与图像的结合。比如，游戏中用于展示虚拟角色相关信息的卡牌，或者是其它包含有文本和/或图像的用于显示的基本单元。

所述基本单元可以是任意外形，比如，矩形、圆形、椭圆形、六边形、不规则的多边形等。图2是基本单元外形的一个示例，该基本单元包含主体部分210和副体部分220，外形不规则，整体上呈矩形。

在可选的实施方式中，所述预设列表容器通过UI编辑器预先制作。

在可选的实施方式中，所述根据包含多个基本单元的预设列表容器中各基本单元与所述预设列表容器中预设轴线的相对位置确定所述各基本单元的旋转参数，包括：根据所述预设列表容器中各基本单元与所述预设列表容器中预设轴线的相对距离确定所述各基本单元的旋转角度，所述旋转角度与所述相对距离正相关。

比如，第一基本单元与预设轴线的相对距离为D，确定的第一基本单元的旋转角度为D*k，k为常数，k>0；或者，旋转角度为D*k+a，k和a为常数，k>0；或者其它正相关关系，使得D越大，旋转角度越大。

在可选的实施方式中，所述预设轴线为所述预设列表容器中垂直于第二方向的中轴线，其中，所述第二方向为所述各基本单元在所述预设列表容器的排列方向。

需要说明的是，D与旋转角度的正相关关系可以仅在一定角度范围成立，比如，旋转角度始终小于90度。

在可选的实施方式中，所述所述根据包含多个基本单元的预设列表容器中各基本单元与所述预设列表容器中预设轴线的相对位置确定所述各基本单元的旋转参数，包括：以所述各基本单元上远离预设轴线的侧边作为旋转轴，以垂直于显示器向内的方向作为旋转方向，其中，所述侧边经过对应的基本单元并且垂直于所述多个基本单元的渲染显示排列方向。

比如，如图3所示，以第二基本单元330上远离所述预设轴线(比如，此时第一基本单元340的中心线)的侧边310作为旋转轴，以垂直于显示器向内(图3中垂直于平面向内)的方向作为旋转方向，其中，所述侧边310经过所述二基本单元并且垂直于所述多个基本单元的渲染显示排列方向320。

比如，如图4所示，以第二基本单元410上远离所述预设轴线(比如，此时第一基本单元420的中心线)的侧边430作为旋转轴，以垂直于显示器向内(图4中垂直于平面向内)的方向作为旋转方向，其中，所述侧边430经过所述第二基本单元并且垂直于所述多个基本单元的渲染显示排列方向440。优选的，所述侧边430经过所述第二基本单元远离第一基本单元的最远端，并且垂直于所述多个基本单元的渲染显示排列方向440，如图4所示，侧边430是第二基本单元410的椭圆边缘的一切线。

在可选的实施方式中，所述根据包含多个基本单元的预设列表容器中各基本单元与所述预设列表容器中预设轴线的相对位置确定所述各基本单元的旋转参数，包括：以所述各基本单元上靠近预设轴线的侧边作为旋转轴，以垂直于显示器向内的方向作为旋转方向，其中，所述侧边经过对应的基本单元并且垂直于所述多个基本单元的渲染显示排列方向。

在步骤S130，根据所述各基本单元在所述预设列表容器中排列顺序在所述显示区域渲染所述各基本单元。

比如，在所述预设列表容器中，第二基本单元位于第一基本单元的相邻左侧位置，那么在所述显示区域中渲染第二基本单元时，相应地在所述显示区域中第一基本单元的相邻的左侧位置渲染第二基本单元；在所述预设列表容器中，第三基本单元位于第一基本单元的右侧位置，并且第三基本单元与第一基本单元之间还间隔差第四基本单元和第五基本单元，那么在所述显示区域中渲染第三基本单元时，相应地在所述显示区域中第一基本单元的右侧并且间隔第四基本单元和第五基本单元的位置处渲染第三基本单元。

所述显示区域位于终端显示屏幕的中心位置。在可选的实施方式中，所述显示区域可以位于终端显示屏幕的任意位置，比如，左上角、右上角、左侧中部等。

所述显示区域是一具有视觉指示范围的显示区域，比如，具有边界框的显示区域，或者背景填充有颜色的一显示区域，或者，背景具有预定透明度的一显示区域，或者其它能够在视觉上指示显示区域范围的区域。在可选的实施方式中，所述显示区域是一不具有视觉指示范围的显示区域。

所述预设位置为所述显示区域的中心位置。在可选的实施方式中，所述预设位置可以是位于所述显示区域的任意位置，比如，左上角、右上角、左侧中部等。

图5中的渲染示例，在显示区域510内渲染多个基本单元520，使得基本单元在终端的图形用户界面上呈现透视效果。图6中示出了另一可选实施方式中的渲染示例。

在步骤S140，当检测到作用于所述显示区域的一触摸滑动事件时，控制所述各基本单元在第一方向上跟随所述触摸滑动事件的滑动轨迹移动并根据移动后的位置更新所述旋转参数，其中，所述第一方向为所述各基本单元在所述显示区域的排列方向。

在可选的实施方式中，所述根据移动后的位置更新所述旋转参数包括：根据所述显示区域中各基本单元与所述显示区域中一预设轴线的相对位置实时确定所述各基本单元的旋转参数，根据所述旋转参数对所述各基本单元进行旋转处理。

如图7所示，当检测到触控物在(比如，用户的手指)在显示区域内滑动时，控制显示区域内的多个基本单元在如图7所示的箭头方向上跟随滑动轨迹移动。在移动的过程时，实时获取各个基本单元距离显示区域中预设位置(比如，屏幕的中心位置)的距离，确定如前文所述的旋转参数，根据各基本单元移动后的位置更新对应的旋转参数，并相应地进行旋转处理，调整各个基本单元的渲染效果，以实现动态的透视效果。

在可选的实施方式中，所述根据移动后的位置更新所述旋转参数包括：根据所述列表容器中各基本单元与所述列表容器中预设轴线的相对位置实时确定所述各基本单元的旋转参数，根据所述旋转参数对所述各基本单元进行旋转处理。

如图7所示，当检测到触控物在(比如，用户的手指)在显示区域内滑动时，控制显示区域内的多个基本单元在如图7所示的箭头方向上跟随滑动轨迹移动。在移动的过程时，实时获取各个基本单元距离列表容器中预设位置(比如，列表容器的中心位置)的距离(列表容器在显示屏幕上的位置是预设的)，就可以确定如前文所述的旋转参数，根据各基本单元移动后的位置更新对应的旋转参数，并相应地进行旋转处理，调整各个基本单元的渲染效果，以实现动态的透视效果。

通过上述实施例，一方面，根据基本单元与预设位置的相对位置关系确定基本单元的旋转参数，据此参数对基本单元旋转处理，实现了图形用户界面中基本单元沿着固定曲线的透视效果，形成整体界面的空间感与纵深感；另一方面，根据用户的左右滑动操作行为，透视的基本单元能够实时根据设定曲线进行动态变化。提供了一种方便可行并且快捷的透视效果实现方式，解决了UI编辑器制作的基本单元无法实现透视的效果、无法根据预设的曲线进行动态变化的不便。

本示例性实施例中还公开了一种显示控制装置，其特征在于，在终端的处理器上执行软件应用并在所述终端的显示器上渲染得到的图形用户界面，所述图形用户界面至少包含一显示区域，所述装置包括：旋转参数确定单元、旋转处理单元、渲染单元、检测单元。其中，

旋转参数确定单元，用于根据一包含多个基本单元的预设列表容器中各基本单元与所述预设列表容器中一预设轴线的相对位置确定所述各基本单元的旋转参数；

旋转处理单元，用于根据所述旋转参数对所述各基本单元进行旋转处理；

渲染单元，用于根据所述各基本单元在所述预设列表容器中排列顺序在所述显示区域渲染所述各基本单元；

检测单元，用于当检测到作用于所述显示区域的一触摸滑动事件时，控制所述各基本单元在第一方向上跟随所述触摸滑动事件的滑动轨迹移动并根据移动后的位置更新所述旋转参数，其中，所述第一方向为所述各基本单元在所述显示区域的排列方向。

上述中各显示控制装置模块的具体细节已经在对应的游戏画面的显示控制方法中进行了详细的描述，因此此处不再赘述。

应当注意，尽管在上文详细描述中提及了用于动作执行的设备的若干模块或者单元，但是这种划分并非强制性的。实际上，根据本申请的实施方式，上文描述的两个或更多模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之，上文描述的一个模块或者单元的特征和功能可以进一步划分为由多个模块或者单元来具体化。

在本申请的示例性实施例中，还提供了一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现上述的显示控制方法。

计算机可读存储介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了可读程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读存储介质可以发送、传播或者传输用于由指令执行***、装置或者器件使用或者与其结合使用的程序。

计算机可读存储介质中包含的程序代码可以用任何适当的介质传输，包括但不限于无线、有线、光缆、射频等等，或者上述的任意合适的组合。

在本申请的示例性实施例中，还提出了一种电子设备，该电子设备包括：处理组件，其进一步可以包括一个或多个处理器，以及由存储器所代表的存储器资源，用于存储可由处理组件执行的指令，例如应用程序。存储器中存储的应用程序可以包括一个或一个以上的每一个对应于一组指令的模块。此外，处理组件被配置为执行指令，以执行上述的显示控制方法。

该电子设备还可以包括：一个电源组件，电源组件被配置成对执行电子设备进行电源管理；一个有线或无线网络接口，被配置成将电子设备连接到网络；以及一个输入输出(I/O)接口。该电子设备可以操作基于存储在存储器的操作***，例如Android、iOS、Windows，Mac OS X，Unix，Linux，FreeBSD或类似。

通过以上的实施方式的描述，本领域的技术人员易于理解，这里描述的示例实施方式可以通过软件实现，也可以通过软件结合必要的硬件的方式来实现。因此，根据本发明实施方式的技术方案可以以软件产品的形式体现出来，该软件产品可以存储在一个非易失性存储介质(可以是CD-ROM，U盘，移动硬盘等)中或网络上，包括若干指令以使得一台计算设备(可以是个人计算机、服务器、电子设备、或者网络设备等)执行根据本发明实施方式的方法。

本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本申请的其它实施例。本申请旨在涵盖本申请的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本申请的一般性原理并包括本申请未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本申请的真正范围和精神由权利要求指出。

应当理解的是，本申请并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本申请的范围仅由所附的权利要求来限制。

Claims (10)

1.一种显示控制方法，其特征在于，在终端的处理器上执行软件应用并在所述终端的显示器上渲染得到的图形用户界面，所述图形用户界面至少包含一显示区域，所述方法包括：

根据一包含多个基本单元的预设列表容器中各基本单元与所述预设列表容器中预设轴线的相对位置确定所述各基本单元的旋转参数；

根据所述旋转参数对所述各基本单元进行旋转处理；

根据所述各基本单元在所述预设列表容器中排列顺序在所述显示区域渲染所述各基本单元；

当检测到作用于所述显示区域的一触摸滑动事件时，控制所述各基本单元在所述第一方向上跟随所述触摸滑动事件的滑动轨迹移动并根据移动后的位置更新所述旋转参数，其中，所述第一方向为所述各基本单元在所述显示区域的排列方向。

2.根据权利要求1所述的方法，其特征在于，所述预设轴线为所述预设列表容器中垂直于第二方向的中轴线，其中，所述第二方向为所述各基本单元在所述预设列表容器的排列方向。

3.根据权利要求1所述的方法，其特征在于，所述显示区域位于所述显示器的中心位置。

4.根据权利要求1所述的方法，其特征在于，所述根据包含多个基本单元的预设列表容器中各基本单元与所述预设列表容器中预设轴线的相对位置确定所述各基本单元的旋转参数，包括：

根据所述预设列表容器中各基本单元与所述预设列表容器中预设轴线的相对距离确定所述各基本单元的旋转角度，所述旋转角度与所述相对距离正相关。

5.根据权利要求1-4中任一项所述的方法，其特征在于，所述根据包含多个基本单元的预设列表容器中各基本单元与所述预设列表容器中预设轴线的相对位置确定所述各基本单元的旋转参数，包括：

以所述各基本单元上远离预设轴线的侧边作为旋转轴，以垂直于显示器向内的方向作为旋转方向，其中，所述侧边经过对应的基本单元并且垂直于所述多个基本单元的渲染显示排列方向。

6.根据权利要求1-4中任一项所述的方法，其特征在于，所述根据包含多个基本单元的预设列表容器中各基本单元与所述预设列表容器中预设轴线的相对位置确定所述各基本单元的旋转参数，包括：

以所述各基本单元上靠近预设轴线的侧边作为旋转轴，以垂直于显示器向内的方向作为旋转方向，其中，所述侧边经过对应的基本单元并且垂直于所述多个基本单元的渲染显示排列方向。

7.根据权利要求1-4中任一项所述的方法，其特征在于，所述列表容器通过UI编辑器预先制作。

8.一种显示控制装置，其特征在于，在终端的处理器上执行软件应用并在所述终端的显示器上渲染得到的图形用户界面，所述图形用户界面至少包含一显示区域，所述装置包括：

旋转参数确定单元，用于根据一包含多个基本单元的预设列表容器中各基本单元与所述预设列表容器中预设轴线的相对位置确定所述各基本单元的旋转参数；

旋转处理单元，用于根据所述旋转参数对所述各基本单元进行旋转处理；

渲染单元，用于根据所述各基本单元在所述预设列表容器中排列顺序在所述显示区域渲染所述各基本单元；

检测单元，用于当检测到作用于所述显示区域的一触摸滑动事件时，控制所述各基本单元在所述第一方向上跟随所述触摸滑动事件的滑动轨迹移动并根据移动后的位置更新所述旋转参数，其中，所述第一方向为所述各基本单元在所述显示区域的排列方向。

9.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1-7中任意一项所述的显示控制方法。

10.一种电子设备，其特征在于，包括：

处理器；以及

存储器，用于存储所述处理器的可执行指令；

其中，所述处理器配置为经由执行所述可执行指令来执行权利要求1-7中任意一项所述的显示控制方法。