AXURE-超详细折叠菜单实现
这个折叠菜单简把我弄崩了,苍天呀,这里记录一下,希望后来的人少入点坑
所用版本为最新的Axure 8.0,我还不怎么会用动态面板呢,难死宝宝了
1.最终效果图
变成
再变成
实现步骤1
1,首先建立一个动态面板,左边的元件区拖出来就可以了(这个地方先不要改动态面板的属性:自动调整为内容尺寸,一会在改,将改动态面板取名为1。
2.进入动态面板1的State1,画一个黄色的矩形和黑色的矩形,将黑色矩形的属性改为隐藏,排列成下图
2. 创建动态面板1的State2
同样的在State2中画一个相同的黄色矩形和黑色矩形,唯一不同的地方是State2的黑色矩形的状态是可见的,不是隐藏的,见下图
此时一定要检查一下动态面板1的属性:自动调整为内
内容尺寸 前面打了勾,
3,给动态面板1添加鼠标单击时间
选择State1的黄色矩形,点击属性里的鼠标单击事件,
注意上面这些地方
4,给折叠菜单加上点一下收回来的效果
同样的找到State2的黄色矩形,找到它的鼠标单击事件。
5,回到主页面,我经常搞错,玩命的单击某一个原件,后来发现这个元件和我想操作的所在页面不一致,感觉尬尬的
6,将动态面板1复制一份,将两个黄色矩形放在一起,预览看效果
这样就可以了,真的可以,嘿嘿嘿