この前紹介したAdobe AIRマルチメディアアプリケーションツールリスト（写真とビデオなど）のような画像／写真の編集ツールに対して、カラーの画像をグレースケール(gray scale)に変換するのは、基本な機能の一つだと思います。Flex／ActionScriptで実現するのは難しいですか？実は簡単です。以下のような一つの関数で変換できます。

※解説：グレースケール【gray scale】とは、コンピュータ上での色の表現方法の一つ。画像を白から黒までの明暗だけで表現し、色の情報は含まない「モノクロ」のこと。灰色を何階調で表現するかをビット数によって表す。1ビットの場合は白と黒のみで中間色がない状態で、8ビットなら(白と黒を含めて)256階調、16ビットなら65536階調の灰色で表現する。

・以下は画像の色をグレースケール(gray scale)に変換する関数のソースコードです。

  1. private function convertToGrayscale(image:DisplayObject):void
  2. {
  3.  
  4. var matrix:Array = [0.3, 0.59, 0.11, 0, 0,
  5.            0.3, 0.59, 0.11, 0, 0,
  6.            0.3, 0.59, 0.11, 0, 0,
  7.            0, 0, 0, 1, 0];
  8.  
  9. var grayscaleFilter:ColorMatrixFilter = new ColorMatrixFilter(matrix);
  10.  
  11. image.filters = [grayscaleFilter];
  12. }

MXMLで同じの機能も実現できます。

  1. <?xml version="1.0" encoding="utf-8"?>
  2.  
  3. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
  4. <mx:Image id="photo1" source="@Embed('mountains.jpg')">
  5.  
  6. <mx:filters>
  7. <mx:ColorMatrixFilter matrix="[0.3, 0.59, 0.11, 0, 0, 0.3, 0.59, 0.11, 0, 0, 0.3, 0.59, 0.11, 0, 0, 0, 0, 0, 1, 0]“
  8. />
  9.  
  10. </mx:filters>
  11. </mx:Image>
  12. <mx:Image id="photo2" source="@Embed('mountains.jpg')">
  13.  
  14. <mx:filters>
  15. <mx:ColorMatrixFilter matrix="[0.33, 0.33, 0.33, 0, 0, 0.33, 0.33, 0.33, 0, 0, 0.33, 0.33, 0.33, 0, 0, 0, 0, 0, 1, 0]“/>
  16.  
  17. </mx:filters>
  18. </mx:Image>
  19. </mx:Application>
メインコンテンツEND ■
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...

Posted on Monday, 2nd February 2009 by admin

Tags: , , ,
Posted in ActionScript | Comments (1) | 7,185 views

One Response to “ActionScript/MXMLで画像の色(カラー)をグレースケール(gray scale)に変換する関数”

  1. Branberyheag Lab | ColorMatrixFilterクラス Says:
    September 2nd, 2009 at 1:05 pm

    [...] MXMLのでもColorMatrixFilterが使えるみたい ActionScript/MXMLで画像の色(カラー)をグレースケール(gray scale)に変換する関数 [...]

Leave a Reply