| 導購 | 订阅 | 在线投稿
分享
 
 
 

AS3代碼實現鼠標跟隨噴槍塗鴉效果-Flash

來源:互聯網  2008-11-21 19:02:52  評論

效果演示:(請用鼠標在牆上移動看效果)

改變噴槍的顔色,密度和尺寸看看效果會發生什麽變化

譯正文前,先說明這是AS3文檔,如果是AS2文檔將不會有要用到的兩個組件。(譯者)

進入這個教程,你將看到怎樣用flash創建一個噴槍效果。你可以試一下上面的影片看它如何實現的。

改變噴槍的顔色,密度和尺寸看看效果會發生什麽變化,讓我們馬上開始吧。

設置環境

1.創建一個新的大小爲400x400的文檔。

2.導入一張圖片到舞台上。調整圖片大小爲400x300.

3.使圖片的位置在左上角。(相對于舞台左對齊,上對齊。譯者注)。

4.將圖片轉換爲MC,爲它取名爲:"imageMC",將注冊點調到圖片中心。

5.圖片實例名稱設爲:"drawingArea".

6.打開你的組件庫(Ctrl+f7),拖一個Slider組件舞台上。把它放到你喜歡的位置。

7.給這個Slider組件取一個實例名稱"sizeSlider". 添加下面的設置。

王朝网络

8.拖另一個slider組件到舞台。

9.給它取一個實例名稱:"densitySlider". 添加如下設置。

王朝网络

10.拖一個color picker 組件到舞始,給它取一個實例名稱: "myColorPicker".

進入 Actionscript11.打開動作面板輸入下列代碼:

/*我們需要創建一個BitmapData對象以便以一個像素圖形對象工作。我們希望wallCanvas一開始時是透明的,這就是爲什麽我們用0x00ffffff值作參數。*/

var wallCanvas:BitmapData = new BitmapData(stage.stageWidth,stage.stageHeight - 100,true, 0x00ffffff);

//創建一個歸類于 BitmapData對象的位圖對象。

var bitmap:Bitmap = new Bitmap(wallCanvas);

//在舞台上添加一個位圖

addChild (bitmap);

//監聽牆上的鼠標點下事件

drawingArea.addEventListener (MouseEvent.MOUSE_DOWN, mouseDownHandler);

//監聽整個舞台上的鼠標放開事件

stage.addEventListener (MouseEvent.MOUSE_UP, mouseUpHandler);

//噴槍的顔色

var color:uint;

//噴槍的最大半徑

var maxRadius:Number;

//噴槍的密度

var density:Number;

//當鼠標在牆上點下時調用

function mouseDownHandler (event:MouseEvent):void {

//增加EVENT_FRAME 這樣我們可以在每一幀繪制

addEventListener (Event.ENTER_FRAME, onEnterFrame);

}

//當鼠標放開時調用

function mouseUpHandler (event:MouseEvent):void {

//如果鼠標放開時(沒有繪制),我們就不需要EVENT_FRAME了

removeEventListener (Event.ENTER_FRAME, onEnterFrame);

}

//這個函數負責整個繪制過程

function onEnterFrame (event:Event):void {

//從sizeSlider中獲得尺寸

maxRadius = sizeSlider.value;

/*從myColorPicker.中獲得顔色,當我們繪制時(我們循環繪制像素)我們使用0xff000000創建像素的顔色。*/

color = myColorPicker.selectedColor + 0xff000000;

//從densitySlider中獲得密度

density = densitySlider.value;

/*這個密度定義了我們循環了多少次,換言之,在每一幀繪制了多少像素*/

for (var i:int = 0; i

//計算一個隨機角度

var angle:Number = Math.random() * Math.PI * 2;

//計算一個被畫的像素的隨機半徑

var radius:Number = Math.random() * maxRadius;

//計算x和y的位置

var xPos:Number = mouseX + Math.cos(angle) * radius;

var yPos:Number = mouseY + Math.sin(angle) * radius;

//畫像素

wallCanvas.setPixel32 (xPos, yPos, color);

}

}

你已經完成了,如果有什麽問題,請訪問論壇。快樂的一天!

下面給出本例的代碼,朋友們可以研究下var wallCanvas:BitmapData = new BitmapData(stage.stageWidth,stage.stageHeight - 100,true, 0x00ffffff);

var bitmap:Bitmap = new Bitmap(wallCanvas);

addChild (bitmap);

drawingArea.addEventListener (MouseEvent.MOUSE_DOWN, mouseDownHandler);

stage.addEventListener (MouseEvent.MOUSE_UP, mouseUpHandler);

var color:uint;

var maxRadius:Number;

var density:Number;

function mouseDownHandler (event:MouseEvent):void {

addEventListener (Event.ENTER_FRAME, onEnterFrame);

}

function mouseUpHandler (event:MouseEvent):void {

removeEventListener (Event.ENTER_FRAME, onEnterFrame);

}

