原贴http://bbs.blueidea.com/thread-2667642-1-1.html

lzyy [楼主]

银牌会员


帖子 474
体力 1151
威望 34
注册 2005-6-4      #1
发表于 2006-8-16 16:24  资料 主页 短消息  
这个涂鸦板实现的是最基本的功能：画图、清除、回放、重画。

浏览地址：http://www.healdream.com/blog/article.asp?id=141

增加逐步撤销功能：

点此浏览

最新测试地址(增加交互功能＋缩略图功能):

点此浏览

如不能打开请直接点下面的地址:

http://www.healdream.com/blog/upload/tuya/mytuya.html

个人感觉一个比较大的缺陷是代码不够清晰，嘿嘿

var i = -1;//初始化
this.showbg_mc.createEmptyMovieClip("tmp_mc", 100);//建立空影片剪辑
var my_arrx:Array = new Array();//这两个数组是用来记录坐标的
var my_arry:Array = new Array();
_root.draw_btn.onRelease = function() {//当“开画”按钮按下时，执行下列代码
       this._visible = false;//设按钮不可见
       showbg_mc.onMouseDown = function() {//当在画布上按下鼠标左键时
              if (haveReplay) {//如果已经重放过了
                     //trace("haveReplay");
                     my_arrx.splice(0);//删除两个数组的所有元素
                     my_arry.splice(0);
                     haveReplay = false;
                     i = 0;//重新设定i
              }
              this.drawing = true;//表明是否开始画
              origin_x = _xmouse;//记录鼠标坐标
              origin_y = _ymouse;
              //移动到鼠标按下的点
              this.tmp_mc.moveTo(origin_x-this._x, origin_y-this._y-10);
              //这个是判断鼠标是否再次按下时，为以后的回放作判断
              if (my_arrx[i] == "readymove") {
                     i++;
                     my_arrx[i] = origin_x-this._x;
                     my_arry[i] = origin_y-this._y-10;
              }
       };
       showbg_mc.onMouseMove = function() {//当鼠标在舞台移动时
       //如果在规定的区域内
              if (_xmouse<472 && _ymouse<297 && _xmouse>75 && _ymouse>67) {
                     if (this.drawing) {//如果鼠标已经按下
                            //trace(i);
                            i++;
                            my_arrx[i] = _xmouse-this._x;//记录鼠标的坐标
                            my_arry[i] = _ymouse-this._y-10;
                            this.tmp_mc.lineStyle(1, 0x006699, 100);//开始画线
                            this.tmp_mc.lineTo(_xmouse-this._x, _ymouse-this._y-10);
                     }
              }
       };
       showbg_mc.onMouseUp = function() {
              //设为未画状态
              this.drawing = false;
              i++;
              //将my_arrx[i]设为准备移动
              my_arrx[i] = "readymove";
       };
};
_root.clear_btn.onRelease = function() {
       //当清除按钮按下时，清除以前的画
       _root.showbg_mc.retmp_mc.clear();
       _root.showbg_mc.tmp_mc.clear();
       //删除数组元素
       my_arrx.splice(0);
       my_arry.splice(0);
       i = -1;
};
j = 0;
_root.replay_btn.onRelease = function() {
       //回放按钮按下时将haveReplay设为真，同时将j清零
       haveReplay = true;
       j = 0;
       //清除以前的画
       _root.showbg_mc.tmp_mc.clear();
       //建立空影片
       var rtmp_mc:MovieClip = _root.showbg_mc.createEmptyMovieClip("retmp_mc", 10000);
       rtmp_mc.lineStyle(1, 0x006699, 100);
       rtmp_mc.moveTo(my_arrx[j], my_arry[j]);
       var Iid:Number = setInterval(replay, 20);//这里可以设定回放速度
       //这句话很重要，如果不赋值的话，后面无法用clearInterval清除
       _global.tmp=Iid;
};
function replay() {
       //如果my_arrx[j]已定义的话
       if (my_arrx[j] != undefined) {
              //如果是准备移动的话，调用moveTo语句，而不是lineTo
              if (my_arrx[j] != "readymove") {
                     _root.showbg_mc.retmp_mc.lineTo(my_arrx[j], my_arry[j]);
                     j++;
              } else {
                     //执行lineTo语句
                     j++;
                     _root.showbg_mc.retmp_mc.moveTo(my_arrx[j], my_arry[j]);
                     j++;
              }
       } else {
              //清除setInterval
              clearInterval(_global.tmp);
       }
}