有问题要问或要分享想法？ 欢迎加入 Adobe XD 社区。 我们很乐意倾听您的心声并欣赏您的创意作品！
上次更新日期：
2022年1月11日
了解如何在 Adobe XD 中使用视频为交互式体验制作原型。
您可以为视频选择预设或自定义播放选项，并定义其他交互如何作用于该视频。 在探索视频播放选项和交互时，请查看一些与视频相关的原型制作逼真示例。
开始之前
了解如何导入视频并调整设置。
播放选项及其关联的交互
在“设计”模式下设置视频的播放选项时，将自动在“原型”模式下设置关联的交互。
在选择点击播放时，将自动设置点击触发器，其默认操作为切换播放/暂停。
当选择自动播放时，时间触发器会自动设置为 0 秒延迟。
当选择不播放时，将不会在“原型”模式下创建任何交互。
自定义视频播放
要自定义视频播放，请在“属性检查器”的“视频”部分中选择“编辑播放”。
当选择“编辑播放”时，将自动切换到“原型”模式。
在“原型”模式下，可选择以下这些自定义的任何一个：
选择下列触发器之一：时间（将延迟设置为大于 0 秒）、按键和游戏手柄或语音。
将点击触发器的视频播放操作从切换播放/暂停更改为播放或暂停。
您不能将视频设置为使用“拖动”触发器播放。
将视频播放与其他交互结合使用
根据您为其他对象设置的交互，您的视频将停止或继续播放：
- 在触发自动制作动画和 Lottie 播放以外的操作时，视频将停止播放。
- 如果您希望在将鼠标悬停在其他对象上或点击其他对象时，视频继续播放，请使用自“动制作动画”作为“悬停”和“点击”触发器的操作。
“视频”和“时间”触发器
在任意给定的画板上：
- 您可以设置多个时间触发器。交互将根据其时间延迟按序列播放。
- 您可以设置一个视频和多个 Lottie 动画自动同时播放。
- 如果您在画板、视频和 Lottie 上设置具有相同时间延迟的时间触发器，优先级为：画板 > 视频 > Lottie。
原型制作示例
现在您已了解如何为视频设置播放选项并将它与其他交互连接，下面我们尝试一些示例。
了解如何为视频的最大化按钮制作原型。
Ex 1-artboard 1
- 在“设计”模式中，导入"提示 1"视频，并将该视频放置在画板上。 将视频设置为“点击播放”。
- 将“最大化”图标（包含在画板右侧的“图标”部分中）放置在视频的右下角。
- 在“原型”模式中，将“最大化”图标连接到 Ex 1-artboard 2，并将它设置为“点击”触发器且“操作类型”为“自动制作动画”。
Ex 1-artboard 2
- 在“设计”模式中，导入"提示 1"视频，并将该视频放置在画板上（全屏视频）。 将视频设置为“点击播放”。
- 将“最小化”图标（包含在“图标”部分中）放置在视频的右下角。
- 在“原型”模式中，将“最小化”图标连接到 Ex 1-artboard 1，同时将它设置为“点击”触发器，并将“操作类型”设置为“自动制作动画”。
在连接完交互后，预览原型并检查交互。
了解如何在 XD 中连续播放视频。
Ex 2-artboard 1
- 在“设计”模式中，导入“简介”视频，并将该视频放置在“简介”部分中。 将视频设置为“不播放”。
- 导入“提示 1”和“提示 2”视频，并将它们放置在“提示”部分中。 将视频设置为“不播放”。
- 在所有视频上放置“播放”按钮的副本（包含在“图标”部分中）。
- 在“原型”模式中：
- 将“简介”视频上的“播放”按钮连接到 Ex 2-artboard 2。
- 将“提示 1”视频上的“播放”按钮连接到 Ex 2-artboard 3。
- 将“提示 2”视频上的“播放”按钮连接到 Ex 2-artboard 4。
将视频全部设置为“点击”触发器，并将“操作类型”设置为“过渡”。
Ex 2-artboard 2
- 在“设计”模式中，导入“简介”视频，并将该视频放置在“提示”部分的上方。 将视频设置为“自动播放”。
- 在“原型”模式中，将视频连接到 Ex 2-artboard 3，同时将它设置为“播放结束”触发器，并将“操作类型”设置为“过渡”。
Ex 2-artboard 3
- 在“设计”模式中，导入“提示 1”视频，并将该视频放置在“提示 1”部分的上方。 将视频设置为“自动播放”。
- 在“原型”模式中，将视频连接到 Ex 2-artboard 4，同时将它设置为“播放结束”触发器，并将“操作类型”设置为“过渡”。
Ex 2-artboard 4
- 在“设计”模式中，导入“提示 2”视频，并将该视频放置在“提示 2”部分的上方。 将视频设置为“自动播放”。
- 在“原型”模式中，将视频连接到 Ex 2-artboard 1，同时将它设置为“播放结束”触发器，并将“操作类型”设置为“过渡”。
在连接完交互后，预览原型并检查交互。
探索与视频、Lottie 动画和组件状态相关的更多示例。
了解详情
观看这段为时 2 分钟的视频，了解有关在 XD 中使用视频的一些专业技巧。
相关资源
有疑问或想法？
