[AS3] 將點陣圖Bitmap物件使用於SimpleButton的四種按鈕狀態

SimpleButton(upState:DisplayObject = null, overState:DisplayObject = null, downState:DisplayObject = null, hitTestState:DisplayObject = null)
建立新的 SimpleButton 實體。

http://help.adobe.com/zh_TW/FlashPlatform/reference/actionscript/3/flash/display/SimpleButton.html


1010302__bitmapBtnTest_Jack.swf

import flash.display.BitmapData;
import flash.display.Bitmap;
import flash.events.MouseEvent;
import flash.display.SimpleButton;

var bmd1:BitmapData = new BitmapData(100,100,true,0xff2266ff);
var bm1:Bitmap = new Bitmap(bmd1);
bm1.x=100;bm1.y=60;
/*this.addChild(bm1);*/

var bmd2:BitmapData = new BitmapData(100,100,true,0xffff0000);
var bm2:Bitmap = new Bitmap(bmd2);
bm2.x=100;bm2.y=60;
/*this.addChild(bm2);*/

var simpleButton:SimpleButton = new SimpleButton(bm1,bm2,null,bm1);
addChild(simpleButton);

simpleButton.addEventListener(MouseEvent.MOUSE_DOWN,mouseHandler);

function mouseHandler(event:MouseEvent):void{
 trace(event.type);
}

trace(getSize(simpleButton));

SimpleButton  DisplayObjectContainer  InteractiveObject  DisplayObject  EventDispatcher  Object
Bitmap  DisplayObject  EventDispatcher  Object

[AS3] 目標實體(點陣圖設為內嵌資源類別)的rotationX、rotationY值隨 mouseX、mouseY 與stage寬高中線的正負距離而漸變轉動

※將選用的點陣圖匯入元件庫，設定為內嵌資源類別，類別命名為MyPhoto

1000117_DisplayObject__mouseX_rotationY_3.swf

import flash.ui.Mouse;
import flash.events.MouseEvent;
import caurina.transitions.Tweener;
import flash.display.BitmapData;
import flash.display.MovieClip;
import flash.display.Bitmap;
//
var disX:int;
var disY:int;
//
var plane:MovieClip = new MovieClip();
addChild(plane);
var bmd:BitmapData = new MyPhoto();
var bm:Bitmap = new Bitmap(bmd);
plane.addChild(bm);
bm.scaleX = 0.9;
bm.scaleY = 0.9;

//bm左上角原對齊在plane的註冊點(0,0)，調整bm中心點位置使對齊plane的註冊點(0,0)
bm.x = - bm.width/2;
bm.y = - bm.height/2;

//由於bm中心點位置經上述調整，正對齊plane的註冊點(0,0)，也對齊stage的(0,0)
//想把plane從stage的(0,0)移動stage的中央，必須將stage的寬與高各除以2，指定給plane.x和plane.y
plane.x = stage.stageWidth/2;
plane.y = stage.stageHeight/2;

//
stage.addEventListener(MouseEvent.MOUSE_MOVE, rotateXY);
//
function rotateXY(e:MouseEvent):void{
 disX = mouseX - Math.ceil(stage.stageWidth/2);
 disY = mouseY - Math.ceil(stage.stageHeight/2);
 plane.rotationY = disX/16;
 plane.rotationX = -disY/16;
}

flash.utils套件__getDefinitionByName()函數 - 傳回所指定之類別的類別物件參照

getDefinitionByName()函數
public function getDefinitionByName(name:String):Object
傳回 name 參數所指定之類別的類別物件參照。
參數
name:String — 類別的名稱。
傳回值
Object — 會傳回 name 參數所指定之類別的類別物件參照。
擲回值
ReferenceError — 具有指定之名稱的公用定義不存在。

991231_GetDefinitionByName_1.swf

