设为首页
收藏本站
3D模型素材下载
开启辅助访问
首页
集结展示行业资讯
展位展览
单体模型
整体展位模型下载
招聘企业
展览企业招聘人才
在线看展
论坛
展示行业交流平台
关于
本版
文章
帖子
日志
相册
用户
QQ登录
微信登录
忘记密码?
注册
登录
展示网
»
论坛
›
中国展示培训学习/Demonstrate professional
›
展示设计教程,学习/Display design tutorial
›
FW4技巧:使用拖放创建图像交换效果
返回列表
发布主题
FW4技巧:使用拖放创建图像交换效果
[复制链接]
查看:
401
|
回复:
0
gggds
当前离线
积分
22506
IP卡
狗仔卡
gggds
发表于 2009-12-27 13:36:24
|
显示全部楼层
|
阅读模式
在Fireworks中你能够通过简单的拖放来创建复杂的图像交换效果。对于指定当鼠标指针从切片或热点上空掠过时切片和热点将要发生些什么事情而言,使用拖放行为是最快和最有效率的手段。直到Fireworks 4出现,才使设计者们越过了必须通过Behaviors面板才能建立图像交换事件这一步。通过简单的将拖放行为手柄从一个作为触发器的切片或热点拖放到一个作为目标的切片就可以快速的创建翻转。 拖放行为手柄是一个有着十字线的圆形标志,位于切片或热点的中心。 当你选择了一个作为触发器的Web对象时,Fireworks会显示出该Web对象的所有行为关系。默认情况下,一个拖放行为关系由一条蓝色的曲线描述。如图1
: Z! a/ I! K$ `# M+ v9 j" G. a8 y" Y2 O- r
% {' d7 b* s7 O) v. s& k2 ]
图1 仅使用一个切片的图像交换翻转通常用于创建按钮或一个当鼠标指针掠过时会发生改变的图像。 要创建这种类型的翻转,你只需将拖放行为手柄拖放到切片的边缘即可。看上去与Simple Rollover行为很像,但它们之间最大的区别是使用图像交换你可以从任何一帧中获取交换图像,而使用Simple Rollover你只能从第二帧中获取图像。 你将分
两个阶段
来创建一个图像交换: 第一阶段包括建立切片、翻转图像和用来存放它们的帧; 第二阶段是将图像交换行为捆绑到切片上。 在下面的这个例子中,我们将创建一个有三个帧的图像交换。 创建图像交换的
第一阶段:建立切片、翻转图像和用来存放它们的帧
: 1. 选择你想要用来触发翻转效果的图像。如图2
( b! w6 C2 Y1 Z
5 F: t$ v+ W( N1 k2 h
图2 2. 选择Insert > Slice将一个切片捆绑到这个图像。如图3
$ c: Z( y' x- u( G
4 X/ \1 O8 c, ?: d/ Q* y
图3 3. 点击Frames面板底部的New/Duplicate Frame(创建新帧/复制帧)按钮添加一个新帧。如图4
' A- F* P# c; f' F5 [7 ]1 K
5 L1 H1 m# @1 P6 T/ R, X
图4 4. 在画布上被切片所占用的区域中放置第二个图像。如图5
; u! w3 e3 ^/ q
) c8 T/ S8 P( [" R5 ~7 U
图5 5. 再创建一个新帧。如图6
7 G3 \! ~$ n8 y( m
/ ^& o# ]# X0 L8 B% i' O0 y/ I
图6 6. 在画布上被切片所占用的区域中放置第三个图像。如图7
3 M: d8 L3 q' y1 U
% I# v |$ o) x: A8 y$ V: W& t
图7 至此,创建图像交换的第一阶段—建立切片、翻转图像和用来存放它们的帧的工作就完成了。其结果是在切片下的第一帧中放置了一个红色的矩形,在切片下的第二帧中放置了一个蓝色的矩形,在切片下的第三帧中放置了一个绿色的矩形。 现在,是到了让我们为切片应用图像交换行为的时候了。创建图像交换的
第二阶段:将图像交换行为捆绑到切片上
: 1. 选择覆盖着翻转图像的切片。如图8
4 q& q! c4 C, D, p) \4 G: M9 E# w
& i8 D9 y1 l k9 ~/ D! }5 g
图8 注意:你可以选择三个帧中任何一帧上的切片,因为切片是在帧间共享的。 2. 将鼠标指针放置到位于切片中心的拖放行为手柄上,指针将变成手的形状。如图9
6 n" B7 v7 `+ G
1 B3 D+ i6 i( X# a7 u3 A0 ^! ^& f
图9 3. 点击并按住鼠标按钮,指针将变成抓握的形状。如图10
. s$ j' Y: _: T) H* _4 \3 {9 v
! L" Z' u# G) `; p" q0 \
图10 4. 将抓握状指针拖曳到切片的边缘,当蓝色的拖曳行为曲线出现时,释放鼠标按钮。Swap Image(图像交换)对话框将出现。如图11
* m7 e) l- i5 w5 g( k
9 ^0 m; a! Q: c0 ]. w* H6 C' t
图11 5. 在Swap Image对话框的Swap Image From(从...处交换图像)下拉菜单中选择你希望交换的图像所在的帧。点击OK。 在本例中,如果我们选择Frame 2的话,则在预览时,你将看到红色的矩形将与Frame 2中蓝色的矩形发生交换,如图12。 而如果我们选择Frame 3的话,则在预览时,你将看到红色的矩形将与Frame 3中绿色的矩形发生交换,如图13。
* G7 o, q/ ^7 m! e' s. ?: L0 z
6 m9 T g0 P8 Z
" A, B4 l. Z- d2 u) ~
6 y. b- i3 D9 D4 K, z% p0 u% q: B5 K
4 t/ ~% ~7 _+ y- C, c
图12 图13
回复
使用道具
举报
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
抢沙发
千斤顶
显身卡
返回列表
高级模式
B
Color
Image
Link
Quote
Code
Smilies
您需要登录后才可以回帖
登录
|
注册中国展示论坛
本版积分规则
发表回复
回帖并转播
回帖后跳转到最后一页
精彩图文
快速回复
返回顶部
返回列表