หน้า: [1]
 
ผู้เขียน หัวข้อ: Tutorial : ทำพ่นสีเสปรย์ลงบนภาพ (BitmapData)  (อ่าน 4606 ครั้ง)
0 สมาชิก และ 1 ขาจร กำลังดูหัวข้อนี้
สวัสดีครับวันนี้นึกครึ้มอกครึ้มใจเลยเอาบทความการเล่นกับ BitmapData มาให้คนที่ยังไม่เคยเล่นศึกษาดูครับ
ตัวอย่างนี้เป็นตัวอย่างง่ายๆ คือการ Paint สีลงบนรูปของเราโดยจะพ่นแบบ Spary นึกถึงเครื่องมือ Spray
ของ Pintbrush ได้เลยครับ มาเริ่มกันเลยดีกว่านะครับ
ตัวอย่าง
<a href="http://www.codeartschool.com/test/myBitmapDataSpray.swf" target="_blank">http://www.codeartschool.com/test/myBitmapDataSpray.swf</a>
1. สร้าง MC ขึ้นมาตัวนึงเอารูปอะไรก็ได้ใส่เข้าไปใน MC นั้น ตั้งชื่อ Instant Name ว่า "mc"
2. แปะโค๊ดข้างล่างนี้ที่เฟรม
โค้ด:
import flash.display.BitmapData;//import การทำงานกับ BitmapData
var color:Number=0xFFFFFF;//เปลี่ยนค่าสีได้
var radius:Number=30; //รัศมีของ Spray

var myBMP:BitmapData=new BitmapData(mc._width,mc._height); //สร้างตัวแปร Bitmap ขึ้นมาก่อนทำงานกับ Bitmap Data
myBMP.draw(mc); //วาดภาพตัว mc ลงใน Bitmap Data ก่อน
onMouseDown=function(){//เมื่อคลิกเมาส์
onMouseMove=function(){ //สร้าง onMouseMove ขึ้นมา
for(i=1;i<=30;i++){ //วนลูป for เพื่อใส่จุดสีลงไป
myBMP.setPixel(_root._xmouse-mc._x+(random(radius)-(radius/2)),_root._ymouse-mc._y+(random(radius)-(radius/2)),color); // สั่งใส่จุดสีลงไป
}
mc.attachBitmap(myBMP,1); //update ภาพลงใน mc
}
}
onMouseUp=function(){ // เมื่อปล่อยเมาส์
delete onMouseMove; // ลบ onMouseMove ทิ้ง
}

สำหรับหลายๆคนที่สงสัยว่าเรา attachMovie ตัว MC ออกมาแปะก็ได้ใช่ไหมครับ คำตอบถือได้ครับ แต่ทำด้วย BitmapData จะดีกว่าเพราะว่า การที่เรา attach เอา Movie Clip มาแปะก็เท่ากับว่าเพิ่มจำนวน Object เข้าไปใน Stage ของเรา พอพ่นสีมากๆเข้า Object มากๆขึ้น Flash ก็เริ่มอืดครับ แต่ถ้าทำด้วย Bitmap Data มันจะไม่อืดเพราะมันจะเห็นรูปนี้เป็น Object ชิ้นเดียวเท่านั้นไม่ว่าจะพ่นลงไปนานเท่าไหร่ก็ตาม

หวังว่าคงได้ความรู้กันบ้างนะครับ
« แก้ไขครั้งสุดท้าย: 06 มี.ค. 2009, 19:06 น. โดย KapomMan » บันทึกการเข้า

<a href="http://www.kapom.com/bannerKapom.swf" target="_blank">http://www.kapom.com/bannerKapom.swf</a>
ตอนนี้โรงเรียนย้ายไปอยู่บ้านกลางเมืองแยก รัชดา-ลาดพร้าวแล้วนะคร๊าบบ
 BitmapData  กรี๊ดดดดด
บันทึกการเข้า

ล้ำลึกคนึงหาในดวงจิต ใจเคยคิดตัดสวาทมิอาจสิ้น
ดั่งก้านบัวหักกลางชลาสินธุ์ ผิว่าสิ้นไร้เยื่อยังเหลือใย
เริ่ดดดแปะๆก่อน วันหน้าจะมาอ่าน วันนี้ต้องกลับห้องละ  ยิ้มน่ารัก
บันทึกการเข้า

เราแก้ไขอดีตไม่ได้ แต่เราทำปัจจุบันให้ดีได้
update โค๊ด as3 ครับ
โค้ด:
import flash.display.BitmapData;

var color:uint = 0xffffff;
var radius:Number = 30;
var bmp:BitmapData = new BitmapData(mc.width,mc.height);
bmp.draw(mc);
addEventListener(MouseEvent.MOUSE_DOWN,StartDrag);
addEventListener(MouseEvent.MOUSE_UP,StopDrag);
function Move(e:MouseEvent):void
{
   for(var i: int =1;i<30;i++)
   {
      bmp.setPixel(root.mouseX - mc.x + (Math.random() * radius - (radius/2)),root.mouseY - mc.y + (Math.random() * radius - (radius/2)),color);
   }
   var myBitmap:Bitmap=new Bitmap(bmp);
   mc.addChild(myBitmap);
}
function StartDrag(e:MouseEvent):void
{
   addEventListener(MouseEvent.MOUSE_MOVE,Move);
}
function StopDrag(e:MouseEvent):void
{
   removeEventListener(MouseEvent.MOUSE_MOVE,Move);
}

บันทึกการเข้า

<a href="http://www.kapom.com/bannerKapom.swf" target="_blank">http://www.kapom.com/bannerKapom.swf</a>
ตอนนี้โรงเรียนย้ายไปอยู่บ้านกลางเมืองแยก รัชดา-ลาดพร้าวแล้วนะคร๊าบบ
 กรี๊ดดดดด รักป๋าตี้ที่สุดเลย..
บันทึกการเข้า

หน้า: [1]
 
 
Powered by MySQL Powered by PHP Powered by SMF 1.1.21 | SMF © 2006-2007, Simple Machines | Thai language by ThaiSMF Valid XHTML 1.0! Valid CSS!