图像交互展示方法及装置与流程

1.本技术涉及互联网技术领域，具体涉及一种图像交互展示方法及装置。


背景技术：

2.图像展示时，现有技术大多是将图像直接展示给用户观看，用户与图像交互方式较少，如点击图像放大、缩小，选中图像等，用户的交互方式仅是对图像本身进行操作，供用户交互的方式单一呆板。且图像展示交互过程中往往也呈现的是不变的展示效果，用户观看时缺乏交互的趣味性，用户的观看体验较差。


技术实现要素：

3.鉴于上述问题，提出了本技术实施例以便提供一种克服上述问题或者至少部分地解决上述问题的图像交互展示方法及装置。
4.根据本技术实施例的第一方面，提供了一种图像交互展示方法，其包括：
5.在页面的展示区域中展示第一3d图像；
6.响应用户对展示终端的转动操作，在展示区域中展示第二3d图像，其中，第二3d图像基于转动操作对第一3d图像进行偏移处理获得。
7.可选地，在页面的展示区域中显示第一3d图像具体为：
8.响应用户触发的图像展示操作，展示第一3d图像；其中，第一3d图像由多个图层叠加展示，每一图层展示不同图片，不同图片根据预设初始化数据加载。
9.可选地，响应用户对展示终端的转动操作，在展示区域中展示第二3d图像进一步包括：
10.响应用户对展示终端的转动操作，将第一3d图像中各个图层的图片跟随转动操作进行偏移处理，展示偏移处理后得到的第二3d图像。
11.可选地，响应用户对展示终端的转动操作，将第一3d图像中各个图层的图片跟随转动操作进行偏移处理，展示偏移处理后得到的第二3d图像进一步包括：
12.响应用户对展示终端的转动操作，将第一3d图像中各个图层的图片跟随转动操作按照偏移方向以及偏移幅度进行偏移处理，展示偏移处理后得到的第二3d图像；其中，各个图层的偏移方向、偏移幅度根据终端转动角度确定，各个图层的偏移幅度不同；终端转角数据基于终端陀螺仪传感器感应用户的转动操作得到。
13.可选地，页面包括用户主页；第一3d图像包括用户头像和/或用户封面图像；第二3d图像包括偏移处理后的用户头像和/或用户封面图像；
14.响应用户对展示终端的转动操作，在展示区域中展示第二3d图像进一步包括：
15.响应用户对展示终端的转动操作，在用户主页中将用户头像和/或用户封面图像跟随转动操作进行偏移处理，得到偏移处理后的用户头像和/或用户封面图像；
16.和/或，
17.页面包括图像列表页面和/或图像详情页面；图像列表页面包含至少一个待选取
的目标图像；图像详情页面包含目标图像以及目标图像的描述信息；第一3d图像包括目标图像；第二3d图像包括偏移处理后的目标图像；
18.响应用户对展示终端的转动操作，在展示区域中展示第二3d图像进一步包括：
19.响应用户对展示终端的转动操作，在图像列表页面和/或图像详情页面中将目标图像跟随转动操作进行偏移处理，得到偏移处理后的目标图像。
20.可选地，页面还包括：图像概览页面；
21.方法还包括：
22.响应用户点击用户头像和/或用户封面图像的操作，弹出图像概览页面；图像概览页面包含用户头像和/或用户封面图像对应的目标图像；
23.响应用户对展示终端的转动操作，在图像概览页面中将目标图像跟随转动操作进行偏移处理，得到偏移处理后的目标图像。
24.可选地，方法还包括：
25.根据用户在图像列表页面中选取的目标图像，在用户主页中将目标图像作为用户头像和/或用户封面图像进行展示。
26.根据本技术实施例的第二方面，提供了一种图像交互展示方法，其包括：
27.在页面的展示区域中展示至少第一图像和第二图像；
28.响应用户对展示终端的转动操作，增加第一图像的透明度，并同时降低第二图像的透明度。
29.可选地，在页面的展示区域中展示至少第一图像和第二图像具体为：
30.响应用户触发的图像展示操作，在页面的展示区域中展示至少第一图像和第二图像；其中，第一图像的透明度低于第二图像的透明度。
31.可选地，响应用户对展示终端的转动操作，增加第一图像的透明度，并同时降低第二图像的透明度进一步包括：
32.响应用户对展示终端的转动操作，跟随转动操作增加第一图像的透明度，并同时降低第二图像的透明度，以隐藏第一图像，展示第二图像呈现闪卡效果；其中，第一图像和第二图像调整的透明度根据终端转动角度确定；终端转角数据基于终端陀螺仪传感器感应用户的转动操作得到。
33.可选地，页面包括用户主页；展示区域包括用户头像展示区域和/或用户封面图像展示区域；
34.和/或，
35.页面包括图像列表页面；展示区域包括图像列表页面中待选取目标图像展示区域；
36.和/或，
37.页面包括图像详情页面；展示区域包括目标图像展示区域。
38.可选地，页面还包括：图像概览页面；
39.方法还包括：
40.响应用户点击用户头像和/或用户封面图像的操作，弹出图像概览页面；图像概览页面包含用户头像和/或用户封面图像对应的目标图像；
41.响应用户对展示终端的转动操作，在图像概览页面的目标图像展示区域中跟随转
动操作调整目标图像中多个图像透明度，展示呈现闪卡效果的目标图像。
42.可选地，方法还包括：
43.根据用户在图像列表页面中选取的目标图像，在用户主页中将目标图像作为用户头像和/或用户封面图像进行展示。
44.根据本技术实施例的第三方面，提供了一种图像交互展示装置，其包括：
45.第一初始化模块，适于在页面的展示区域中展示第一3d图像；
46.第一交互模块，适于响应用户对展示终端的转动操作，在展示区域中展示第二3d图像，其中，第二3d图像基于转动操作对第一3d图像进行偏移处理获得。
47.根据本技术实施例的第四方面，提供了一种图像交互展示装置，其包括：
48.第二初始化模块，适于在页面的展示区域中展示至少第一图像和第二图像；
49.第二交互模块，适于响应用户对展示终端的转动操作，增加第一图像的透明度，并同时降低第二图像的透明度。
50.根据本技术实施例的第五方面，提供了一种计算设备，包括：处理器、存储器、通信接口和通信总线，所述处理器、所述存储器和所述通信接口通过所述通信总线完成相互间的通信；
51.所述存储器用于存放至少一可执行指令，所述可执行指令使所述处理器执行上述图像交互展示方法对应的操作。
52.根据本技术实施例的第六方面，提供了一种计算机存储介质，所述存储介质中存储有至少一可执行指令，所述可执行指令使处理器执行如上述图像交互展示方法对应的操作。
53.根据本技术的提供的图像交互展示方法及装置，基于用户对展示终端的转动操作，将初始展示的第一3d图像跟随转动操作进行偏移处理，得到交互后的第二3d图像，实现用户与图像的交互，呈现给用户裸眼视觉的立体变化空间感，提升用户观看图像的趣味性。
54.上述说明仅是本技术技术方案的概述，为了能够更清楚了解本技术的技术手段，而可依照说明书的内容予以实施，并且为了让本技术的上述和其它目的、特征和优点能够更明显易懂，以下特举本技术的具体实施方式。
附图说明
55.通过阅读下文优选实施方式的详细描述，各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的，而并不认为是对本技术的限制。而且在整个附图中，用相同的参考符号表示相同的部件。在附图中：
56.图1示出了根据本技术一个实施例的图像交互展示方法的流程图；
57.图2示出了根据本技术另一个实施例的图像交互展示方法的流程图；
58.图3示出了基于陀螺仪传感器获取转动角度的示意图；
59.图4示出了贝赛尔曲线示意图；
60.图5a-图5c示出了图像交互展示的3d效果示意图；
61.图6示出了根据本技术再一个实施例的图像交互展示方法的流程图；
62.图7示出了根据本技术又一个实施例的图像交互展示方法的流程图；
63.图8a-图8d示出了图像交互展示的闪卡效果示意图；
64.图9示出了根据本技术一个实施例的图像交互展示装置的结构示意图；
65.图10示出了根据本技术另一个实施例的图像交互展示装置的结构示意图；
66.图11示出了根据本技术一个实施例的一种计算设备的结构示意图。
具体实施方式
67.下面将参照附图更详细地描述本技术的示例性实施例。虽然附图中显示了本技术的示例性实施例，然而应当理解，可以以各种形式实现本技术而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本技术，并且能够将本技术的范围完整的传达给本领域的技术人员。
68.首先，对本技术一个或多个实施例涉及的名词术语进行解释。
69.数字藏品：数字藏品是指使用区块链技术，对特定的作品、艺术品生成的唯一数字凭证，在保护其数字版权的基础上，实现真实可信的数字化发行、购买、收藏和使用；
70.陀螺仪：陀螺仪是用高速回转体的动量矩敏感壳体相对惯性空间绕正交于自转轴的一个或二个轴的角运动检测装置；利用其他原理制成的角运动检测装置起同样功能的也称陀螺仪；
71.贝塞尔曲线(b
é
zier curve)：又称贝兹曲线或贝济埃曲线，应用于二维图形应用程序的数学曲线。
72.图1示出了根据本技术一实施例的图像交互展示方法的流程图，如图1所示，该方法包括如下步骤：
73.步骤s101，在页面的展示区域中展示第一3d图像。
74.本技术实施例中第一3d图像具体可以由多个图层叠加展示，每一图层展示不同图片，如第一3d图像中包含多个元素，前景部分包含如树木、路灯等元素、主体部分包含如房屋等元素、背景部分包含如山峰等元素，不同的元素可以设置在不同图层的图片中，每一图层中展示的图片可以包含第一3d图像中的部分元素，通过多个图层的图片叠加展示方式，得到展示的第一3d图像。
75.在一个可选的实施例中，第一3d图像可以采用如数字藏品，以满足用户对艺术品等观看需求。第一3d图像可以用于如在用户主页的展示区域中对应的用户头像展示、用户封面图像展示等，满足用户个性化需求。
76.步骤s102，响应用户对展示终端的转动操作，在展示区域中展示第二3d图像。
77.本技术实施例中用户的交互操作不是针对展示区域中第一3d图像的滑动、点击等界面相关的操作，而是基于用户对展示终端的转动操作，来完成与第一3d图像的不同交互体验。具体的，用户可以对展示终端进行转动操作，根据用户的转动操作，相应的将第一3d图像进行偏移处理，得到对应的第二3d图像，在展示区域中展示第二3d图像，呈现给用户第一3d图像跟随转动操作一起进行偏移，用户裸眼视觉的图像立体变化空间效果。
78.根据本技术提供的图像交互展示方法，基于用户对展示终端的转动操作，将初始展示的第一3d图像跟随转动操作进行偏移处理，得到交互后的第二3d图像，实现用户与图像的交互，呈现给用户裸眼视觉的立体变化空间感，提升用户观看图像的趣味性。
79.图2示出了根据本技术一实施例的图像交互展示方法的流程图，如图2所示，该方法包括以下步骤：
80.步骤s201，响应用户触发的图像展示操作，展示第一3d图像。
81.当用户触发图像展示操作时，可以按照预设初始化数据来加载第一3d图像。其中，第一3d图像包含多个图层，每一图层展示不同图片，不同图片根据预设初始化数据加载，通过将多个图层的图片叠加，得到第一3d图像展示给用户。
82.步骤s202，响应用户对展示终端的转动操作，将第一3d图像中各个图层的图片跟随转动操作进行偏移处理，展示偏移处理后得到的第二3d图像。
83.响应用户对展示终端的转动操作，可以将第一3d图像中各个图层的图片跟随转动操作按照对应的偏移方向以及偏移幅度进行偏移处理，展示偏移处理后得到的第二3d图像。具体的，用户对展示终端进行转动操作时，产生相应的终端转动角度，根据终端转动角度可以确定各个图层图片的偏移方向、偏移幅度等，再按照对应的偏移方向以及偏移幅度对各个图层的图片进行偏移处理，得到并展示第二3d图像。
84.终端转动角度可以基于终端陀螺仪传感器获取，为方便理解本技术实施例，以手机为例，如图3所示，陀螺仪传感器可以获取如图3中x、y、z轴的转动角度。根据手机的展示界面建立x轴、y轴和z轴，其中，x轴、y轴和z轴以展示界面的中心为中心起点，x轴与终端展示界面平行，具体与终端展示界面的左右方向(手机窄边)平行，y轴与终端展示界面平行，具体与终端展示界面上下方向(手机长边)平行，z轴为垂直于终端展示界面方向。图3中还设置了各轴转动角度的正负值取值，以上为举例说明，x轴、y轴和z轴的设置、转动角度的正负值取值可以根据终端的实施情况确定，此处不做限定。当用户对终端进行转动操作时，基于终端的陀螺仪传感器可以获取到与x轴、y轴、z轴相关的转动角度。终端转动角度包括如第一转动角度、第二转动角度、第三转动角度等。第一转动角度、第二转动角度为终端展示界面平行方向，第三转动角度为终端展示界面垂直方向，如第一转动角度为x轴相关的转动角度，第二转动角度为y轴相关的转动角度，第三转动角度为z轴相关的转动角度。
85.当用户对展示终端进行转动操作时，响应用户对展示终端的转动操作，基于终端陀螺仪传感器可以获取展示终端转动后的终端实时角度，但仅依据终端实时角度来偏移处理第一3d图像时，易导致第一3d图像偏移幅度过大、闪屏等问题。在展示第一3d图像时，考虑到不同终端在展示第一3d图像时的初始角度可能不同，后续用户转动展示终端时，应基于用户转动产生的差异角度来对第一3d图像进行偏移，因此，展示第一3d图像时，先基于终端陀螺仪传感器获取展示第一3d图像对应的终端初始角度，即获取到展示第一3d图像时终端各个方向对应的角度等，方便后续用户对终端转动操作时，确定终端的变化，基于变化产生的差异来对应的对第一3d图像进行偏移处理。
86.当用户对展示终端进行转动操作时，基于终端陀螺仪传感器可以获取展示终端转动后的终端实时角度，再根据获取的终端初始角度与终端实时角度，计算两者的差值，如将各轴的终端实时角度减去对应的各轴的终端初始角度，得到对应的终端转动角度。
87.根据终端转动角度可以确定偏移方向、偏移幅度。偏移方向根据第一转动角度、第二转动角度、第三转动角度确定，根据第一转动角度得到的偏移方向为向上或向下，具体根据第一转动角度的正负值确定，如设置正值对应向下偏移，负值对应向上偏移等；根据第二转动角度得到的偏移方向为向左或向右，具体根据第二转动角度的正负值确定，如设置正值对应向左偏移，负值对应向右偏移等；根据第三转动角度得到的偏移方向为纵深向内或向外偏移，具体根据第三转动角度的正负值确定，如设置正值对应向内偏移，负值对应向外
偏移等。偏移幅度可以基于线性计算，如第一转动角度为a，将其直接乘以偏移量线性系数b，得到对应的偏移幅度。但根据线性计算得到的偏移幅度对图片进行偏移会导致第一3d图像的变化比较呆板，因此，本技术实施例在确定偏移幅度时，可以根据预设曲线函数将第一转动角度、第二转动角度、第三转动角度等进行转换处理，来得到第一3d图像中各层图层的图片的偏移幅度。预设曲线函数可以采用如贝赛尔曲线等各种曲线函数，以贝塞尔曲线为例，如图4所示，黑色曲线为贝赛尔曲线，横轴方向数据代入第一转动角度、第二转动角度、第三转动角度，贝塞尔曲线纵轴方向数据为对应的偏移幅度。如从横轴对应的第一转动角度出发，确定对应的贝赛尔曲线上的点，再基于该点确定纵轴的数据得到偏移幅度。
88.在确定偏移方向、偏移幅度时，可以基于以上多个终端转动角度确定，如得到某层图片的偏移方向和偏移幅度为向左偏移xxx、向下偏移xxx、向内偏移xxx等，呈现各图层中图片的偏移效果，或者也可以仅具有一个或两个终端转动角度来确定。如仅获取第一转动角度、第二转动角度，基于第一转动角度和第二转动角度来得到偏移方向和偏移幅度，调整各图层中图片上下左右方向的偏移幅度等，以上为举例说明，具体根据实施情况确定。
89.进一步，为使各图层中图片的偏移更灵活，各层图层在确定偏移幅度时，可以采用不同的预设曲线函数确定，得到的各个图层的偏移幅度不同。图4中位于贝塞尔曲线左右两侧的实心圆点为控制点，基于控制点可以调整贝赛尔曲线的不同曲率，各图层所使用的预设曲线函数的曲率可以根据实施情况设置。各层图层使用不同曲率的预设曲线函数，使得各层图片中偏移幅度不同，根据各层图层图片的偏移幅度和偏移方向分别对第一3d图像中各个图层的图片进行偏移处理(偏移处理可以通过将偏移方向、偏移幅度输入至渲染引擎来完成偏移处理等)，各图层的图片呈现不同的偏移效果，叠加各图层的图片得到的第二3d图像更灵活多变。终端转动角度中第一转动角度、第二转动角度、第三转动角度使用的预设曲线函数也可以不同，具体根据实施情况设置。
90.从展示第一3d图像到展示第二3d图像可以呈现给用户不同裸眼立体空间变化效果，如图5a、图5b、图5c所示，以图5a为第一3d图像为例，图5b根据用户对终端的转动操作，对图5a中各图层的图片进行偏移处理，图5b中房屋左上方的光线、灯球，右上方的光线按照对应的偏移方向、偏移幅度进行偏移处理，得到对应的第二3d图像，图5c为用户继续对终端进行转动操作，此时图5c中房屋左上方的光线、灯球，右上方的光线按照继续转动操作所确定的偏移方向、偏移幅度继续进行偏移处理，最终呈现出从图5a到图5b、图5c，图像中房屋不变，其它元素变动，展示的第二3d图像呈现给用户裸眼视觉立体空间的变化效果，跟随用户对终端的转动操作，呈现的第二3d图像为实时变化的图像，提升用户观看体验，增加用户与图像交互的趣味性。以上为举例说明，具体实施时可以根据实施情况设置对应的效果，此处不做限定。
91.在一个可选的实施例中，第一3d图像可以用于如在用户主页的用户头像展示、用户封面图像展示等，第二3d图像对应偏移处理后的用户头像、用户封面图像。在用户主页中，响应用户对展示终端的转动操作，将用户头像、用户封面图像等跟随转动操作进行偏移处理，得到偏移处理后的用户头像、用户封面图像。进一步，用户头像、用户封面图像的展示空间有限，用户可以点击用户头像、用户封面图像等，响应用户点击用户头像、用户封面图像的操作，弹出图像概览页面，在图像概览页展示用户头像、用户封面图像所对应的放大的目标图像，使用户可以清楚查看目标图像。在图像概览页面中，响应用户对展示终端的转动
操作，目标图像可以跟随用户终端的转动操作进行偏移处理，呈现给用户偏移处理后的目标图像，方便用户观看目标图像实时的交互效果。用户头像、用户封面图像的选取，用户可以在图像列表页面中先查看待选取的目标图像，根据需求选取目标图像后，将选取的目标图像作为用户的用户头像、用户封面图像等。在图像列表页面中查看时，目标图像也可以根据用户对终端的转动操作，展示给用户根据转动操作偏移处理后的目标图像。用户还可以在图像列表页面中点击目标图像，进入图像详情页面，了解图像详情页面展示的目标图像的描述信息，进一步查看目标图像。图像详情页面展示的目标图像也可以跟随用户对终端的转动操作，展示给用户根据转动操作偏移处理后的目标图像。
92.根据本技术提供的图像交互展示方法，基于用户对终端的转动操作获取的终端实时角度和展示第一3d图像的终端初始角度的差值得到的终端转动角度，来确定对应的偏移方向和偏移幅度，避免仅依据终端实时角度对第一3d图像进行偏移处理，导致第一3d图像偏移幅度过大、闪屏等问题。在确定偏移幅度时，采用预设曲线函数，可以使得到的偏移幅度更灵活多样，避免采用线性对应关系得到的偏移幅度进行偏移处理时图片偏移效果呈现呆板等问题。且对应不同图层使用不同曲率的预设曲线函数，得到的第二3d图像呈现更灵动的交互效果，呈现给用户裸眼视觉立体空间变化图像，丰富图像的展示效果，也丰富用户互动的趣味性。
93.图6示出了根据本技术一实施例的图像交互展示方法的流程图，如图6所示，该方法包括以下步骤：
94.步骤s601，在页面的展示区域中展示至少第一图像和第二图像。
95.本技术实施例中，在页面的展示区域中可以展示多个图像，以便用户在与图像交互时，通过调整各个图像的透明度，实现图像交互的闪卡效果。
96.在页面的展示区域中展示至少第一图像和第二图像，其中，第一图像可以展示在第二图像前，页面展示时用户观看到第一图像。进一步，第一图像和第二图像也可以分别由多个图层叠加展示，如以第一图像为例，第一图像中包含多个元素，如包含小女孩、问号、尺子等元素，不同的元素可以设置在不同图层的图片中，每一图层中展示的图片可以包含第一图像中的部分元素，通过多个图层的图片叠加展示方式，得到展示的第一图像，方便后续调整透明度时，可以按照不同图层分别调整，呈现不同元素的隐藏或者展示的闪现效果。
97.在一个可选的实施例中，第一图像和第二图像可以采用如数字藏品，以满足用户对艺术品等观看需求。第一图像和第二图像可以用于如在用户主页的展示区域中对应的用户头像展示、用户封面图像展示等，满足用户个性化需求。
98.步骤s602，响应用户对展示终端的转动操作，增加第一图像的透明度，并同时降低第二图像的透明度。
99.本技术实施例中用户的交互操作不是针对展示区域中第一图像、第二图像的滑动、点击等界面相关的操作，而是基于用户对展示终端的转动操作，来完成与图像的不同交互体验。具体的，用户可以对展示终端进行转动操作，根据用户的转动操作，相应的增加第一图像的透明度，同时降低第二图像的透明度，使得第一图像慢慢变透明直至隐藏状态，第二图像慢慢呈现，实现图像展示闪卡效果。
100.根据本技术提供的图像交互展示方法，基于用户对展示终端的转动操作，将初始展示的第一图像的透明度增加，并同时降低第二图像的透明度，实现用户与图像的交互，呈
现给用户图像展示闪卡效果，提升用户观看图像的趣味性。
101.图7示出了根据本技术一实施例的图像交互展示方法的流程图，如图7所示，该方法包括以下步骤：
102.步骤s701，响应用户触发的图像展示操作，在页面的展示区域中展示至少第一图像和第二图像。
103.当用户触发图像展示操作时，可以按照预设初始化数据中包含的透明度来对应的加载展示至少第一图像和第二图像。其中，第一图像的透明度低于第二图像的透明度，如可以设置第一图像的透明度为0％，第二图像的透明度为100％，即用户可见图像当前为第一图像，第二图像隐藏不可见。
104.步骤s702，响应用户对展示终端的转动操作，跟随转动操作增加第一图像的透明度，并同时降低第二图像的透明度，以隐藏第一图像，展示第二图像呈现闪卡效果。
105.用户对展示终端进行转动操作时，产生相应的终端转动角度，根据终端转动角度可以确定第一图像和第二图像调整的透明度，基于确定的透明度跟随转动操作对应的增加第一图像的透明度，并同时降低第二图像的透明度，使得第一图像渐渐隐藏，第二图像渐渐呈现，最终用户可见的图像为第二图像。调整第一图像和第二图像时，可以按照图层调整，如以第一图像为例，根据终端转动角度，确定第一图像中各个图层的图片增加的透明度，调整各个图层的图片，呈现第一图像整体的展示效果。
106.终端转动角度可以基于终端陀螺仪传感器获取，具体参照步骤s202中的描述，在此不再赘述。终端转动角度包括如第一转动角度、第二转动角度、第三转动角度等，根据终端转动的转动方向，调整第一图像或者第二图像的对应方位的透明度等，根据终端转动角度确定透明度。用户对展示终端的转动操作，基于终端陀螺仪传感器可以获取展示终端转动后的终端实时角度，但仅依据终端实时角度来确定透明度，会导致第一图像或者第二图像的透明度调整幅度过大、闪屏等问题，无法呈现良好的闪卡效果。因此，在页面中展示第一图像时，考虑到不同终端在展示第一图像时的初始角度可能不同，后续用户转动展示终端时，应基于用户转动产生的差异角度来确定第一图像、第二图像的透明度，因此，展示第一图像时，先基于终端陀螺仪传感器获取展示第一图像对应的终端初始角度，即获取到展示第一图像时终端各个方向对应的角度等，方便后续用户对终端转动操作时，确定终端的变化，基于变化产生的差异来对应的确定第一图像、第二图像调整的透明度。
107.当用户对展示终端进行转动操作时，基于终端陀螺仪传感器可以获取展示终端转动后的终端实时角度，再根据获取的终端初始角度与终端实时角度，计算两者的差值，如将各轴的终端实时角度减去对应的各轴的终端初始角度，得到对应的终端转动角度。
108.根据终端转动角度可以确定透明度，透明度可以基于线性计算，如第一转动角度为a，将其直接乘以透明度线性系数b，得到对应的透明度。但根据线性计算得到的透明度对图像进行调整时，透明度变化过程比较呆板，缺少灵动性。因此，本技术实施例在确定透明度时，可以根据预设曲线函数将第一转动角度、第二转动角度、第三转动角度等进行转换处理，来得到第一图像中各层图层的图片的透明度。预设曲线函数可以采用如贝赛尔曲线等各种曲线函数，以贝塞尔曲线为例，如图4所示，黑色曲线为贝赛尔曲线，横轴方向数据代入第一转动角度、第二转动角度、第三转动角度，贝塞尔曲线纵轴方向数据为对应的透明度。如从横轴对应的第一转动角度出发，确定对应的贝赛尔曲线上的点，再基于该点确定纵轴
的数据得到透明度。在确定透明度时，可以基于以上多个终端转动角度确定，也可以基于一个终端转动角度确定，具体根据实施情况确定。
109.进一步，为使各图层中图片的透明度调整更灵活，各层图层在确定透明度时，可以采用不同的预设曲线函数确定，得到的各个图层的透明度不同。图4中位于贝塞尔曲线左右两侧的实心圆点为控制点，基于控制点可以调整贝赛尔曲线的不同曲率，各图层所使用的预设曲线函数的曲率可以根据实施情况设置。各层图层使用不同曲率的预设曲线函数，使得各层图片中透明度调整不同，各图层的图片呈现不同的透明效果，叠加各图层的图片呈现的透明效果也更灵活多变。终端转动角度中第一转动角度、第二转动角度、第三转动角度使用的预设曲线函数也可以不同，具体根据实施情况设置。
110.从展示第一图像到展示第二图像可以呈现给用户图像变化的闪卡效果，如图8a、图8b、图8c、图8d所示，以图8a为第一图像为例，如女孩所在图层的透明度为0％(其它元素如尺子、问号、饮料等元素的初始化的透明度为0％，后续在交互时陆续增加，此处为方便理解，以女孩为例进行说明)，图8d为第二图像，初始展示时如卡通人物所在图层的透明度为100％，即用户不可见，(其它元素如星星等元素所在图层的初始化的透明度也可以为100％，后续在交互时陆续减少，此处为方便理解，以卡通人物为例进行说明)。图8b、图8c是根据用户对终端的转动操作，对应的调整第一图像、第二图像中各图层的图片的透明度，图8b中女孩所在图层透明度增加，卡通人物所在图层透明度降低，图8c进一步增加女孩所在图层的透明度，降低卡通人物所在图层的透明度，最终，呈现如图8d的效果，此时第一图像中女孩所在图层的透明度为100％，第二图像中卡通人物所在图层的透明度为0％，从图8a到图8b、图8c、图8d的展示过程，呈现给用户图像闪卡效果。以上为举例说明，具体实施时可以根据实施情况设置对应的效果，此处不做限定。
111.在一个可选的实施例中，页面可以为用户主页，展示区域包括用户头像展示区域、用户封面图像展示区域等，如在展示用户头像时，用户头像包括至少第一图像和第二图像，呈现出用户头像跟随转动操作呈现图像闪卡效果等。进一步，用户头像、用户封面图像的展示空间有限，用户可以点击用户头像、用户封面图像等，响应用户点击用户头像、用户封面图像的操作，弹出图像概览页面，在图像概览页展示用户头像、用户封面图像所对应的放大的目标图像，使用户可以清楚查看目标图像。在图像概览页面的目标图像展示区域中，可以跟随用户的转动操作调整目标图像中多个图像透明度，呈现出目标图像的闪卡效果。用户头像、用户封面图像的选取，用户可以在图像列表页面中先查看待选取的目标图像，根据需求选取目标图像后，将选取的目标图像作为用户的用户头像、用户封面图像等。在展示图像列表页面时，展示区域包括图像列表页面中待选取目标图像展示区域，其中展示的目标图像也可以根据用户对终端的转动操作，展示给用户根据转动操作呈现闪卡效果的目标图像。用户还可以在图像列表页面中点击目标图像，进入图像详情页面，了解图像详情页面展示的目标图像的描述信息，进一步查看目标图像等。
112.根据本技术提供的图像交互展示方法，基于用户对终端的转动操作获取的终端实时角度和页面初始化展示时的终端初始角度的差值得到的终端转动角度，来确定对应的透明度，避免仅依据终端实时角度确定透明度，导致透明度的调整幅度过大、闪屏等问题。在确定透明度时，采用预设曲线函数，可以使得到的透明度更灵活多样，避免采用线性对应关系得到的透明度进行调整时呈现呆板等问题。且对应不同图层使用不同曲率的预设曲线函
数，透明度的调整更灵动，呈现给用户灵活的闪卡效果，丰富图像的展示效果，也丰富用户互动的趣味性。
113.图9示出了本技术一实施例提供的图像交互展示装置的结构示意图。如图9所示，该装置包括：
114.第一初始化模块910，适于在页面的展示区域中展示第一3d图像；
115.第一交互模块920，适于响应用户对展示终端的转动操作，在展示区域中展示第二3d图像，其中，第二3d图像基于转动操作对第一3d图像进行偏移处理获得。
116.可选地，第一初始化模块910进一步适于：
117.响应用户触发的图像展示操作，展示第一3d图像；其中，第一3d图像由多个图层叠加展示，每一图层展示不同图片，不同图片根据预设初始化数据加载。
118.可选地，第一交互模块920进一步适于：
119.响应用户对展示终端的转动操作，将第一3d图像中各个图层的图片跟随转动操作进行偏移处理，展示偏移处理后得到的第二3d图像。
120.可选地，第一交互模块920进一步适于：
121.响应用户对展示终端的转动操作，将第一3d图像中各个图层的图片跟随转动操作按照偏移方向以及偏移幅度进行偏移处理，展示偏移处理后得到的第二3d图像；其中，各个图层的偏移方向、偏移幅度根据终端转动角度确定，各个图层的偏移幅度不同；终端转角数据基于终端陀螺仪传感器感应用户的转动操作得到。
122.可选地，页面包括用户主页；第一3d图像包括用户头像和/或用户封面图像；第二3d图像包括偏移处理后的用户头像和/或用户封面图像；
123.第一交互模块920进一步适于：响应用户对展示终端的转动操作，在用户主页中将用户头像和/或用户封面图像跟随转动操作进行偏移处理，得到偏移处理后的用户头像和/或用户封面图像；
124.和/或，
125.页面包括图像列表页面和/或图像详情页面；图像列表页面包含至少一个待选取的目标图像；图像详情页面包含目标图像以及目标图像的描述信息；第一3d图像包括目标图像；第二3d图像包括偏移处理后的目标图像；
126.第一交互模块920进一步适于：响应用户对展示终端的转动操作，在图像列表页面和/或图像详情页面中将目标图像跟随转动操作进行偏移处理，得到偏移处理后的目标图像。
127.可选地，页面还包括：图像概览页面；
128.装置还包括：第一弹出页面模块930，适于响应用户点击用户头像和/或用户封面图像的操作，弹出图像概览页面；图像概览页面包含用户头像和/或用户封面图像对应的目标图像；响应用户对展示终端的转动操作，在图像概览页面中将目标图像跟随转动操作进行偏移处理，得到偏移处理后的目标图像。
129.可选地，装置还包括：第一选取模块940，适于根据用户在图像列表页面中选取的目标图像，在用户主页中将目标图像作为用户头像和/或用户封面图像进行展示。
130.以上各模块的描述参照方法实施例中对应的描述，在此不再赘述。
131.根据本技术提供的图像交互展示装置，基于用户对展示终端的转动操作，将初始
展示的第一3d图像跟随转动操作进行偏移处理，得到交互后的第二3d图像，实现用户与图像的交互，呈现给用户裸眼视觉的立体变化空间感，提升用户观看图像的趣味性。
132.图10示出了本技术一实施例提供的图像交互展示装置的结构示意图。如图10所示，该装置包括：
133.第二初始化模块1010，适于在页面的展示区域中展示至少第一图像和第二图像；
134.第二交互模块1020，适于响应用户对展示终端的转动操作，增加第一图像的透明度，并同时降低第二图像的透明度。
135.可选地，第二初始化模块1010进一步适于：
136.响应用户触发的图像展示操作，在页面的展示区域中展示至少第一图像和第二图像；其中，第一图像的透明度低于第二图像的透明度。
137.可选地，第二交互模块1020进一步适于：
138.响应用户对展示终端的转动操作，跟随转动操作增加第一图像的透明度，并同时降低第二图像的透明度，以隐藏第一图像，展示第二图像呈现闪卡效果；其中，第一图像和第二图像调整的透明度根据终端转动角度确定；终端转角数据基于终端陀螺仪传感器感应用户的转动操作得到。
139.可选地，页面包括用户主页；展示区域包括用户头像展示区域和/或用户封面图像展示区域；
140.和/或，
141.页面包括图像列表页面；展示区域包括图像列表页面中待选取目标图像展示区域；
142.和/或，
143.页面包括图像详情页面；展示区域包括目标图像展示区域。
144.可选地，页面还包括：图像概览页面；
145.装置还包括：第二弹出页面模块1030，适于响应用户点击用户头像和/或用户封面图像的操作，弹出图像概览页面；图像概览页面包含用户头像和/或用户封面图像对应的目标图像；响应用户对展示终端的转动操作，在图像概览页面的目标图像展示区域中跟随转动操作调整目标图像中多个图像透明度，展示呈现闪卡效果的目标图像。
146.可选地，装置还包括：第二选取模块1040，适于根据用户在图像列表页面中选取的目标图像，在用户主页中将目标图像作为用户头像和/或用户封面图像进行展示。
147.以上各模块的描述参照方法实施例中对应的描述，在此不再赘述。
148.根据本技术提供的图像交互展示装置，基于用户对展示终端的转动操作，将初始展示的第一图像的透明度增加，并同时降低第二图像的透明度，实现用户与图像的交互，呈现给用户图像展示闪卡效果，提升用户观看图像的趣味性。
149.本技术还提供了一种非易失性计算机存储介质，计算机存储介质存储有至少一可执行指令，可执行指令可执行上述任意方法实施例中的图像交互展示方法。
150.图11示出了根据本技术一实施例的一种计算设备的结构示意图，本技术的具体实施例并不对计算设备的具体实现做限定。
151.如图11所示，该计算设备可以包括：处理器(processor)1102、通信接口(communications interface)1104、存储器(memory)1106、以及通信总线1108。
152.其中：
153.处理器1102、通信接口1104、以及存储器1106通过通信总线1108完成相互间的通信。
154.通信接口1104，用于与其它设备比如客户端或其它服务器等的网元通信。
155.处理器1102，用于执行程序1110，具体可以执行上述图像交互展示方法实施例中的相关步骤。
156.具体地，程序1110可以包括程序代码，该程序代码包括计算机操作指令。
157.处理器1102可能是中央处理器cpu，或者是特定集成电路asic(application specific integrated circuit)，或者是被配置成实施本技术的一个或多个集成电路。计算设备包括的一个或多个处理器，可以是同一类型的处理器，如一个或多个cpu；也可以是不同类型的处理器，如一个或多个cpu以及一个或多个asic。
158.存储器1106，用于存放程序1110。存储器1106可能包含高速ram存储器，也可能还包括非易失性存储器(non-volatile memory)，例如至少一个磁盘存储器。
159.程序1110具体可以用于使得处理器1102执行上述任意方法实施例中的图像交互展示方法。程序1110中各步骤的具体实现可以参见上述图像交互展示实施例中的相应步骤和单元中对应的描述，在此不赘述。所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的设备和模块的具体工作过程，可以参考前述方法实施例中的对应过程描述，在此不再赘述。
160.在此提供的算法或显示不与任何特定计算机、虚拟系统或者其它设备固有相关。各种通用系统也可以与基于在此的示教一起使用。根据上面的描述，构造这类系统所要求的结构是显而易见的。此外，本技术也不针对任何特定编程语言。应当明白，可以利用各种编程语言实现在此描述的本技术的内容，并且上面对特定语言所做的描述是为了披露本技术的较佳实施方式。
161.在此处所提供的说明书中，说明了大量具体细节。然而，能够理解，本技术的实施例可以在没有这些具体细节的情况下实践。在一些实例中，并未详细示出公知的方法、结构和技术，以便不模糊对本说明书的理解。
162.类似地，应当理解，为了精简本技术并帮助理解各个发明方面中的一个或多个，在上面对本技术的示例性实施例的描述中，本技术的各个特征有时被一起分组到单个实施例、图、或者对其的描述中。然而，并不应将该公开的方法解释成反映如下意图：即所要求保护的本技术要求比在每个权利要求中所明确记载的特征更多的特征。更确切地说，如下面的权利要求书所反映的那样，发明方面在于少于前面公开的单个实施例的所有特征。因此，遵循具体实施方式的权利要求书由此明确地并入该具体实施方式，其中每个权利要求本身都作为本技术的单独实施例。
163.本领域那些技术人员可以理解，可以对实施例中的设备中的模块进行自适应性地改变并且把它们设置在与该实施例不同的一个或多个设备中。可以把实施例中的模块或单元或组件组合成一个模块或单元或组件，以及此外可以把它们分成多个子模块或子单元或子组件。除了这样的特征和/或过程或者单元中的至少一些是相互排斥之外，可以采用任何组合对本说明书(包括伴随的权利要求、摘要和附图)中公开的所有特征以及如此公开的任何方法或者设备的所有过程或单元进行组合。除非另外明确陈述，本说明书(包括伴随的权
利要求、摘要和附图)中公开的每个特征可以由提供相同、等同或相似目的的替代特征来代替。
164.此外，本领域的技术人员能够理解，尽管在此的一些实施例包括其它实施例中所包括的某些特征而不是其它特征，但是不同实施例的特征的组合意味着处于本技术的范围之内并且形成不同的实施例。例如，在下面的权利要求书中，所要求保护的实施例的任意之一都可以以任意的组合方式来使用。
165.本技术的各个部件实施例可以以硬件实现，或者以在一个或者多个处理器上运行的软件模块实现，或者以它们的组合实现。本领域的技术人员应当理解，可以在实践中使用微处理器或者数字信号处理器(dsp)来实现根据本技术的一些或者全部部件的一些或者全部功能。本技术还可以实现为用于执行这里所描述的方法的一部分或者全部的设备或者装置程序(例如，计算机程序和计算机程序产品)。这样的实现本技术的程序可以存储在计算机可读介质上，或者可以具有一个或者多个信号的形式。这样的信号可以从因特网网站上下载得到，或者在载体信号上提供，或者以任何其他形式提供。
166.应该注意的是上述实施例对本技术进行说明而不是对本技术进行限制，并且本领域技术人员在不脱离所附权利要求的范围的情况下可设计出替换实施例。在权利要求中，不应将位于括号之间的任何参考符号构造成对权利要求的限制。单词“包含”不排除存在未列在权利要求中的元件或步骤。位于元件之前的单词“一”或“一个”不排除存在多个这样的元件。本技术可以借助于包括有若干不同元件的硬件以及借助于适当编程的计算机来实现。在列举了若干装置的单元权利要求中，这些装置中的若干个可以是通过同一个硬件项来具体体现。单词第一、第二、以及第三等的使用不表示任何顺序。可将这些单词解释为名称。上述实施例中的步骤，除有特殊说明外，不应理解为对执行顺序的限定。