网店界面的整体规划设计+文献综述(9)
}
//侦听COMPLETE事件，以读取服务器响应
loader.addEventListener(Event.COMPLETE,completeHandler);
}
send_btn.addEventListener(MouseEvent.CLICK,clickHandler);
function clickHandler(event:MouseEvent) {
try {
sendData();
} catch (e:Error) {
trace(e);
}
}
function completeHandler(event:Event):void {
var _loader:URLLoader = URLLoader(event.target);
//来自服务器返回的变量ok
trace("Name: " + _loader.data.ok);
}
此处我将提交按钮的代码改为gotoandplay(1)假设数据已经上传网店的服务器当中。
3.3.2 购物车画面
购物车画面可以说画面之后又一个非常重要的场景，作为购物车来说，可能就是人们在网店接触的最多的不管你买什么东西都会放入这里并且在这里购入你最爱的产品，在这里我将界面内容做了出来，并没有可以交互的数字加减，另外在这里我们还可以连接到别的功能之中。
购物车色彩搭配和主画面是一致的，也是以这个背景来制作的。在AI制作了和订单画面一样，我将一些数据先制作了上去,在第一帧上使用的音乐禁音代码也和上述相等。这里笔者觉得并没有社么特色，我把重点全部放在了，购物的流程上。
图 42 购物车开始画面图 43第一帧开始画面
图 44 购物流程开始画面
笔者在此将所有使用AI以及 Photoshop制作出来转换为PNG格式，这种格式的优点在于透明的背景，方便我进行素材的组合。在购物流程当中，我使用的是Photoshop这个工具，将所有的圆圈连接起来，那样方便我安放按钮位置。
在16帧的位置，导入事先做好的几个纸签的图案，制作成一个影片剪辑。这里只需要对素材应用理解，就能做出好的效果来。
图 45 连接效果演示
在第123帧上，我将使用文本框来实现，人们收货的信息的填写工作。这我使用的一个立体的地图效果制作方法就是在AI里，把轮廓勾出来之后，转成swf格式。这样我就可以直接在flash里进行编辑，就产生了立体的地图的效果。
图 46 2D地图演示
在制作完了2D地图之后，我将返回刚刚的收货信息帧数上面。下面就是要进入配送的三部曲了，这还是个人的运输方式，我在之后企业合作里面会单独使用选择功能。这里多数使用的影片剪辑，很多人会问高级的作品总是遮罩比较多，我并不否认，这招效果是flash里面一个很有特色的功能，但是我觉得将一些简单的功能用好也是可以创作出好的作品的。下面我将进入付款的模块了。
图 47 配送演示图 48 付款模块
付款模块的内容有，启动一个人安全的软件，在帧数上我会往下跳一帧，并且提示你软件已经成功启动。第二步就是选择付款的银行，我并没有将银行的一个一个的制作成按钮建元件，我收集了素材导入成png格式放了flash中。当点击确认付款的时候，帧数将调至151上，显示是否要确认的菜单。如果选择确定，那么就是跳回第1帧上。如果选择不是，电脑就理解成你想把刚刚从银行打出的钱，退回。但是网店会选择如你填写退款的事项，这样购物车流程到这里结束了。
代码使用
鼠标代码
Mouse.hide();
duplicateMovieClip(_root.mc, "mc"+_root.i, _root.i);
//trace(["mc"+_root.i]);
_root["mc"]._x = _root._xmouse;
下一篇：丽水崇仁寺庙景观规划设计