Flash

ActionScriptで透過ビットマップのロールオーバーを判定。

2011.06.15 / Labs

マウスのロールオーバー時に、ビットマップの透過ではない部分でのみ判定をする方法です。
通常ビットマップのマウス判定には矩形エリア全体が対象になるので、透明PNGの透明部分でも判定されてしまいます。
それを回避する方法として、マウスのイベントリスナーを使うのではなく、マウス座標上にあるビットマップのピクセル色が透明かどうかを測定して、判定をするようにしています。
サンプルはこちら

package {
	
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	import flash.display.PixelSnapping;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	
	public class Main extends Sprite {
		
		public function Main() {
			var target:Sprite = new Sprite();
			
			//ライブラリ内の「Cloud」ビットマップクラス（透過PNG）インスタンスを作成
			var bitmap_data:BitmapData = new Cloud();
			var bitmap:Bitmap = new Bitmap(bitmap_data, PixelSnapping.NEVER, true);
			target.addChild(bitmap);
			stage.addChild(target);
			setBitmapRollOverOut(target, bitmap_data, targetOverTest, targetOutTest);
		}
		
		//ロールオーバー時
		private function targetOverTest(target:*):void {
			target.buttonMode = true;
			target.alpha = 0.5;
		}
		
		//ロールアウト時
		private function targetOutTest(target:*):void {
			target.buttonMode = false;
			target.alpha = 1;
		}
		
		//引数にロールオーバー時、ロールアウト時の関数を渡します
		private function setBitmapRollOverOut(target:Object, bitmap_data:BitmapData, rolloverFunction:Function, rolloutFunction:Function):void {
			var color:uint = 0;
			target.addEventListener(Event.ENTER_FRAME, targetOverEnter);
			
			function targetOverEnter(event:Event):void {
			
				//マウス位置のビットマップの（アルファ値を含む）ピクセル色を測定
				color = bitmap_data.getPixel32(target.mouseX, target.mouseY);
				
				//ビットマップが透明でなければロールオーバー関数を実行
				if (color != 0) {
				
					//ロールオーバー関数の実行を一度だけにするため、一旦エンターフレームを解除します
					//同時にロールアウトのエンターフレームを再開します
					target.removeEventListener(Event.ENTER_FRAME, targetOverEnter);
					target.addEventListener(Event.ENTER_FRAME, targetOutEnter);
					rolloverFunction(target);
				}
			}
			
			function targetOutEnter(event:Event):void {
			
				//マウス位置のビットマップの（アルファ値を含む）ピクセル色を測定
				color = bitmap_data.getPixel32(target.mouseX, target.mouseY);
				
				//ビットマップが透明だったらロールアウト関数を実行
				if (color == 0) {
				
					//ロールアウト関数の実行を一度だけにするため、一旦エンターフレームを解除します
					//同時にロールオーバーのエンターフレームを再開します
					target.addEventListener(Event.ENTER_FRAME, targetOverEnter);
					target.removeEventListener(Event.ENTER_FRAME, targetOutEnter);
					rolloutFunction(target);
				}
			}
		}
	}
}