package  {
 import flash.utils.getDefinitionByName;
 import flash.display.Bitmap;
 import flash.display.BitmapData;
 import flash.display.Bitmap;
 import flash.display.Loader;
 //import flash.display.MovieClip;
 import flash.display.Sprite;
 import flash.net.URLRequest;
 import flash.events.Event;
 import flash.events.ProgressEvent;
 import flash.text.TextField;
 import flash.text.TextFieldAutoSize;
 //import flashx.textLayout.formats.FormatValue;
 import flash.text.TextFormat;

 public class GetDefinitionByName_1_991231 extends Sprite{
  //
  private var urlString:String = "991230_GetDefinitionByName_1.jpg";
  //
  //getDefinitionByName函數傳回flash.display.Loader類別的參照，指定給Class型別的classReference變數。
  private var classReference:Class = getDefinitionByName("flash.display.Loader") as Class;
  //new 運算子建構classReference類別實體，指定給Object型別的ldr變數。ldr已經參照了Loader類別。
  private var ldr:Object = new classReference();
  private var tf:TextField = new TextField();
  //
  public function GetDefinitionByName_1_991231() {
   setTextField();
   ldrFun();
  }
  
  //
  function setTextField():void{
   //
   var format:TextFormat = new TextFormat();
   with(format){
    color = 0xffffff;
    size = 86;
    font = "Arial";
   }
   //
   addChild(tf);
   with(tf){
    defaultTextFormat = format;
    x = 0;
    y = stage.stageHeight/2 -50 ;
    width = stage.stageWidth;
    autoSize = TextFieldAutoSize.CENTER;
   }
  };
  
  //
  private function ldrFun():void{
   ldr.load(new URLRequest(urlString));
   trace(urlString);
   ldr.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, onLoaderProgress);
   ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
  }
  
  //
  private function onLoaderProgress(e:ProgressEvent):void{
   tf.text = String(Math.floor(e.bytesLoaded/e.bytesTotal*100));
  }
  
  //
  private function onComplete(e:Event):void{
   trace(ldr); // [object LoaderInfo]
   var ldrBm:Bitmap = e.currentTarget.content as Bitmap;
   var bmd :BitmapData = ldrBm.bitmapData;
   var bm:Bitmap = new Bitmap(bmd);
   trace(bmd); // [object BitmapData]
   addChild(bm);
   bm.x = 50;
   bm.y = 30;
  }

 }
 
}

適用於 Adobe Flash Professional CS5 的 ActionScript 3.0 參考__●flash.utils_getDefinitionByName()函數

[AS3] flash.filter.ColorMatrixFilter(matrix) - matrix變形矩陣改變對比(contrast)

原圖：

參考此篇處理方式：
UNDERSTANDING AS3 COLORMATRIXFILTER CLASS

● 提高點陣圖對比(contrast)

991223_ColorMF_contrast1.swf

package  {
 import flash.display.Sprite;
 import flash.filters.ColorMatrixFilter;
 import flash.display.BitmapData;
 import flash.display.Bitmap;
 import flash.display.DisplayObject;
 //
 public class ColorMF_contrast1_991223 extends Sprite{
  public var bmd:BitmapData = new MyPhoto(0,0);
  public var bm:Bitmap = new Bitmap(bmd);
  public function ColorMF_contrast1_991223() {
   addChild(bm);
   var matrix:Array = new Array();
   matrix = matrix.concat([2, 0, 0, 0, -40]); //RED Channel
   matrix = matrix.concat([0, 2, 0, 0, -40]); //GREEN Channel
   matrix = matrix.concat([0, 0, 2, 0, -40]); //BLUE Channel
   matrix = matrix.concat([0, 0, 0, 1, 0]); //ALPHA Channel
   var myFilter:ColorMatrixFilter = new ColorMatrixFilter(matrix);
   bm.filters = [myFilter];
  }

 }
}

[AS3] flash.filter.ColorMatrixFilter(matrix) - matrix變形矩陣改變飽合度(saturation)

變形矩陣示意圖

原圖：將被提升色彩飽合度。

參考此篇處理方式：
UNDERSTANDING AS3 COLORMATRIXFILTER CLASS

991221_ColorMF_saturation.swf  - ↓ 以下 swf 檔色彩飽合度已提升。

package  {
 import flash.display.Sprite;
 import flash.filters.ColorMatrixFilter;
 import flash.display.BitmapData;
 import flash.display.Bitmap;
 import flash.display.DisplayObject;
 //
 public class ColorMF_saturation_991221 extends Sprite{
  public var bmd:BitmapData = new MyPhoto(0,0);
  public var bm:Bitmap = new Bitmap(bmd);
  public function ColorMF_saturation_991221() {
   addChild(bm);
   var matrix:Array = new Array();
   matrix = matrix.concat([2, -1, 0, 0, 0]); //RED Channel
   matrix = matrix.concat([-1, 2, 0, 0, 0]); //GREEN Channel
   matrix = matrix.concat([0, -1, 2, 0, 0]); //BLUE Channel
   matrix = matrix.concat([0, 0, 0, 1, 0]); //ALPHA Channel
   var myFilter:ColorMatrixFilter = new ColorMatrixFilter(matrix);
   bm.filters = [myFilter];
  }

 }
 
}

