动态菜单效果的实现
动态菜单
知识点：
教学开始：
说明：打开全景后，如果该节点在用户数据的描述项和标题项中有内容，菜单会动态滑出。菜单包含用户数据中的标题和用户数据中的描述，点击菜单，可以查看更多的描述内容，如果用户数据的描述项中没有内容，则进入该节点后，该菜单不显示。效果如下：
实现步骤：
打开Pano2VR软件，并添加3张（或多张）全景图，在节点1和节点3的用户数据中，标题和描述项分别添加内容，节点2的描述项留空。如下图所示：
注：点击用户数据面板中的各个内容项右侧的小按钮，可打开文本编辑框，可以输入更多文字，且支持富文本格式。
增加一个Web输出，并点击编辑皮肤图标，新建一个皮肤，并保存到和项目工程一个目录里，命名为 skin.ggsk。
在皮肤编辑器中，创建两个变量。如下图所示：
title_move：这个变量类型为数字，初始值为 0，用来控制菜单运动。
vis_text：这个变量类型为条件判断，初始值为 假 ，用来控制内容弹窗是否显示。
在 画布中，创建项目所需的各类元素，如下图所示，起好对应的名字，并调整正确的父子关系。
计时器：相关参数如下：
在计时器卷展栏，参数设置如下图所示：
注释：当全景图片加载完毕后，计时器开始计时，一秒后停止。然后再次开始计时，停止，重复运行！
在动作卷展栏中，添加如下图所示动作：
动作说明：
停用 ：计时器运行一秒，停止后，给指定变量 title_move 加 1 。计时器重复运行，该变量数值会持续累加。
在跳转节点前 ：全景场景发生改变前，将指定变量 title_move 值设为 0 。这样进入下一个场景后，该变量会从 0 开始。
停用 ：计时器停止时，将计时器自己的超时时间设为一个较大的值，此处为 10000 。但是停用这个动作有过滤器，也就是附加条件，当满足这个附加条件的时候，才会执行这个动作。这个动作整体作用是当指定的这个变量 title_move 值大于等于3的时候，定时器将自己的超时时间设为 10000 。这样计时器会长时间的运行，不会停用，指定的变量累加到大于等于 3 后就停止累加，有效避免浪费系统资源。看下图。
节点已跳转 ：进入新的场景后，将计时器的超时时间重新设为 1 秒。计时器开始重复运行，指定变量 title_move 重新开始累加。
在跳转节点前 ：全景场景发生改变前，将指定变量 vis_text 设为“否”，目的是进入新的场景后，关闭上一个场景中的弹窗介绍。
弹窗背景：由绘制矩形元素构成，用于显示内容弹窗的背景。相关属性设置如下：
位置：弹窗背景从左上角开始，百分之百的显示尺寸，确保覆盖整个全景画面。
外观：通过Alpha值的逻辑块，控制自身是否透明。
Alpha值的逻辑块：
打开Alpha值（透明度）的逻辑块，当变量vis_text等于假的时候，将自身的Alpha值设为 0 。并启用过渡效果，可以让背景实现渐隐渐现的效果。如下图所示：
矩形：
背景色彩：
在矩形卷展栏中，设置背景中的色彩为黑色，边框中的宽度为0。点击颜色块，可打开颜色拾取器，背景色中的透明通道值为 255 的时候，不透明。此处设为200，具有一定的透明度。如下图所示：
关闭：添加关闭按钮，并设置位置属性。
添加关闭按钮：此处使用Lottie动画按钮作为关闭按钮，并不是必须的。可以自己选择任意图标作为关闭按钮使用。在皮肤编辑器右侧，点击组件箱按钮。
在组件箱中，选择添加一个lottie动画元素。
位置：关闭按钮和背景的右上角对齐，并设定一定的距离。
动作：
动作说明：
鼠标单击 ：点击关闭按钮的时候，将变量 vis_text 设为假，实现关闭弹窗。
描述：弹窗背景下的描述是一个文本元素。
位置: 相对于父物体背景，X 为居中对齐，Y 为距离上边 20%，并再向下移动 30 像素。标题的高度是 30 像素，这样保证描述和标题不重叠。
矩形: 背景不开启，边框为 0 。
文本: 占位符 $(ud)，可以调用用户数据中对节点的描述项。
标题：弹窗背景下的标题是一个文本元素。
位置: X 居中，Y 距上边 20% 。
矩形: 背景不开启，边框为 0 。
文本: 占位符 $(u) 可以调用用户数据中的标题项。其他参数看下图。
菜单容器： 是由绘制容器元素创建，用于控制菜单标题，菜单描述等元素。
位置: 以浏览器左下方为基准，X 和 Y 都相距 20% 。此处数值可以根据自己的界面布局需要调整。
外观: 蒙版开启，可实现容器外部的元素 标题和描述不显示。
Alpha值的逻辑块：
打开Alpha值（透明度）的逻辑块，将变量vis_text等于真作为触发条件，此时Alpha值设为0。并启用过渡效果，可以让菜单容器实现渐隐渐现的效果。整体效果是在弹窗出现的时候，菜单元素隐藏。如下图所示：
动作:
动作说明：鼠标单击菜单，将变量 vis_text 设为真，实现隐藏自己，和显示弹窗。
鼠标单击 ：
菜单标题： 是一个文本元素。
位置: 以父物体容器为基准，X 为400 ，Y 为 0 ，使标题处于容器外部。
位置的逻辑块：变量 title_move 大于等于 1 的时候，X 设为 0 。并启用过渡效果，使菜单标题 X 位置从 400 变为 0的时候，产生移动动画效果。
外观: 取消可见，用逻辑块控制自己是否可见。
可见的逻辑块：当用户数据描述项不等于空，而且变量 title_move 不等于 0 的时候，菜单标题可见。
矩形:
色彩的逻辑块：可以自定义两种颜色，一个用于默认，另一个用于鼠标悬停。
文本：使用 $(ut) 占位符，其他参数对照下图。
菜单描述： 是一个文本元素。
位置：菜单描述的位置和逻辑块作用参考菜单标题的介绍。
位置的逻辑块：菜单描述的位置和逻辑块作用参考菜单标题的介绍。
外观：菜单描述的可见和逻辑块作用参考菜单标题的介绍。
可见的逻辑块：
矩形:
色彩的逻辑块：可以自定义两种颜色，一个用于默认，另一个用于鼠标悬停。
文本:
ht_node： 是交互热点模板，用于场景交互漫游。
保存皮肤，并输出。
根据上述参数设置，可实现动态菜单效果。