package {

import flash.display.Bitmap;

import flash.display.BitmapData;

import flash.display.PixelSnapping;

import flash.display.Sprite;

import flash.events.Event;

import flash.events.MouseEvent;

public class Main extends Sprite {

public function Main() {

var target:Sprite = new Sprite();

//ライブラリ内の「Cloud」ビットマップクラス（透過PNG）インスタンスを作成

var bitmap_data:BitmapData = new Cloud();

var bitmap:Bitmap = new Bitmap(bitmap_data, PixelSnapping.NEVER, true);

target.addChild(bitmap);

stage.addChild(target);

setBitmapRollOverOut(target, bitmap_data, targetOverTest, targetOutTest);

}

//ロールオーバー時

private function targetOverTest(target:*):void {

target.buttonMode = true;

target.alpha = 0.5;

}

//ロールアウト時

private function targetOutTest(target:*):void {

target.buttonMode = false;

target.alpha = 1;

}

//引数にロールオーバー時、ロールアウト時の関数を渡します

private function setBitmapRollOverOut(target:Object, bitmap_data:BitmapData, rolloverFunction:Function, rolloutFunction:Function):void {

var color:uint = 0;

target.addEventListener(Event.ENTER_FRAME, targetOverEnter);

function targetOverEnter(event:Event):void {

//マウス位置のビットマップの（アルファ値を含む）ピクセル色を測定

color = bitmap_data.getPixel32(target.mouseX, target.mouseY);

//ビットマップが透明でなければロールオーバー関数を実行

if (color != 0) {

//ロールオーバー関数の実行を一度だけにするため、一旦エンターフレームを解除します

//同時にロールアウトのエンターフレームを再開します

target.removeEventListener(Event.ENTER_FRAME, targetOverEnter);

target.addEventListener(Event.ENTER_FRAME, targetOutEnter);

rolloverFunction(target);

}

function targetOutEnter(event:Event):void {

//マウス位置のビットマップの（アルファ値を含む）ピクセル色を測定

color = bitmap_data.getPixel32(target.mouseX, target.mouseY);

//ビットマップが透明だったらロールアウト関数を実行

if (color == 0) {

//ロールアウト関数の実行を一度だけにするため、一旦エンターフレームを解除します

//同時にロールオーバーのエンターフレームを再開します

target.addEventListener(Event.ENTER_FRAME, targetOverEnter);

target.removeEventListener(Event.ENTER_FRAME, targetOutEnter);

rolloutFunction(target);

}

ActionScriptでXMLを操作するときのメモ。

2011.03.29 / Notes

ActionScriotでXMLを操作する際に、よく使うメソッドのメモです。

var xml:XML =
<root>
	<item id="1">
		<name>test1</name>
		<url>www.example1.com</url>
	</item>
	<item id="2">
		<name>test2</name>
		<url>www.example2.com</url>
	</item>
	<item id="3">
		<name>test3</name>
	</item>
</root>;

//一つ目（0番目）の「item」ノード内の「name」ノードの内容を取得
trace(xml.item[0].name)
//test1

//二つ目の「item」ノードの「id」属性を取得
trace(xml.child("item")[1].@id)
//2

//「item」ノードの数を取得
trace(xml.item.length());
//3

//「item」ノード内の「url」ノードの数を取得
trace(xml.item..url.length());
//2

//一つ目（0番目）の「item」ノードの二つ目（1番目）のノード名を取得
trace(xml.item[0].child(1).name());
//url

//「item」ノード内の「name」ノードの内容が「test1」の「url」ノードの内容を取得
trace(xml.item.(name == "test1").url);
//www.example1.com

//「item」ノード内の「id」属性が「2」の「url」ノードの内容を取得
trace(xml.item.(@id == 2).url)
//www.example2.com

//三つ目（2番目）の「item」ノードに「url」ノードの有無をブール値で取得
trace(xml.item[2].hasOwnProperty("url"));
//false

var xml:XML =

<root>

<url>www.example1.com</url>

</item>

<url>www.example2.com</url>

</item>

</item>

</root>;

//一つ目（0番目）の「item」ノード内の「name」ノードの内容を取得

trace(xml.item[0].name)

//test1

//二つ目の「item」ノードの「id」属性を取得

trace(xml.child("item")[1].@id)

//2

//「item」ノードの数を取得

trace(xml.item.length());

//3

//「item」ノード内の「url」ノードの数を取得

trace(xml.item..url.length());

//2

//一つ目（0番目）の「item」ノードの二つ目（1番目）のノード名を取得

trace(xml.item[0].child(1).name());

//url

//「item」ノード内の「name」ノードの内容が「test1」の「url」ノードの内容を取得

trace(xml.item.(name == "test1").url);

//www.example1.com

//「item」ノード内の「id」属性が「2」の「url」ノードの内容を取得

trace(xml.item.(@id == 2).url)

//www.example2.com

//三つ目（2番目）の「item」ノードに「url」ノードの有無をブール値で取得

trace(xml.item[2].hasOwnProperty("url"));

//false

Flashプレーヤーでバージョン関連の参考ページ。

2011.02.01 / Notes

Flash

Flashプレイヤーの普及率は高く、バージョンにおける問題はそれほど発生することがありません。今ではバージョン10を対象にした制作が主流です。
ですが、ごく稀に旧バージョン対応コンテンツを制作の場合には、下記のページが参考になります。

Flashプレイヤーの普及率: バージョン別、地域別でFlashプレイヤーの普及率を見ることができます。世界と比べると日本での普及率は、やや低いですね。
Flashプレイヤーのバージョンチェック: ブラウザにインストールしてあるFlashプレイヤーのバージョンを確認できます。（あまり目立たない位置にありますが）
Flashプレイヤーアンインストーラ: Flashプレイヤーのアンインストーラが各OSごとに用意されています。旧バージョンをインストールする場合に、予めアンインストールする必要があります。
Flashプレイヤー旧バージョン: 開発用途で旧バージョンのFlashプレイヤーが配布されています。

ActionScriptで年月日を取得。

2011.01.09 / Notes

ActionScriptで年月日を取得して表示する際のメモです。

var date:Date = new Date();
var days:Array = new Array();
var today:String = new String();
days = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"];
today = date.fullYear+"/"+(date.month+1)+"/"+date.date+"("+days[date.day]+")";
trace(today);//2011/1/9(sun)

var date:Date = new Date();

var days:Array = new Array();

var today:String = new String();

days = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"];

today = date.fullYear+"/"+(date.month+1)+"/"+date.date+"("+days[date.day]+")";

trace(today);//2011/1/9(sun)

月は0（1月）から11（12月）で、曜日は0（日曜日）から6（土曜日）の値を返します。

ActionScriptで外部のSWFファイルに登録してあるフォントを、動的に埋め込む方法です。
初めにフォント情報をリンケージとして登録するためのSWFを作成します。
新規でflaファイルを作成して、ライブラリパネル上で右クリックから表示されるコンテクストメニューで「新しいフォント…」を選択します。

フォント名を入力して、埋め込みたいフォントと文字を選択します。
ここでのフォント名は後から参照することはないので、自由な名称で構いません。

続いて「ActionScript」タブからリンケージの「アクションスクリプト用に書き出し」にチェックを入れて、クラス名を入力します。
このクラス名は埋め込みの際にActionScriptから参照します。

これでライブラリパネルに、リンケージとしてフォントが登録されました。
この状態でSWFファイルを書き出して、ファイル名を「fonts.swf」としておきます。

次に、作成した外部SWFを読み込み、フォントを埋め込むActionScriptファイルを作成します。
下記のようなスクリプトを記述します。

package {
	
	import flash.display.Loader;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.net.URLRequest;	
	import flash.system.ApplicationDomain;
	import flash.text.AntiAliasType;
	import flash.text.Font;
	import flash.text.TextField;
	import flash.text.TextFormat;

	public class Main extends Sprite {
			
		public function Main() {
			var loader:Loader = new Loader();
			loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
			loader.load(new URLRequest("fonts.swf"));
		
			function onComplete(event:Event):void {
				var domain:ApplicationDomain = loader.contentLoaderInfo.applicationDomain;
				var HelveticaRegular:Class = domain.getDefinition("HelveticaRegular") as Class;
				var field:TextField = new TextField();
				var format:TextFormat = new TextFormat();
				var helvetica_regular:Font = new HelveticaRegular();
				Font.registerFont(HelveticaRegular);
				format.font = helvetica_regular.fontName;
				field.defaultTextFormat = format;
				field.embedFonts = true;
				field.antiAliasType = AntiAliasType.ADVANCED;
				field.text = "Font embedded via external swf file.";
				stage.addChild(field);
			}
		}
	}
}

package {

import flash.display.Loader;

import flash.display.Sprite;

import flash.events.Event;

import flash.net.URLRequest;

import flash.system.ApplicationDomain;

import flash.text.AntiAliasType;

import flash.text.Font;

import flash.text.TextField;

import flash.text.TextFormat;

public class Main extends Sprite {

public function Main() {

var loader:Loader = new Loader();

loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);

loader.load(new URLRequest("fonts.swf"));

function onComplete(event:Event):void {

var domain:ApplicationDomain = loader.contentLoaderInfo.applicationDomain;

var HelveticaRegular:Class = domain.getDefinition("HelveticaRegular") as Class;

var field:TextField = new TextField();

var format:TextFormat = new TextFormat();

var helvetica_regular:Font = new HelveticaRegular();

Font.registerFont(HelveticaRegular);

format.font = helvetica_regular.fontName;

field.defaultTextFormat = format;

field.embedFonts = true;

field.antiAliasType = AntiAliasType.ADVANCED;

field.text = "Font embedded via external swf file.";

stage.addChild(field);

}

上記はドキュメントクラスとして記述した場合の例です。

var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
loader.load(new URLRequest("fonts.swf"));

var loader:Loader = new Loader();

loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);

loader.load(new URLRequest("fonts.swf"));

初めに作成した外部SWFファイルを読み込みます。

var domain:ApplicationDomain = loader.contentLoaderInfo.applicationDomain;
var HelveticaRegular:Class = domain.getDefinition("HelveticaRegular") as Class;

1 2	var domain:ApplicationDomain = loader.contentLoaderInfo.applicationDomain; var HelveticaRegular:Class = domain.getDefinition("HelveticaRegular") as Class;

外部SWFファイルにリンケージとして登録したフォント（クラス）を利用可能にするために「ApplicationDomain」を登録します。
フォントクラス「HelveticaRegular」として登録します。

Font.registerFont(HelveticaRegular);

1	Font.registerFont(HelveticaRegular);

先ほど登録したフォントクラスを、グローバルフォントに登録します。

format.font = helvetica_regular.fontName;

1	format.font = helvetica_regular.fontName;

フォントクラスから作成したオブジェクトをもとに、テキストフォーマットにフォント名を指定します。

field.embedFonts = true;

1	field.embedFonts = true;

フォントの埋め込みを有効にします。

field.antiAliasType = AntiAliasType.ADVANCED;

1	field.antiAliasType = AntiAliasType.ADVANCED;

フォントクラスから埋め込みの際のテキストフィールドは、アンチエイリアスが「NORMAL」の状態で、あまりきれいではないので「ADVANCED」に変更します。

Almondlab

Flash

ActionScriptで透過ビットマップのロールオーバーを判定。

ActionScriptでXMLを操作するときのメモ。

Flashプレーヤーでバージョン関連の参考ページ。

ActionScriptで年月日を取得。

外部SWFファイルからフォントの埋め込み。