參考此篇處理方式：Matrix Operations for Image Processing - Paul Haeberli

991221_ColorMF_saturation2.swf

● s = 1 ← 點陣圖為原值




991221_ColorMF_saturation2a.swf

● s = 1.8 或 大於1 ← 點陣圖色彩飽合度增加




991221_ColorMF_saturation2b.swf

● s = 0 ← 點陣圖變成灰階




991221_ColorMF_saturation2c.swf

● s = 0 ← 點陣圖變成互補色

package  {
 import flash.display.Sprite;
 import flash.filters.ColorMatrixFilter;
 import flash.display.BitmapData;
 import flash.display.Bitmap;
 import flash.display.DisplayObject;
 //
 public class ColorMF_saturation2_991221 extends Sprite{
  public var bmd:BitmapData = new MyPhoto(0,0);
  public var bm:Bitmap = new Bitmap(bmd);
  public function ColorMF_saturation2_991221() {
   addChild(bm);
   //
   var rwgt:Number = 0.3086;
   var gwgt:Number = 0.6094;
   var bwgt:Number = 0.0802;
   //
   var s:Number = 1;
   //
   var a:Number = (1.0-s)*rwgt + s;
      var b:Number = (1.0-s)*gwgt;
      var c:Number = (1.0-s)*bwgt;
      var d:Number = (1.0-s)*rwgt;
      var e:Number = (1.0-s)*gwgt + s;
      var f:Number = (1.0-s)*bwgt;
      var g:Number = (1.0-s)*rwgt;
      var h:Number = (1.0-s)*gwgt;
      var i:Number = (1.0-s)*bwgt + s;
   //
   var matrix:Array = new Array();
   matrix = matrix.concat([a, b, c, 0, 0]); //RED Channel
   matrix = matrix.concat([d, e, f, 0, 0]); //GREEN Channel
   matrix = matrix.concat([g, h, i, 0, 0]); //BLUE Channel
   matrix = matrix.concat([0, 0, 0, 1, 0]); //ALPHA Channel
   var myFilter:ColorMatrixFilter = new ColorMatrixFilter(matrix);
   bm.filters = [myFilter];
  }

 }
 
}

[AS3] flash.filter.ColorMatrixFilter(matrix) - matrix變形矩陣改變色相(hue)

原圖~

matrix變形矩陣原值，此值忠於原圖，不會改變原圖的色相、飽合度、明度等。

matrix變形矩陣改值例子：交換RGB三色Channel的內容，及修改其數值大小與正負，可改變 Bitmap 物件(點陣圖) 色相(hue)

991221_ColorMF_hue.swf

package  {
 import flash.display.Sprite;
 import flash.filters.ColorMatrixFilter;
 import flash.display.BitmapData;
 import flash.display.Bitmap;
 import flash.display.DisplayObject;
 //
 public class ColorMF_hue_991221 extends Sprite{
  public var bmd:BitmapData = new MyPhoto(0,0);
  public var bm:Bitmap = new Bitmap(bmd);
  public function ColorMF_hue_991221() {
   addChild(bm);
   var matrix:Array = new Array();
   matrix = matrix.concat([0, 0, 1, 0, 0]); //RED Channel
   matrix = matrix.concat([0, 1, 0, 0, 0]); //GREEN Channel
   matrix = matrix.concat([1, 0, 0, 0, 0]); //BLUE Channel
   matrix = matrix.concat([0, 0, 0, 1, 0]); //ALPHA Channel
   var myFilter:ColorMatrixFilter = new ColorMatrixFilter(matrix);
   bm.filters = [myFilter];
  }

 }
 
}

[AS3] 使用matrix顏色變形矩陣操作Bitmap物件，使其為原值，圖形RGB不變

matrix[0]、matrix[6]、matrix[12] 值皆為1時，Bitmap物件為原值，圖形不變。

991221_ColorMF_identity.swf

package  {
 import flash.display.Sprite;
 import flash.filters.ColorMatrixFilter;
 import flash.display.BitmapData;
 import flash.display.Bitmap;
 import flash.display.DisplayObject;
 //
 public class ColorMF_identity_991221 extends Sprite{
  public var bmd:BitmapData = new MyPhoto(0,0);
  public var bm:Bitmap = new Bitmap(bmd);
  public function ColorMF_identity_991221() {
   addChild(bm);
   var matrix:Array = new Array();
   matrix = matrix.concat([1, 0, 0, 0, 0]); //RED Channel
   matrix = matrix.concat([0, 1, 0, 0, 0]); //GREEN Channel
   matrix = matrix.concat([0, 0, 1, 0, 0]); //BLUE Channel
   matrix = matrix.concat([0, 0, 0, 1, 0]); //ALPHA Channel
   var myFilter:ColorMatrixFilter = new ColorMatrixFilter(matrix);
   bm.filters = [myFilter];
  }

 }
 
}

