Axure之折叠窗效果

不器
3 评论 7986 浏览 5 收藏 4 分钟
🔗 B端产品经理需要更多地关注客户的商业需求、痛点、预算、决策流程等,而C端产品经理需要更多地关注用户的个人需求

编辑导语:折叠窗效果是产品的一个基础功能,那么如何用Axure制作呢?本文仔细介绍了通过Axure RP9实现折叠窗效果的详细步骤和注意事项,希望对读者有所帮助。

1、 假设做三个标题和三个标题的子内容

2、 先做三个标题的面板,三个子内容面板

三个标题面板:A1,B1,C1

三个子内容面板:a1,b1,c1

3、 设置标题面板和子内容面板的尺寸

标题面板:700,50

子内容面板:700,350

4、将标题面板和子内容面板按照顺序从坐标(0,0)位置排列好

A1,a1,B1,b1,C1,c1

4.1 给A1增加两个状态:展开和折叠,默认展开

4.2 给B1增加两个状态:展开和折叠,默认展开

4.3 给C1增加两个状态:展开和折叠,默认展开

如下图所示:

5、 添加事件(只需给A1,B1,C1添加事件即可)

5.1 给A1添加事件(把产能标题面板看做A1,产能分析面板看做a1)

总结:第一个面板的事件主要是单击事件,包含两种情景:每个情景包含设置标题面板A1的状态、设置子内容面板显示/隐藏、移动下一个标题面板B1

5.2 给B1添加事件(把业务标题面板看做B1,业务分析面板看做b1)(把订单标题面板看做C1,订单分析面板看做c1)

总结:第二个面板(中间)的事件主要是单击事件、移动事件,单击事件包含两种情景:每个情景包含设置标题面板B1的状态、设置子内容面板显示/隐藏、移动下一个标题面板C1,移动事件是设置b1和C1跟随B1的移动而移动。

备注:如果中间还有面板,添加事件跟B1类似,类比添加即可

5.3 给C1添加事件(把发货标题面板看做C1,发货分析面板看做c1)

总结:第二个面板(最后)的事件主要是单击事件、移动事件,单击事件包含两种情景:每个情景包含设置标题面板B1的状态、设置子内容面板显示/隐藏,移动事件是设置c1跟随C1的移动而移动。

 

本文由 @不器 原创发布于人人都是产品经理,未经许可,禁止转载

题图来自 Unsplash,基于CC0协议

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 干货满满,感谢作者!

    来自江苏 回复
  2. 虽然是知道的,但是系统的列出来还是没有看到,不错,感谢作者!

    回复
    1. 共同交流学习进步

      来自湖北 回复
专题
13283人已学习15篇文章
私域流量是与公域流量相对的概念,本专题的文章主要通过几个核心的问题,为大家解读私域流量背后的底层逻辑。
专题
16573人已学习14篇文章
RFM模型是与用户价值相关的常见模型之一。本专题的文章分享了什么是RFM模型?如何应用RFM模型?
专题
36524人已学习17篇文章
如果你们有志于在运营路上深耕,并实现快速成长,你需要知道以下这些!
专题
13373人已学习13篇文章
本专题的文章分享了如何打造用户“上瘾”的产品。
专题
12862人已学习12篇文章
数据挖掘是指从大量的、不完全的、有噪声的、模糊的、随机的数据中通过算法搜索隐藏于其中信息的过程。本专题的文章分享了如何挖掘数据。
专题
60157人已学习20篇文章
想转行做产品经理,这个专题值得一看,看看前人是怎么做到的。