AxureRP8实战手册-案例28(组合:弹出菜单效果)

AxureRP8.0教程 小楼一夜听春语 14413℃ 0评论

案例28. 组合:弹出菜单效果

案例来源:

网易云课堂-用户功能列表

 

案例效果:

  • 鼠标移入头像前:(图3-1)

3-1

  • 鼠标移入头像后:(图3-2)

3-2

案例描述:

鼠标移入用户头像时逐渐显示用户面板,鼠标移出时隐藏用户面板。

 

元件准备:

  • 页面中:(图3-3)

3-3

包含命名:

  • 组合(用于统一显示面板内所有内容):UserGroup

思路分析:

如果想让一组元件统一显示与隐藏,可以将这组元件进行组合或转换为动态面板,然后对组合或者面板进行可见性的动作设置。在这个案例中,这里我们通过组合来实现。

 

操作步骤:

1、选取所有需要统一显示或隐藏的元件,按快捷键<Ctrl+G>键将它们设置为同一组合,默认隐藏组合并命名组合;

2、为“头像”元件的【鼠标移入时】事件添加“用例1”,设置动作为【显示】组合“UserGroup”;设置{动画}为【逐渐】显示,{时间}为“500”毫秒;设置{更多选项}为【弹出效果】。

  • 用例动作设置:(图3-4)

3-4


~~~~~~~~~~~~ 正文结束 下面没了 ~~~~~~~~~~~~

小楼老师再出新作,倾力打造Axure RP 8精品课程系列,以最短的时间高效完成学习目标,入门进阶与实战案例并重,是0基础的新手从入门到精通的必备课程。

《AxureRP 8 入门与实战 - 入门篇》------从零入门进阶的最佳课程------【点此查看详情】

《AxureRP 8 入门与实战 - 案例篇》------实战手册图书的同步视频------【点此查看详情】


转载请注明:Axure原创教程网 » AxureRP8实战手册-案例28(组合:弹出菜单效果)

喜欢 (28)or分享 (0)
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(4)个小伙伴在吐槽
  1. 这个有瑕疵,在实战案例中不可能只是这一个功能,是有好多功能的组合,例如你说的,鼠标移到头像位置显示出动态面板,移出时隐藏动态面板,这样的话我不能单击动态面板里面的任何原价。 解决方案:用动态面板加热区来实现移除隐藏不过需要加很多热区做为隔开,因为设想旁边也是个有下拉的话动态面板大了会妨碍旁边的功能
    不知道2016-07-11 17:48 回复
    • 小楼一夜听春语
      这个案例的知识点就是解决你所描述的问题。如果你按操作步骤2做了后面的【弹出效果】设置,就不该有这样的评论。而且,案例中没有给鼠标移出时添加隐藏的交互。【弹出效果】能够让鼠标指针在头像和菜单区域内时,保持显示的菜单不会隐藏,而指针离开这两个区域才会隐藏菜单。建议学习要仔细,特别是之前如果有接触过Axure的话,反而容易忽略一些内容。
      小楼一夜听春语2016-07-11 18:20 回复
      • 果然是这样的,如果不加弹出效果,那么鼠标移出后不会隐藏,加了弹出效果后,刚刚好解决这个问题,谢谢!
        whatmaller2016-08-23 17:39 回复
        • 为什么我按头像没有弹出 是怎么回事
          牛多多2017-03-10 14:38 回复