[AS3] flash.filter.ColorMatrixFilter(matrix) - RGB到灰階

ColorMatrixFilter () 建構函式
public function ColorMatrixFilter(matrix:Array = null)

DisplayObject.filters = ColorMatrix 陣列物件
索引的陣列，其中包含目前和顯示物件相關的每個濾鏡物件。

適用於 Adobe Flash Professional CS5 的 ActionScript 3.0 參考__●flash.filters.ColorMatrixFilter類別
適用於 Adobe Flash Professional CS5 的 ActionScript 3.0 參考__●flash.filters.ColorMatrixFilter.matrix屬性
適用於 Adobe Flash Professional CS5 的 ActionScript 3.0 參考__●flash.display.DisplayObject.filters屬性

原圖：將在Flash中處理成灰階。

參考此篇處理方式：
UNDERSTANDING AS3 COLORMATRIXFILTER CLASS

991217_ColorMF_1.swf

package  {
 import flash.display.Sprite;
 import flash.display.BitmapData;
 import flash.filters.ColorMatrixFilter;
 import flash.display.Bitmap;
 import flash.display.DisplayObject;

 public class ColorMF_991217 extends Sprite{
  var photo1:BitmapData = new MyPhoto(0,0);
  var bm:Bitmap = new Bitmap(photo1);
  public function ColorMF_991217() {
   addChild(bm);
   var matrix:Array = new Array();
   matrix = matrix.concat([0.5, 0.5, 0.5, 0, 0]);
   matrix = matrix.concat([0.5, 0.5, 0.5, 0, 0]);
   matrix = matrix.concat([0.5, 0.5, 0.5, 0, 0]);
   matrix = matrix.concat([0, 0, 0, 1, 0]);
   var myFilter:ColorMatrixFilter = new ColorMatrixFilter(matrix);
   DisplayObject(bm).filters = [myFilter];
  }

 }
 
}

參考此篇處理方式：Matrix Operations for Image Processing - Paul Haeberli

991217_ColorMF_2.swf

package  {
 import flash.display.Sprite;
 import flash.display.BitmapData;
 import flash.filters.ColorMatrixFilter;
 import flash.display.Bitmap;
 import flash.display.DisplayObject;

 public class ColorMF2_991217 extends Sprite{
  var photo1:BitmapData = new MyPhoto(0,0);
  var bm:Bitmap = new Bitmap(photo1);
  public function ColorMF2_991217() {
   addChild(bm);
   //matrix 變形矩陣 - 灰階處理
   var matrix:Array = new Array();
   var rwgt:Number = 0.3086;
   var gwgt:Number = 0.6094;
   var bwgt:Number = 0.0802;
   matrix = matrix.concat([rwgt, gwgt, bwgt, 0, 0]);
   matrix = matrix.concat([rwgt, gwgt, bwgt, 0, 0]);
   matrix = matrix.concat([rwgt, gwgt, bwgt, 0, 0]);
   matrix = matrix.concat([0, 0, 0, 1, 0]);
   //ColorMatrixFilter建構式，以指定的參數 matrix 初始化新的 ColorMatrixFilter 實體。
   var myFilter:ColorMatrixFilter = new ColorMatrixFilter(matrix);
   //DisplayObject(bm).filters = [myFilter];
   //DisplayObject物件的filter屬性參照所有濾鏡組成的陣列
   bm.filters = [myFilter];
   trace(myFilter.matrix);
   trace(myFilter);
  }

 }
 
}

[AS3] 由Bitmap類別實體的bitmapData屬性參照BitmapData物件，以其fillRect()方法在點陣像素上繪製矩形填色

BitmapData()建構函式
public function BitmapData(width:int, height:int, transparent:Boolean = true, fillColor:uint = 0xFFFFFFFF)

BitmapData.fillRect()方法public function fillRect(rect:Rectangle, color:uint):void

Rectangle()建構函式
public function Rectangle(x:Number = 0, y:Number = 0, width:Number = 0, height:Number = 0)

991210_BitmapData_fillRect_1.swf

//
import flash.display.BitmapData;
import flash.display.Bitmap;
import flash.geom.Rectangle;

