全国服务热线:4006-028-024 成都热线:028-86633922
新闻中心网站专题联系我们
行业新闻 建站经验 网站建设资讯 手机网站资讯 微信开发资讯 APP开发资讯 商城网站资讯

成都APP开发:使用axure制作APP吸附菜单的方法

发布人:桔子科技    发布时间:2017-09-09 08:49:48    分享到:
本文作者将与大家分享:如何使用axure原型工具制作APP中的吸附菜单?

\

菜单是指引用户浏览网页或者使用APP的导向,吸附菜单在PC端和移动端的设计都有存在,它突出了菜单的重要性,它让菜单时时刻刻都在用户“够得着”的地方,以让用户没那容易“迷路”。这一章就教大家如何使用axure原型工具制作APP中的吸附菜单。当然,网页中的吸附菜单原理一样。

第一步:拖拉摆放好相关的控件

所有控件包括三部分:“手机壳”图片、“屏幕”动态面板和“菜单”组合

 

1、“手机壳”图片:就一张图片,这没啥好说的;

2、“屏幕”动态面板:271X483,放在“手机壳”的中间,在state1面板状态中放置3条水平线以及一个动态面板,分别命名为“界限”,“下限”,“上限”和“内容”。

(1)“界限”水平线:宽度为271,放在(0,-150)的位置上;

(2)“下限”水平线:宽度为271,放在(0,482)的位置上;

(3)“上限”水平线:宽度为271,放在(0,0)的位置上;

(4)“内容”动态面板:271X796,放在(0,0)的位置上,在该动态面板的state1面板状态中,顶部放置一张图片表示banner图,中间放置三个矩形表示菜单按钮,分别为产品,技术和运营,下方放置一些白底矩形表示该页面主题内容。

 

3、“菜单”组合:于“内容”动态面板的state1面板状态中的3个菜单按钮一样,直接复制出来放在“屏幕”顶部即可,初始状态记得设置为隐藏。

第二步:为“内容”添加一个拖动时用例

该用例的条件是:“内容”接触到“界限”的时候。

该用例的动作是:一是显示“菜单”组合,二是垂直拖动“内容”动态面板,其中顶部边界小于等于“上限”的y轴位置,底部边界大于等于“下限”的y轴位置。

 

第三步:为“内容”添加另一个拖动时用例

该用例的条件是:“内容”未接触到“界限”的时候。

该用例的动作是:一是隐藏“菜单”组合,二是垂直拖动“内容”动态面板,其中顶部边界小于等于“上限”的y轴位置,底部边界大于等于“下限”的y轴位置。

 

可以了,点击预览并上下拖动屏幕即可以看到效果。因为工作过程中有很多这些axure原型设计小技巧的例子,所以我会坚持分享下去,希望对大家有帮助,你们对我的关注就是我的动力。

本文是成都网站建设公司、成都网站设计制作公司、成都APP开发公司、成都响应式网站建设、成都VR全景制作-桔子科技公司为您整理!
成都网站建设,成都网站设计,成都网站制作,成都网页设计,成都网站建设公司 ,成都网站设计公司,成都网站制作公司,成都网页设计公司,网站建设网站制作网站设计网页设计成都响应式网站建设、成都响应式网站制作、成都响应式网站开发、成都全景制作、成都VR全景制作成都手机网站建设,手机网站建设,成都APP开发,APP开发,成都建网站,成都做网站,成都商城网站建设,集团网站建设,网站建设,高端网站建设,品牌网站建设,成都平台网站建设,成都响应式网站建设,成都微信网站建设,成都微商城网站建设,成都微信营销,成都微信小程序开发、成都网站优化,成都网络公司。

下一篇:最后一页上一篇:成都APP开发:App接口设计所使用的的方法有哪些

最新案例
手机/微网站
  1. [成都]成都微信网站建设:微信小程序增加搜索框页面功能
  2. [成都]成都微信网站建设:兰州银行叫停微信“扫码取款”的原因
  3. [成都]成都微信网站建设:更方便!微信PC版新增搜一搜功能
  4. [成都]成都手机网站建设:Android手机芯片中发现新漏洞!
  5. [成都]成都手机网站建设:谷歌公布 Google I/O 2017 for Android源代码
  6. [成都]成都手机网站建设:手机网站简洁的页面为什么很重要
网络营销
  1. 成都APP开发:使用axure制作APP吸附菜单的方法
  2. 成都APP开发:App接口设计所使用的的方法有哪些
  3. 成都APP开发:探讨各类电商APP发展如此稳健的原因
  4. 成都APP开发:在线音乐典型APP的男女分布差异较大
  5. 成都APP开发:来看看健身APP如何提高用户粘性的方法
  6. 成都APP开发:在线约会应用Tinder首次登顶App Store畅销排行榜

  • 电话:4006-028-024 028-86633922

    邮箱:Service@orangeapp.cn

    成都市成华区崔家店路789号上城国际1-24-9号

qqsina