Axure绘制页面框架 图文详解教程

Axure用来画原型图,在这几天的学习实践中学到不少东西。今天给大家小小展示一下。

在不同的页面之间,常常有很多相同的东西,像头部 底部 菜单 导航等都是一致的。只有页面的一部分是活动的,可以显示不同的内容。今天我们就来做一个这样的框架。

图中黄色部分都是固定的。蓝色部分是根据导航栏中每次点击的内容不同,显示不同的信息。

第一步:

写头部自己的内容。写好各个子页面的内容。准备好材料。

第二步

左边的导航。

添加导航结构,为下图的按钮

添加到界面上可以编辑名称,添加子级,同一级。

第三步

添加活动的页面。在选择inline frame 添加到页面右侧。这个控件用来展示不同的部分。

第四步

就是做好各个事件。

点击导航的单价事件 添加用例。

好了。大功告成啦。赶紧运行一下看看。是不是很简单?

原型图还有很多可以挖掘的。有有意思的跟我交流哈

时间: 2024-10-26 20:04:44

Axure绘制页面框架 图文详解教程的相关文章

python+requests接口自动化测试框架实例详解教程

转自https://my.oschina.net/u/3041656/blog/820023 摘要: python + requests实现的接口自动化框架详细教程 前段时间由于公司测试方向的转型,由原来的web页面功能测试转变成接口测试,之前大多都是手工进行,利用postman和jmeter进行的接口测试,后来,组内有人讲原先web自动化的测试框架移驾成接口的自动化框架,使用的是java语言,但对于一个学java,却在学python的我来说,觉得python比起java更简单些,所以,我决定自

【python3+request】python3+requests接口自动化测试框架实例详解教程

转自:https://my.oschina.net/u/3041656/blog/820023 前段时间由于公司测试方向的转型,由原来的web页面功能测试转变成接口测试,之前大多都是手工进行,利用postman和jmeter进行的接口测试,后来,组内有人讲原先web自动化的测试框架移驾成接口的自动化框架,使用的是java语言,但对于一个学java,却在学python的我来说,觉得python比起java更简单些,所以,我决定自己写python的接口自动化测试框架,由于本人也是刚学习python,

虚拟机VMware下CentOS6.6安装教程图文详解

分享下,虚拟机VMware下CentOS6.6安装教程图文详解. CentOS 6.6 发布下载 地址: http://www.linuxidc.com/Linux/2014-10/108554.htm 1.首先要下载一个centos的iso镜像,我是用虚拟机VMware来安装的,用VMware最好创建一个空白硬盘. 2.创建完毕再设置里面挂载iso的centos系统文件. 3.进入到这个页面: 说明: 1.install or upgrade an existing system安装或升级现有

Android中级教程之----Log图文详解(Log.v,Log.d,Log.i,Log.w,Log.e)

在Android群里,经常会有人问我,Android Log是怎么用的,今天我就把从网上以及SDK里东拼西凑过来,让大家先一睹为快,希望对大家入门Android Log有一定的帮助. android.util.Log常用的方法有以下5个:Log.v() Log.d() Log.i() Log.w() 以及 Log.e() .根据首字母对应VERBOSE,DEBUG,INFO, WARN,ERROR. 1.Log.v 的调试颜色为黑色的,任何消息都会输出,这里的v代表verbose啰嗦的意思,平时

GitHub 使用教程图文详解(转)

[日期:2014-09-06] 来源:Linux社区  作者:freeloda [字体:大 中 小] 大纲: 一.前言 二.GitHub简介 三.注册GitHub账号 四.配置GitHub 五.使用GitHub 六.参与GitHub中其它开源项目 七.总结 注,GitHub官网:https://github.com/,客户端版本:git version 1.9.2.msysgit.0.所有软件请到这里下载:http://msysgit.github.io/. 一.前言 在前面的文章中我们讲解了

GitHub 使用教程图文详解

大纲: 一.前言 二.GitHub简介 三.注册GitHub账号 四.配置GitHub 五.使用GitHub 六.参与GitHub中其它开源项目 七.总结 注,GitHub官网:https://github.com/,客户端版本:git version 1.9.2.msysgit.0.所有软件请到这里下载:http://msysgit.github.io/. 一.前言 在前面的文章中我们讲解了 Git 服务器的搭建.Git 本地仓库讲解.Git 远程仓库讲解.Git 分支管理.Git 标签管理,

【图文详解】scrapy安装与真的快速上手——爬取豆瓣9分榜单

写在开头 现在scrapy的安装教程都明显过时了,随便一搜都是要你安装一大堆的依赖,什么装python(如果别人连python都没装,为什么要学scrapy-.)wisted, zope interface,pywin32---现在scrapy的安装真的很简单的好不好! 代码我放github上了,可以参考: https://github.com/hk029/doubanbook 为什么要用scrapy 我之前讲过了requests,也用它做了点东西,([图文详解]python爬虫实战--5分钟做

大数据学习系列之七 ----- Hadoop+Spark+Zookeeper+HBase+Hive集群搭建 图文详解

引言 在之前的大数据学习系列中,搭建了Hadoop+Spark+HBase+Hive 环境以及一些测试.其实要说的话,我开始学习大数据的时候,搭建的就是集群,并不是单机模式和伪分布式.至于为什么先写单机的搭建,是因为作为个人学习的话,单机已足以,好吧,说实话是自己的电脑不行,使用虚拟机实在太卡了... 整个的集群搭建是在公司的测试服务搭建的,在搭建的时候遇到各种各样的坑,当然也收获颇多.在成功搭建大数据集群之后,零零散散的做了写笔记,然后重新将这些笔记整理了下来.于是就有了本篇博文. 其实我在搭

LNMP编译安装之msyql安装--图文详解

LNMP编译安装之msyql安装--图文详解 1.前言 本次安装采用源码安装,主要资源包从官网下载,次要依赖则使用yum进行安装,本篇只涉及mysql的安装,msyql远程登录,不涉及mysql具体配置.该教程纯属安装,不涉及任何重要知识点,老少皆宜. 2.安装步骤 2.1.下载boost(只下载不安装) wget http://nchc.dl.sourceforge.net/project/boost/boost/1.59.0/boost_1_59_0.tar.gz 2.2.解压bosot t