//
//BitmapData()建構函式
//public function BitmapData(width:int, height:int, transparent:Boolean = true, fillColor:uint = 0xFFFFFFFF)
var bmpData:BitmapData = new BitmapData(420, 320, true, 0xff6600ff);
var bitmap:Bitmap = new Bitmap(bmpData);
bitmap.x = 50;
bitmap.y = 50;
addChild(bitmap);

//
//Rectangle()建構函式
//public function Rectangle(x:Number = 0, y:Number = 0, width:Number = 0, height:Number = 0)
var rect1:Rectangle = new Rectangle(50, 120 ,20, 20);
for(var i:int=0; i<7; i++){
 //fillRect()方法  
 //public function fillRect(rect:Rectangle, color:uint):void
 //由Bitmap類別實體的bitmapData屬性參照BitmapData物件，
 //以其fillRect()方法在點陣像素上繪製矩形填色
 bitmap.bitmapData.fillRect(rect1, 0xffffffff);
 rect1.x += 20;
 rect1.y += 20;
}
//
var rect2:Rectangle = new Rectangle(170, 240 ,20, 20);
for(var j:int=0; j<12; j++){
 bitmap.bitmapData.fillRect(rect2, 0xffffffff);
 rect2.x += 20;
 rect2.y -= 20;
}

[AS3] 將Loader類別所載入外部點陣圖BitmapData資料轉植至新建的Bitmap類別實體

Bitmap()建構函式
public function Bitmap(bitmapData:BitmapData = null, pixelSnapping:String = "auto", smoothing:Boolean = false)

new Bitmap((Loader.content as Bitmap).bitmapData);

991210_BitmapData_1.swf

import flash.display.Loader;
import flash.net.URLRequest;
import flash.events.Event;
import flash.display.Bitmap;

//
const bmpURL:String = "991210_1.jpg";
//
var ldr:Loader = new Loader();
ldr.load(new URLRequest(bmpURL));
ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, bmpWork);
//
var showBmp1:Bitmap;
var showBmp2:Bitmap;
//
function bmpWork(e:Event):void{
 //
 var ldrBmp:Bitmap = ldr.content as Bitmap;
 //
 showBmp1 = new Bitmap(ldrBmp.bitmapData);
 showBmp1.x = 0;
 showBmp1.y = 0;
 addChild(showBmp1);
 //
 showBmp2 = new Bitmap(ldrBmp.bitmapData);
 showBmp2.scaleX = 0.3;
 showBmp2.scaleY = 0.3;
 showBmp2.x = 370;
 showBmp2.y = 255;
 addChild(showBmp2);
}

加上預載進度百分比

import flash.display.Loader;
import flash.net.URLRequest;
import flash.events.Event;
import flash.display.Bitmap;
import flash.events.ProgressEvent;
import flash.text.TextField;
import flash.text.TextFormat;

//
var format:TextFormat = new TextFormat();
format.size = 88;
format.color = 0xffff00;
//
var tF:TextField = new TextField();
tF.x = 220;
tF.y = 150;
tF.autoSize = TextFieldAutoSize.LEFT;
tF.defaultTextFormat = format;
addChild(tF);

//
const bmpURL:String = "991210_1.jpg";
//
var ldr:Loader = new Loader();
ldr.load(new URLRequest(bmpURL));
//
ldr.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, onLoaderProgress);
//
ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, bmpWork);

//
function onLoaderProgress(e:ProgressEvent):void{
 tF.text = String(Math.floor(e.bytesLoaded/e.bytesTotal*100));
}

//
var showBmp1:Bitmap;
var showBmp2:Bitmap;
//
function bmpWork(e:Event):void{
 //
 var ldrBmp:Bitmap = ldr.content as Bitmap;
 //
 showBmp1 = new Bitmap(ldrBmp.bitmapData);
 showBmp1.x = 0;
 showBmp1.y = 0;
 addChild(showBmp1);
 //
 showBmp2 = new Bitmap(ldrBmp.bitmapData);
 showBmp2.scaleX = 0.3;
 showBmp2.scaleY = 0.3;
 showBmp2.x = 370;
 showBmp2.y = 255;
 addChild(showBmp2);
}

適用於 Adobe Flash Professional CS5 的 ActionScript 3.0 參考__●flash.display.Loader.content屬性
適用於 Adobe Flash Professional CS5 的 ActionScript 3.0 參考__●flash.display.Bitmap類別
適用於 Adobe Flash Professional CS5 的 ActionScript 3.0 參考__●flash.events.ProgressEvent.PROGRESS