“360° 图库”组件

AMPHTML 广告、视频广告和图片广告均不支持此组件。

通过“360° 图库”组件，您可以使用一组图片来展示对象旋转。默认情况下，最后一张图片会与第一张图片相接，因此用户不论是按顺时针方向还是按逆时针方向，都能顺畅地旋转对象。

以下示例使用了 7 张源图片：

选择适当的图库

Google Web Designer 有 4 种不同的图库组件：

• 360° 图库会显示对象不同角度的图片，使您能够前后滑动来旋转对象。360° 图库无法显示组或导航元素。
• 手滑式图库具有简单的平面外观，可让您纵向或横向滑动图片或组。
• 轮播式图库与手滑式图库类似，但轮播式图库会用 3D 外观显示相邻图片，就好像使用旋转显示器显示它们一样。
• 过渡效果图库可在您从一张图片切换到下一张图片的过程中提供一系列动画效果。

如需在项目中使用 360° 图库，请按以下步骤操作：

1. 打开组件面板，然后打开图库文件夹。

2. 将 360° 图库 组件拖到场景中。

3. 在属性面板的“360° 图库”属性部分，为该组件命名。

4. 使用下列方法之一向图库中添加图片：

   • 在属性面板的“360° 图库”属性部分，点击图片字段中的选择图库图片 按钮。然后，点击选择图片按钮以浏览图片文件，或者直接将所需文件拖到对话框中。
   • 找到“属性”面板的“360° 图库”属性部分，然后在图片字段中添加各图片的网址（网址间以英文逗号分隔）。

5. （可选）调整其他属性（具体说明见下文）。

要重排或移除图库中的图片，请执行以下操作：

1. 在属性面板的“360° 图库”属性部分，点击选择图库图片 按钮。
2. 如需重排某张图片的位置，请将其拖到新位置；如需从图库中移除某张图片，请将鼠标悬停在该图片上，然后点击删除 按钮。
3. 点击确定。

属性

属性	说明
名称	组件的名称。
图片	要在图库中显示的图片的网址（各图片间以英文逗号分隔）。可以绑定到动态数据。
自动播放	该属性处于选中状态时，图库会自动依次显示其中的每张图片。
首尾相接	该属性处于选中状态时，图库中的第一张图片会与最后一张图片相接。

事件和操作

“360° 图库”组件发送的事件

您可以基于“360° 图库”组件的以下事件来触发其他操作：

事件	说明
首次互动	用户首次与图库互动时发送。
已观看所有帧	图库的所有帧至少都已展示过一次时发送。
已加载图片	图库的所有帧均已加载时发送。
已显示帧	每个新帧显示完毕时发送。
帧被激活	帧开始出现变化时发送。
点按帧	用户点击帧时发送。

如需在事件对话框中选择上述某个事件，请将“360° 图库”组件设为目标。

“360° 图库”组件执行的操作

为了响应其他事件，可以触发“360° 图库”组件的以下操作：

操作	配置选项
转至帧	帧号 动画 -“无”或“滑动” 旋转方向 -“向前”或“向后”
旋转一次	轮播时间 - 以毫秒为单位的时间 旋转方向 -“向前”或“向后”
前进	无
后退	无

在事件对话框中选择上述某个操作时，请将“360° 图库”组件设为接收方。

不妨了解如何配置事件。

预览

在场景中，360° 图库仅会显示起始帧，以便您大致了解该组件的呈现效果。如需查看该组件实际的完整呈现效果，请点击右上角的预览按钮，在首选浏览器中预览文档。