Authorware中图标的拖放与回弹

天枰云鹤

天枰云鹤

2016-03-18 16:37

下面是个简单易学的Authorware中图标的拖放与回弹教程,图老师小编详细图解介绍包你轻松学会,喜欢的朋友赶紧get起来吧!

  对于某些交互应用,要求设计者设置一个目标区域,.用户根据条件把正确的对象拖入这一区域,而拖动不符合条件的对象会被自动弹回原来位置。下面谈谈如何利用交互图标实现拖放与回弹。

有一个算式“1+1=”,同时屏幕上有1、2、3、4、5共5个数字,要求用户把正确的数字拖到算式中“=”符号的右边,若拖入的是“2”,则目标区域接受该数字,并在算式的下面显示“正确!”两字。若是其它数字,则被自动弹回,并继续接受用户的拖入。

 建立显示图标


打开authorware,新建一个文件(m.tulaoshi.com),拖入七个显示图标在流程图上,分别命名为question、number1、number2、number3、number4、number5和ok;然后双击question图标,选择inspector工具框中的text 工具,单击question的presentation窗口,输入“1+1=”,选中输入的内容适当调整位置,并选选单window→inspectors→mode,点中transparent项把它设为透明,还可通过text选单选择字体、字号等。同样在number1、number2、number3、number4、number5和ok显示图标中输入“1”、 “2”、“3”、“4”、“5”、 “正确”。

 把数字的图标设置成可移动


有一个问题值得注意:在authorware中运行没有打包的程序时,若没有特别的设定,显示图标都是可以移动的,macromedia公司这样做是为了方便编程人员调整显示内容的位置,但是打包以后的显示图标则不可移动(除非有特别设定)。

为了能使图标被移动,要对数字的显示图标进行设定:选中number1显示图标,用快捷键ctrl-=(或用选单modify→icon→caculation)打开number1的caculation窗口,输入:movable=1。其它数字设定的方法同上(为了使question图标和ok图标在运行时不能拖动,可用同样方法输入:movable=0,但不是必须的)。

为了避免用户把数字拖到设定的屏幕大小范围之外,我们还需要打开这些数字图标的属性对话框,在layout区的movable列表框中选on screen项。

 建立交互


(1)建立可放入对象的目标区。.在流程图number5和ok图标之间拖入一个交互(interaction)图标,命名为interaction,然后在交互图标右侧拖入一个map图标,这时会弹出response type对话框,选第四个——targe area,再按“ok”,命名该图标为target。双击target图标上方的箭头会弹出属性对话框,在response 区的branch列表中选exit interaction,在active if框中输入:objectmoved=″number2″, 表示被移动对象的图标名如果是number2就退出此次交互,objectmoved是系统变量,返回最近一次被移动对象的图标名。再选target area区,在on drop列表框中,选snap to center,表示把对象放入目标区域的中心,accept any object 前打钩。最后注意千万不要忘了设定目标区域的位置,移开打开着的属性对话框,可看到presentation窗口中有名为target的虚线框,该虚线框即为要调整的目标区域,直接用鼠标把虚线框拖曳到算式“1+1=”的右侧并调整到适当大小。


图1 建立交互总流程图.

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/shejiruanjian/)(2)建立弹回对象的目标区。跟上面一样,在target图标的右侧拖入一个map图标,命名为put back,并进行属性设置,response区中的active if 文本框输入:objectmoved〈〉″number2″,在branch列表框中选try again,在target area区中,把on drop 项置为put back,并选中accept any object。注意,拖动目标区域至设定的整个屏幕的范围,宁愿超出也不要小于屏幕的大小。总流程图见图1。

展开更多 50%)
分享

猜你喜欢

Authorware中图标的拖放与回弹

设计软件 平面设计软件 广告设计软件
Authorware中图标的拖放与回弹

Authorware7.0基础与实例教 连载 2.4 图标栏

设计软件 平面设计软件 广告设计软件
Authorware7.0基础与实例教 连载 2.4 图标栏

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

App图标的设计要求

设计
App图标的设计要求

1.2 了解Authorware 流程线图标

设计软件 平面设计软件 广告设计软件
1.2 了解Authorware 流程线图标

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

QQ爱心图标的设计过程

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
QQ爱心图标的设计过程

Authorware的图标化设计流程

设计软件 平面设计软件 广告设计软件
Authorware的图标化设计流程

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

Photoshop给逆光美女图片增加柔和的橙黄色教程

Photoshop给逆光美女图片增加柔和的橙黄色教程

AutoCAD建模实例教程:绘制雨伞(3)教程

AutoCAD建模实例教程:绘制雨伞(3)教程
下拉加载更多内容 ↓