Axure8怎么使用动态面板?Axure8的使用教程

动态面板为Axure里常用的元件:

本次主要涉及:元件:动态面板、图像,技术点:交互用例、动态面板和图像的编辑,如下面脑图所示:

1、打开Axure8(axure7也一样),默认是新创建的项目,找到 “动态面板”元件,如下图:

2、拖动元件到工作区,按照图指示的任意一个地方给动态面板命名:测试面板

3、双击动态面板元件,出现状态state1,双击进入到state1的编辑:

4、拖放一个图像元件到state1内,双击并找到准备的图片(红旗),这样第一个状态就编辑好了。

5、下面编辑第二个状态,注意看图,在右下方的 “概要”栏目内 找到state1右键“复制状态”,这样里面的元件大小、位置不会发生改变。复制成功后为便于下面的交互用例,将状态分别命名为:红旗、蓝旗。然后点击蓝旗状态,将图片替换。

6、以上步骤完成后,开始编辑交互用例。双击红旗图片,出现如下图所示的交互用例,找到:鼠标单击时,并双击出现用例编辑面板。

7、选择 元件-->设置面板状态 ,然后按照图示选中 “测试面板”,并为其设置选择状态为:蓝旗。同时设定动画效果。

8、红旗状态编辑完成后,点击确定,按照下图所示在 case1下邮件复制用例,并粘贴到蓝旗状态下。然后按上一步的操作,将蓝旗点击是的选择状态设置为:红旗。

9、最后F5预览,并点击图像测试效果

(0)

相关推荐

  • Axure手机版原型动态面板中的滚动条怎么去掉?

    Axure设计的手机页面原型需要去掉动态面板中的滚动条,该怎么去掉呢?下面我们就来看看详细的教程. 1.先制作一个手机页面,这时内容超过了手机屏幕,如图所示 2.选中屏幕中所有的内容,点击“转化为动态 ...

  • Axure8动态面板使用说明

    动态面板为Axure里常用的元件: 本次主要涉及: 元件:动态面板.图像 技术点:交互用例.动态面板和图像的编辑,如下面脑图所示: 操作方法 01 打开Axure8(axure7也一样),默认是新创建 ...

  • axure动态面板怎么用?

    axure动态面板怎么用? 1.在制作好的页面上添加一个 hot spot 区域,然后拖动一个"动态面板"到"hot spot"上,右键将"动态面板& ...

  • Axure动态面板怎么制作三级菜单?

    Axure中想要设计一款三级菜单,该怎么设计呢?下面我们就来看看详细的教程. 1.我们先放入菜单的相关元件,这里我使用的是矩形. 2.我们把三级菜单的三个元件全选,在上面点击鼠标右键,选择[转换为动态 ...

  • Axure RP 8怎么设置动态面板显示隐藏对象?

    Axure RP 8设计软件中动态面板元件是功能最强大的元件之一,可以通过这个元件,实现很多其他软件元件都不能够实现的功能.下面利用一个动态面板显示隐藏对象,操作如下: 1.双击打开Axure RP ...

  • axure怎么使用动态面板制作淘宝图片轮播效果?

    淘宝中经常可以看到店铺中的图片轮播效果,本经验将通过axure7.0实现. 1.下载需要轮播的图片 2.将图片引入至axure中,将引入的第一张图片转为动态面板 3.将动态面板添加四个状态,分别为状态 ...

  • Axure动态面板两种创建方法有什么区别?

    Axure动态面板有两种创建方法,这两种方法有什么区别呢?下面我们就来详细介绍一下. 第一种创建方法: 1.元件库中有单独的动态面板元件,可以拖出来直接用,也是常用方法: 2.效果是这种,空的动态面板 ...

  • Axure怎么使用动态面板制作banner图片轮播?

    Axure就不多介绍了,一般对产品岗位比较了解的都知道,常用的原型工具.这里为大家做一个用动态面板做简单的banner图片轮播的方法. 一.基础准备工作 1.打开Axure,页面名称命名为“图片轮播” ...

  • axure怎么使用动态面板制作转盘抽奖?

    目前各个网站,经常可以看到大转盘抽奖,本经验初步讲解大转盘抽奖的前提条件:让转盘转起来. 1.首先百度一张转盘图片,将改图片引入至axure中 2.将该转盘转为动态面板 3.将该动态面板分为12个状态 ...