【解决方案】Axure RP如何隐藏部分页面的菜单项

来源:互联网 发布:青年网络公开课 张捷 编辑:程序博客网 时间:2024/05/29 20:01

1 修改记录

时间 描述 2017-07-28 建档 2017-07-30 修改配图

2 正文

  本方案使用的Axure RP 8。

2.1 需求说明

  利用Axure RP制作原型时,通常会将功能页面尽可能划分成小模块,分成多个子页面,以便修改。例如A页面可以划分为a,b,c三个子模块,那么在Axure RP中A下面有abc三个子页面。
  这三个子页面在发布之后会显示在菜单中,在向客户展示的时候,如何需要隐藏abc三个菜单,只显示A菜单?

2.2 环境预置

  新建一个项目,将index页面更名为”版本升级”;”版本升级”下分”第1步”、”第2步”、”第3步”三个子页面。
  这里写图片描述
  升级分三个步骤,”版本升级”页面中通过内联框架引用三个子页面,利用”上一步”和”下一步”两个按钮控制升级步骤(实现不做讲解)。现要求生成HTML文件后,首页隐藏掉三个子页面的菜单项。

2.3 解决方案

  Axure RP生成HTML文件之后,会产生五个文件夹、四个首页HTML文件以及菜单对应的各个HTML文件。
  查看首页HTML文件的源代码可以发现,主要引用了resources和data两个文件夹里面的JS文件,首页菜单的初始化数据就是data提供的。所以只需要修改掉data/document.js里面的菜单数据即可。

2.3.1 备份data文件夹

  发布项目,在”生成HTML文件”的配置界面里面选择”页面”选项卡,取消”生成全部页面”,只勾选你需要显示的菜单结构。例如,这里只需要显示到”版本升级”,那就只勾选该页面。
  这里写图片描述
  生成HTML文件之后,data/document.js里面的菜单初始化数据就只有所勾选的部分。
  将data文件夹备份到其他位置。

2.3.2 生成完整的HTML

  再次发布项目,勾选”生成全部页面”,生成完整项目的HTML文件。

2.3.3 覆盖data文件夹

  将备份的data文件夹覆盖掉完整项目里面的data文件夹即可。
  这里写图片描述

2.4 总结

  1、生成HTML文件后,项目结构会保存到data/document.js。index.html通过该文件生成菜单;
  2、index.html通过本地相对地址访问其他HTML文件,所以尽管菜单上没有子页面,但不影响父页面内部对子页面的引用。前提是必须生成子页面的HTML文件。

原创粉丝点击