您现在的位置:   首页 >> 新闻中心 >> 原型设计

Axure干货|制作移动APP端的左侧滑菜单

发布人:www.yunke.ai 发布时间:2021-01-01 153 次浏览

原型工具有多种,为何我确对Axure情有独钟? 看了你就明白他的强大。

本文重点是自己制作经验分享,视觉元素是次要(自己搞的界面,欢迎UI同学提上你的宝贵意见)。本次教程分享的是移动APP端的左侧滑菜单,在制作的时候,我们应该对左侧滑菜单有如下理解。

  • 侧滑菜单拉出需要触发条件,如必须从最左侧(或者靠近左侧一定范围)往右滑动才能拉出菜单。
  • 侧滑菜单需要对滑动距离应有一定的反应,如拉动距离不足10时候,菜单退回,距离大于10完全滑出。

以上就是对交互的重点,了解到上面的条件后,我们可以开始制作左滑菜单了。在这里,还有一个难点和重点需要和大家分享,如何在内联框架中的页面操作,影响父级页面的行为。解释一下,就是你在内联框架打开的子页面,发生事件后需要父级框架作出响应。

并且下期Axure教程预告-中继器元件大小,根据你录入的文字动态调整尺寸。

容器框架搭建及简单处理

框架搭建,主要是由三个元件构成,尺寸调制合适即可。

  • 外观框架(自己画的,简陋了点)
  • 底部导航栏-Tabbar
  • 空白页面-内联框架

事件设置-载入时在内联框架中打开首页。

首页搭建及简单处理

首页是我们对侧滑行为作出反应的操作页,一系列事件都需要在上面完成,下面直接使用我最近做的首页,只讲重点元件。