function onEnterFrame (event:Event):void {

maxRadius = sizeSlider.value;

color = myColorPicker.selectedColor + 0xff000000;

density = densitySlider.value;

for (var i:int = 0; i

var angle:Number = Math.random() * Math.PI * 2;

var radius:Number = Math.random() * maxRadius;

var xPos:Number = mouseX + Math.cos(angle) * radius;

var yPos:Number = mouseY + Math.sin(angle) * radius;

wallCanvas.setPixel32 (xPos, yPos, color);

}

}

  效果演示:(請用鼠標在牆上移動看效果)   改變噴槍的顔色,密度和尺寸看看效果會發生什麽變化     譯正文前,先說明這是AS3文檔,如果是AS2文檔將不會有要用到的兩個組件。(譯者)   進入這個教程,你將看到怎樣用flash創建一個噴槍效果。你可以試一下上面的影片看它如何實現的。   改變噴槍的顔色,密度和尺寸看看效果會發生什麽變化,讓我們馬上開始吧。   設置環境   1.創建一個新的大小爲400x400的文檔。   2.導入一張圖片到舞台上。調整圖片大小爲400x300.   3.使圖片的位置在左上角。(相對于舞台左對齊,上對齊。譯者注)。   4.將圖片轉換爲MC,爲它取名爲:"imageMC",將注冊點調到圖片中心。   5.圖片實例名稱設爲:"drawingArea".   6.打開你的組件庫(Ctrl+f7),拖一個Slider組件舞台上。把它放到你喜歡的位置。   7.給這個Slider組件取一個實例名稱"sizeSlider". 添加下面的設置。   [url=/bbs/detail_1879332.html][img]http://images.wangchao.net.cn/images/upload/images/digi/1227265375720.jpg[/img][/url]   8.拖另一個slider組件到舞台。   9.給它取一個實例名稱:"densitySlider". 添加如下設置。   [url=/bbs/detail_1879332.html][img]http://images.wangchao.net.cn/images/upload/images/digi/1227265376001.jpg[/img][/url]   10.拖一個color picker 組件到舞始,給它取一個實例名稱: "myColorPicker".   進入 Actionscript  11.打開動作面板輸入下列代碼:   /*我們需要創建一個BitmapData對象以便以一個像素圖形對象工作。我們希望wallCanvas一開始時是透明的,這就是爲什麽我們用0x00ffffff值作參數。*/   var wallCanvas:BitmapData = new BitmapData(stage.stageWidth,stage.stageHeight - 100,true, 0x00ffffff);   //創建一個歸類于 BitmapData對象的位圖對象。   var bitmap:Bitmap = new Bitmap(wallCanvas);   //在舞台上添加一個位圖   addChild (bitmap);   //監聽牆上的鼠標點下事件   drawingArea.addEventListener (MouseEvent.MOUSE_DOWN, mouseDownHandler);   //監聽整個舞台上的鼠標放開事件   stage.addEventListener (MouseEvent.MOUSE_UP, mouseUpHandler);   //噴槍的顔色   var color:uint;   //噴槍的最大半徑   var maxRadius:Number;   //噴槍的密度   var density:Number;   //當鼠標在牆上點下時調用   function mouseDownHandler (event:MouseEvent):void {   //增加EVENT_FRAME 這樣我們可以在每一幀繪制   addEventListener (Event.ENTER_FRAME, onEnterFrame);   }   //當鼠標放開時調用   function mouseUpHandler (event:MouseEvent):void {   //如果鼠標放開時(沒有繪制),我們就不需要EVENT_FRAME了   removeEventListener (Event.ENTER_FRAME, onEnterFrame);   }   //這個函數負責整個繪制過程   function onEnterFrame (event:Event):void {   //從sizeSlider中獲得尺寸   maxRadius = sizeSlider.value;   /*從myColorPicker.中獲得顔色,當我們繪制時(我們循環繪制像素)我們使用0xff000000創建像素的顔色。*/   color = myColorPicker.selectedColor + 0xff000000;   //從densitySlider中獲得密度   density = densitySlider.value;   /*這個密度定義了我們循環了多少次,換言之,在每一幀繪制了多少像素*/   for (var i:int = 0; i   //計算一個隨機角度   var angle:Number = Math.random() * Math.PI * 2;   //計算一個被畫的像素的隨機半徑   var radius:Number = Math.random() * maxRadius;   //計算x和y的位置   var xPos:Number = mouseX + Math.cos(angle) * radius;   var yPos:Number = mouseY + Math.sin(angle) * radius;   //畫像素   wallCanvas.setPixel32 (xPos, yPos, color);   }   }   你已經完成了,如果有什麽問題,請訪問論壇。快樂的一天!   下面給出本例的代碼,朋友們可以研究下  var wallCanvas:BitmapData = new BitmapData(stage.stageWidth,stage.stageHeight - 100,true, 0x00ffffff);   var bitmap:Bitmap = new Bitmap(wallCanvas);   addChild (bitmap);   drawingArea.addEventListener (MouseEvent.MOUSE_DOWN, mouseDownHandler);   stage.addEventListener (MouseEvent.MOUSE_UP, mouseUpHandler);   var color:uint;   var maxRadius:Number;   var density:Number;   function mouseDownHandler (event:MouseEvent):void {   addEventListener (Event.ENTER_FRAME, onEnterFrame);   }   function mouseUpHandler (event:MouseEvent):void {   removeEventListener (Event.ENTER_FRAME, onEnterFrame);   }   function onEnterFrame (event:Event):void {   maxRadius = sizeSlider.value;   color = myColorPicker.selectedColor + 0xff000000;   density = densitySlider.value;   for (var i:int = 0; i   var angle:Number = Math.random() * Math.PI * 2;   var radius:Number = Math.random() * maxRadius;   var xPos:Number = mouseX + Math.cos(angle) * radius;   var yPos:Number = mouseY + Math.sin(angle) * radius;   wallCanvas.setPixel32 (xPos, yPos, color);   }   }
󰈣󰈤
王朝萬家燈火計劃
期待原創作者加盟
 
 
 
>>返回首頁<<
 
 
 
 
 熱帖排行
 
王朝網路微信公眾號
微信掃碼關註本站公眾號 wangchaonetcn
 
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有