最近刚刚学axure的使用，根据现有学习到的知识制作了一个web左侧菜单，如有不足麻烦见谅。

制作出来的效果如下图

具体的制作方法：

1、添加需要的所有元件，其实就是几个矩形；所有元件进行布局好，布局好如下图

布局

要实现点击“菜单一”后菜单一下方的子菜单隐藏，在隐藏之后一下的所有元件自动移动菜单一下方，那么具体需要移动多少距离呢？我的思考就是把子菜单中的所有项组成一个动态面板，那么移动距离就是这个动态面板的高度，这样我们就可以使用[[This.height]]来获取需要移动的距离；

好处是即使后面再加子菜单，只需要拉长动态面板即可，不需要知道拉了多高。

然后我们就把所有子菜单转换成动态面板，并且命名（我就直接命名成中文，英文水平真的太次）；设置好后的概要如下图

2、制作交互：点击菜单一后，需要隐藏菜单一下的子菜单，那么我们就选中菜单一元件，双击“鼠标点击时”进入设置界面，我们是为了设置点击菜单一能隐藏/显示子菜单，所以需要选中的是“切换”项；设置完后如下图

设置好后就实现了菜单一下的子菜单会随着点击菜单一而显示隐藏，那么在隐藏的时候，需要把菜单一子菜单下方的所有元件向上移动动态面板“菜单一子菜单”的高度，选中动态面板“菜单一子菜单”，双击“隐藏时”进入设置交互界面

点击“移动”，然后选中元件菜单二（由于我把菜单二命名为menu2，所以我选中的是menu2），移动方式为“经过”，由于是垂直移动，所以x轴设置为0，y设置的就是移动菜单一子菜单动态面板的高度，通过点击后面的fx进入设置；由于是需要向上移动，所以设置的值是负数，即“[[-This.height]]”

设置好“菜单二”元件，那么菜单二下面的所有元件也是通过相同的方法进行设置，设置完后如下显示

到此点击菜单隐藏子菜单的交互设置完成，这个时候需要考虑当子菜单在显示的时候呢？如果在显示，我们就把对应的元件向下移动对应的距离，即[[This.height]]距离

当显示时，我们就需要双击属性中的“显示时”进入设置，设置完后如下图

到此就设计好了点击菜单一的所有交互，那么点击菜单二的时候呢？通过思考，点击菜单二的时候，菜单二以上的所有元件位置不会有变化，只有菜单二下方的才会变化，那么就可以按照设置菜单一交互的方式进行设置，以此类推设置菜单三（如果还有更多的菜单，设置方法一样）；

所有的设置项如下图，最后一个动态面板没有设置任何交互。

到此所有设置完成，点击预览即可达到最前面那个动态图的效果。

欢迎批评交流，共同进步，谢谢