|
[原创]模仿桌面图标的交互效果(近似,不完全)
演示文件如下:
[upload=swf]UploadFile/2005-12/2005122511842574.swf[/upload]
源文件如下:
[upload=fla]viewFile.asp?ID=292258[/upload]
FLASH版本:FLASH MX 2004
播放器版本:7
Actionscript:1
具体步骤:
NO.1
制作两个图象,一个为"未选中状态的图标",另一个为"选中后的图标" (本例中使用了PHOTOSHOP的图标,并制作为PNG图像)
NO.2
打开FLASH,新建一个空白文档,文档中默认有一个图层,我们再建一个新的图层,将位于上面的图层命名为"未选中图标",位于下面的图层命名为"已选中图标"
NO.3
在图层"未选中图标"中导入制作好的"未选中状态的图标"的图像,并将其转换为影片剪辑(MovieClip),再将其实例名称命名为unselected
NO.4
在图层"已选中图标"中导入制作好的"选中后的图标" 的图像,并将其转换为影片剪辑(MovieClip),再将其实例名称命名为selected
NO.5
现在屏幕中的状态如图
NO.6
下面进入编写脚本的部分
选中影片剪辑"未选中图标",按F9进入动作面板,写入如下代码:
onClipEvent(load){
_root.unselected._visible=0;
//当影片剪辑载入的时候，选中后的图标被隐藏
}
onClipEvent(mouseDown){
if(this.hitTest(_root._xmouse,_root._ymouse,true)){
_root.unselected._visible=1;
_root.unselected._x=this._x;
_root.unselected._y=this._y;
this._visible=0;
//如果鼠标点击在该影片剪辑的范围内的时候，选中后图标显示出来,与该影片剪辑的坐标重合后,将该影片剪辑隐藏
}else{
this._visible=1;
this._x=_root.unselected._x;
this._y=_root.unselected._y;
_root.unselected._visible=0;
//如果点击在该影片剪辑范围以外,则此影片剪辑为显示,并且坐标与选中后图标重合后,将选中后图标隐藏
}
}
NO.7
再选中影片剪辑"已选中图标",按F9进入动作面板,编写如下代码:
onClipEvent(mouseDown){
if(_root.selected._visible==0){
startDrag("");
//当鼠标按下时,如果未选中的图标为隐藏的，则开始拖拽
}
}
onClipEvent(mouseUp){
stopDrag();
_root.selected._x=this._x;
_root.selected._y=this._y;
//当鼠标释放时,停止拖拽,并且使未选中图标与该影片剪辑坐标重合
}
NO.8
最后,到主场景中，将已选中图标和未选中图标的两个影片剪辑的坐标重合到一起,就完成制作了
CTRL+ENTER测试影片了
这个效果还有其他更方便的方法可以实现，欢迎大家来贴贴
|
|
搜索
菜鸟的疑问
