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

Axure教程:动态面板实现侧滑菜单

10月2日 星宿房投稿
  如何利用动态面板来实现侧滑菜单呢,一起来文中看看
  利用动态面板实现侧滑菜单效果,实现过程如下:
  1、准备首页,标题栏添加一个菜单按钮,用于控制抽屉菜单打开。
  2、添加一个动态面板组件,将动态面板拖放到最终显示的位置,设置动态面板的宽、高,动态面板的宽度比实际屏幕的宽度小,预留右侧的空白;动态面板的高度,根据需要设置是否包含标题栏。
  如下图所示:
  3、动态面板位置、大小设置完成,接下来,设置动态面板的2个状态。双击动态面板,弹出“面板管理状态”弹框,默认状态是state1,重命名为“侧滑前”,增加一个状态,重命名为“侧滑后”。
  4、编辑状态。“侧滑前”的状态页面,不添加任何内容。双击“侧滑后”,编辑抽屉菜单页,添加组件,如下图:
  2个状态的顺序需要注意:侧滑前的状态要在前。
  (为了使动态面板不影响其他组件的编辑,在状态编辑结束后,将动态面板的顺序设置为“置于底层”)
  5、给菜单按钮绑定单击事件。在开始绑定点击事件前,还有一件事情需要做,设置一个全局变量isSlide,用来判断菜单是否已经侧滑,默认值设为false。(全局变量在工具栏“项目”中打开,具体不细说)
  选中菜单按钮,切换到属性页面,双击“鼠标单击时”,添加点击用例。当变量值isSlidefalse时,菜单按钮的点击事件为打开侧滑菜单;当isSildetrue时,菜单按钮的点击事件为关闭侧滑菜单。
  如下图所示,为点击事件的具体用例:
  打开菜单:
  1)添加用例时,添加一个判断条件,isSlidefalse。
  2)将动态面板的顺序,设置为顶层。(原先我们为了方便其他组件编辑,将动态面板设置到底层,所以在这里,要将其设置回顶层,如果没有设置到底层,这一步可以省略)
  3)设置动态面板的状态。设置为侧滑后状态,设置状态面板切换状态时的动画以及动画展示的时间。
  4)将全局变量isSlide修改为true。
  关闭菜单:
  1)添加用例时,添加一个判断条件,isSlidetrue。
  2)设置面板状态,设置为侧滑前状态,设置动画以及动画展示事件。
  3)重新将动态面板的顺序设置为底层。(同样,如果没有设置底层的需求,这步可省略)
  4)将全局变量isSlide修改为false。
  总结:
  添加动态面板,设置动态面板最终显示位置和大小。
  设置动态面板的2个状态,侧滑前和侧滑后。2个状态的顺序为:”侧滑前“在前。
  增加全局变量isSlide,判断菜单打开的状态。
  设置触发按钮的点击事件,根据isSlide的值,设置用例:打开菜单、关闭菜单。用例内容包括:切换状态面板的顺序层级(非必须);设置面板状态(侧滑前,侧滑后),含动画和动画时间修改全局变量isSlide的值(true,false)。
  以上,结束
投诉 评论 转载

中继器系列(二):信息修改之前发布了《中继器系列一:信息新增、删除、简单筛选》,少了一个信息的修改功能,于是抽时间完善一下。系统化的实现增删改查的功能。一、前期准备电脑:mac和win都可以……Axure:如何实现下拉刷新的效果?如何利用Axure去实现下拉刷新的效果?一起来文中看看思路如下:拖动页面,显示箭头朝下的图标,文字提示“下拉刷新”;继续拖动,当拖动高度60时,显示箭头……Axure如何实现同页面上下、左右滑动在我们打开任何手机app滑动的手势最多的永远是两种,上下滑动与左右滑动,这个原型是如何在Axure里面怎么体现出来的呢?接下来我就来告诉大家。要完成这看似简单的操作,其实……Axure教程:为图片添加标签本文介绍如何利用中继器实现给图片打标签的效果,enjoy通常来说,有动态内容变化就要用到函数,有相同的数据增添删改的效果就要用到中继器,所以这篇文章就讲的是利用中继器实现……Axure:文字跑马灯效果日常学习之跑马灯的效果希望内容能对大家有帮助。效果如下图o()o思路:文字元件移动动画效果,实现滚动的效果;利用动态面板控制跑马灯文字在规定区域内滚动;……Axure教程:动态面板实现侧滑菜单如何利用动态面板来实现侧滑菜单呢,一起来文中看看利用动态面板实现侧滑菜单效果,实现过程如下:1、准备首页,标题栏添加一个菜单按钮,用于控制抽屉菜单打开。2、添……Axure教程:如何实现顶部tab式导航栏?如何实现顶部tab式导航栏?来文中看看实现的效果:点击tab,切换对应的内容页面,指示标识移动到对应选中tab。思路:通过动态面板实现内容页面切换,n个tab……Axure小元件(二)密码设置本例小元件包括密码一致、可见等小功能;同样可以放在自己元件库中备用。一、密码设置创建两个动态面板,分别命名为“新密码”、“确认密码”;为它们添加两个状态,“明文”和……IBM高级设计师分享:你真的懂如何做原型设计吗?工作中常常出现这种情况:你花了无数个小时构思、设计理论模型,到了投入生产才发现完全忘记放上标识了。事实上,我们太容易陷入一个完美的产品快照中。为了提升你的设计能力,你需要专注于……Axure教程:多页签可滚动的选项卡制作(附源文件下载)选项卡,就是用多个页签来切换展示不同的功能页面,通过点击相应页签来切换相应选项卡页面的效果,相信大家在绘制原型中常常会遇到,并不陌生。但是如何优化选项卡的展示效果?以及如果选项……Axure:实现可拖动进度条怎样用Axure实现拖动进度条?一起来看下吧可拖动进度条的应用场景,例如调节APP屏幕亮度,音乐播放器的音量等。效果如下()准备4个元件,如下所示:一个……Axure小元件(一)获取验证码这个控件是我们在平时写原型时经常用到的,希望能对小白有点帮助(本人菜鸟),高端人士请绕过。一、创建一个自己的元件库创建自己的元件库,在今后使用这些控件的时候就不需要……
微信视频号将走向何处?淘宝VS京东:盘点“购物车”功能的差异竞品分析滴滴VS嘀嗒VS帮邦行:网约车市场的生存法则是?竞品分析报告:下厨房孵化懒饭,意义何在?竞品分析报告:盒马鲜生VS京东到家全民远程办公,华为云WeLink与飞书的后发优势如何?消费领域信息分享平台一分钱APP的产品分析报告“网易严选”产品分析:新消费之下的“无印良品”美图秀秀产品分析报告丨工具类产品的转型之路疫情专题,各大APP都是怎么做的丁香医生VS搜狗:疫情动态哪家强?微信视频号详细版体验记录

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