axure7.0软件应用第二课详解.ppt

选择第一张小图，按住Ctrl键复制出四张，然后改变图片。此时复制的四张图片也将具有相同的交互样式。 选择所有小图，通过“排列”工具进行排列对齐。 设置所有小图的交互动作如下图 选择第一张小图设置为“选中”状态。 大图的效果要利用到“动态面板”，将在后面的课程讲解。 预览观看小图效果。 标题部件用于在页面中显示标题文字。可以通过编辑对该部件文字的格式随意更改，设定不同等级标题和不同样式。 标题部件 文本部件 文本部件用于在页面中显示文字或文字段，文字的格式可以随意更改，设定不同的字体，尺寸，颜色等。 矩形部件，可以用来做很多工作： 页面上一块蓝色的背景，就可以是一个填充为蓝色的矩形部件。 页面上一个有边框的区域，就可以是一个填充为透明的矩形部件 矩形部件 当需要在页面上预留一块区域，但是还没想清楚这块区域中到底要放什么内容的时候，可以先放一个占位符部件。 占位符 方便绘制操作按钮，形状按钮结合了button和Rectangle部件的优点。 圆角矩形 以上七个部件可以统称为“文本部件”，主要用来实现文字内容以JS文字效果。 用于设计分隔线，按Ctrl键可以改变方向。 功能是在图片上实现局部可点击的区域 水平线/垂直线 图片热区 实例：制作日历提示效果 初始 鼠标滑过 鼠标点击 鼠标移开 导入日历素材图片。 利用“图片热区部件”在素材上框出要操作的区域。 选中热区，在热区的属性“工具提示”中输入“点击显示黄历”。 导入黄历素材图片，并放置在热区右下角，设置“隐藏” 选中热区设置交互动作如下 预览效果 动态面板部件是Axure RP中功能最强大的部件，是唯一一个可以包含其他部件的部件。（后面结合“部件交互面板”讲） 动态面板 就是常说的iFrame部件，是HTML的一个部件，用于在一个页面中显示另外一个页面。 使用该部件可以引用任何一个以http://开关的URL所标示的内容。 内部框架 实例：制作手机滚屏效果 导入手机界面素材 放置“内部框架部件”在手机界面留白处，并设置“隐藏边框”和“总需显示滚动条”。 分别导入右边和下边两条黑边素材，遮挡住框架部件的滚动条。 打开page1的页面，纵向放置三张图片素材，要求宽度为手机屏宽，高度为两屏。此页内容必需X，Y均为0处。 返回HOME页面，右击内部框架部件，在“框架目标页面”中选择性page1。 Repeater控件其实可以理解为带数据交互功能的表单，可以完成以往需要配合动态面板才能完成的诸如过滤，排序功能，并能根据输入的数据实时添加记录。 尤其是过滤功能在制作网站的高级搜索的时候根据选择条件不同显示不同结果有很大帮助，在以往单单用动态面板制作难度大而且这方面的仿真度也受到限制。 （后面结合“部件交互面板”讲） 中继器 实例:利用Axure RP完成《雅芳官网》主页线框图及静态界面原型 1000px*1000px 练习:利用现有素材或自己创作素材，对现有雅芳网首页界面进行改版设计，要求出线框图和界面原型。 网站与APP原型设计 金晖 第二课 Axure快速入门 启动Axure时，会出现欢迎画面和许可证信息 同时打开多个Axure文件 在Mac版本中,一个Axure程序可以同时打开多个文件,并可以通过Windows菜单在多个文件之间切换. 在Windows版本中,每个Axure程序只能打开一个文件。如果想同时打开多个文件，可以再运行一个Axure程序来打开另一个文件。 二、Axure工作区 工具栏区域 页面区域 网站地图区域 部件区域 母版区域 页面设置区域 部件属性区域 部件管理区域 部件交互区域 1、工具栏区域： “发布”菜单 预览（F5）：就是把当前的Axure RP网站项目在浏览器中进行显示。 预览选项（Ctrl+F5）：对预览的网站原型进行参数设置。 生成原型文件（F8）：就是把当前的Axure RP网站项目生成一个HTML的网站原型。 规格Word文档（F9）：就是为当前的网站生成规格说明。包括：每个页面的描述，每个组件的坐标、尺寸、颜色等的说明。 在HTML中重新生成当前页面：只把当前页面重新生成，而不是整个网站，可以提高效率。 2、站点地图 可用于创建和管理页面。新项目的站点地图区会包含一个首页和其下的三个嵌套页面。 “站点地图”听起来只适合用于由一个个页面组成的Web网站。但不要被这个名称误导了，Axure可以用来创建复杂的企业级网站或应用软件的高保真原型。 在站点地图区可以做以下工作： 创建新页面 移动页面的上下位置，改变页面排序 修改页面的嵌套关系，以反映页面的层级架框。 删除页面 编辑页面 搜索页面 修改页面名称 在进行复杂页面编辑的时候，建议大家先创建一个站点地图，也就是说网站的整体结构先规划好，然后再进行单独页面的编辑，这样比较高效。 3、页面属性区 （1）页