童话说说技术创业美文职业
快好知
职业母婴
职场个人
历史治疗
笔记技能
美文纠纷
幽默家庭
范文作文
乐趣解密
创业案例
社会工作
新闻家居
心理安全
技术八卦
仲裁思考
生活时事
运势奇闻
说说企业
魅力社交
安好健康
传统笑话
童话初中
男女饮食
周易阅读
爱好两性

用Axure做出手风琴式联动交互效果

10月10日 心碎巷投稿
  联动效果是一种较为常见的交互效果,本文将利用另外一种思路来教大家设计联动交互效果。
  联动效果很常见,例如填写地址时,选择某省份,会自动出现本省份的市县,选择某户主信息,会自动出现该家庭成员全部姓名等,可能省市下拉列表很常见,本文将提供另外一种思路,如下图:
  手风琴式二级联动应用场景:
  应用场景1:电商后台用户管理系统,选定特定标签的用户,发送特别的福利卡券或者站内营销短信;
  应用场景2:公司内部OA系统,公司秘书办需要通知各部门主管召开部门总结会议,只给主管发送邮件通知;
  如何制作手风琴式二级联动交互?
  上图案例中,有两个交互效果:
  效果1:隐藏和展开
  默认显示财务部人员列表,点击技术部时,财务部列表隐藏,技术部展开,点击运营部时,运营部展开,其他两个部门列表隐藏;
  这就是手风琴风格。
  效果2:描红出现选中名单
  点击人员姓名,该姓名出现在右侧选择人员框中(点击右侧的号,可以删除选中的人员),且该人员姓名描红,
  如何实现效果1和点击描红?
  拉入矩形元件,分别命名为财务部,技术部,运营部,输入对应的文本内容;
  设置为同一选项组,设置选中效果,默认“财务部”为选中状态;
  分别拉入中继器命名为“财务部”“技术部”“运营部”,在中继器中,命名元件为“内容1”;
  拉入一个,设置的选中状态为红色,将和“内容1”合并组合;
  鼠标点击“内容1”时,选中该组合。
  该中继器加载时,里面为人员姓名“朱明”“刘红”“王刚”:
  将财务部中继器右键设置为动态面板,命名为“1”其他部门中继器也分别设置为动态面板“2”,“3”:
  设置动态面板2,3载入时,隐藏并推动元件:
  鼠标单击财务部时,选中该元件,并且设置显示动态面板“1”推动元件。
  完成,预览,点击技术部时,财务部列表隐藏,技术部展开,点击运营部时,运营部展开,其他两个部门列表隐藏;手风琴效果完成。
  常规二级联动效果做法如下,最简单
  第一步:拉入下拉列表框
  拉入第一个下拉列表框;
  把该下拉列表命名为“省”;
  添加子列表,案例中添加了3个省份;
  广东省,2请选择(什么都不选时,默认内容),3河南省。
  拉入第二个下拉列表框,转化为动态面板,命名为“市”;
  添加三个面板,分别命名为“请选择”“河南省”“广东省”和上个下拉列表元件省份名字一一对应。
  第二步:添加用例
  “省”下拉列表元件添加用例,当选项改变时,设置“市”动态面板切换,切换状态为值V
  将Value的值赋值给“省”元件的被选项,当用户选择“省”某一选项时,“市”动态面板自动切换为对应的状态。
投诉 评论 转载

AxureRP9教程:记录你的能力值本案例制作一个可拖动的条形进度条,同时可以显示当前位置的百分比。一起来看看实现效果:自由拖动进度条记录当前进度条的百分比顺便记录下你的颜值实现逻辑……Axure:图片切换放大、缩小效果展示(下)这篇是对上一篇文章《Axure:图片切换放大、缩小效果展示》的两点改进,改进一,优化事件写法,提高制作效率;改进二,自动播放效果。先看下完成的效果:step1:效率……Axure:图片切换放大、缩小效果展示下面分享一个常见的图片切换效果(放大缩小的感觉),要学会该效果,需掌握两个知识点:改变组件尺寸和移动组件位置。先看下完成的效果:step1:基础知识点掌握1。……AxureRP9教程:环形进度条环形进度条的制作需要克服两个点:第一,如何用Axure自带的素材画出进度条,第二,如何使用交互实现进度条读取的效果。本案例将使用AxureRP9示范制作进度条的方法。实现……Axure制作页面下拉时,顶部导航浮动并切换的交互效果如何利用Axure做出页面下拉时顶部导航浮动并切换的交互效果?本文将分别讲述移动端和PC端应该如何做。通常在一些大型的电商网站常见,首页内容下滑时,超过顶部导航高度时,顶……用Axure做出手风琴式联动交互效果联动效果是一种较为常见的交互效果,本文将利用另外一种思路来教大家设计联动交互效果。联动效果很常见,例如填写地址时,选择某省份,会自动出现本省份的市县,选择某户主信息,会自……Axure制作网页回到顶部的交互效果网站页面内容过多,需要下拉滑动,但又想快速回到顶部,右下角会出现回到顶部的按钮或图标,点击该图标,浏览器会快速切换到页面顶部,这个交互效果该如何实现呢?常见的回到顶部场景……AxureRP9教程:模拟拨号键盘文章主要讲解如何利用AxureRP9来模拟拨号键盘,一起来看看效果如下:效果描述:按下数字按钮,输入对应的数字,按下退回按钮删除上一步的数字。当有数字时,显示添加号……Axure版跳一跳如何制作?下班前看到一个群友发了一张“跳一跳”的动效图,觉得挺好玩的,就随手也做了“Axure版跳一跳”。以下是原理分析、实现步骤。演示地址:Axure版跳一跳实现效果:……用Axure设计60S倒计时很多互联网平台,采用手机号注册时,都要获取验证码,如何在原型中做到点击获取验证码按钮,上面会和真实注册一样,出现倒计时?倒计时60S结束后,文案又恢复为获取验证码?如下图……如何用AXURE做出密码可见隐藏的交互效果?如何用AXURE做出密码可见隐藏的交互效果?本文将用实例为大家作出解答。很多时候,我们发现一些网站的登录页面,密码输入框栏目右侧,有一只可点击的眼睛开关,或者是滑动开关,……如何在Axure原型中嵌套百度地图?如何在Axure原型中嵌套百度地图?一起来文中看看首先我们要准备好页面的元件,从元件库中拉出内联框架。我们先给内联框架一些基本配置:然后,打开百度地图开放平台……
网站用户体验重要性如何交换友情链接?关于交换友情链接视频如何做SEO优化流量网站如何做优化黑帽seo优化的贡献新站优化思路分析网站内链如何优化不利于百度收录的网站提高网站关键词排名方法网站优化工作计划如何选择自己核心关键词?
传统节日话中秋一带一路全球行醉美宁夏钙离子荧光探针丨AATBioquest丨派克生物解决方案长歌行做销售的我们这些人真正知道什么是销售么销售的核心初三考生物理答题技巧花粉必备华为多款移动电源让你出门在外再不用担心手机没电让风留下为阻止中国2032年超越,美国使出两手阴招!今日,股市突然大跌,传递什么信号?城市普通垃圾来源有哪些医疗事故死人的赔偿标准热议聚热点网

友情链接:中准网聚热点快百科快传网快生活快软网快好知文好找作文动态热点娱乐育儿情感教程科技体育养生教案探索美文旅游财经日志励志范文论文时尚保健游戏护肤业界