[AS3] デバッグ用のクラス KKConsole KKLogger

2011/08/10

こんにちは。きんくまです。
シュタインズゲートのアニメを見てて続きが気になって、XBox版の原作ゲームを買いました。
にもかかわらず、なかなか進められず、アニメのところまで追いつけず、結局アニメより先の内容は知らない今日この頃です。

さて、デバッグ用のクラスを2つ作りました。

KKConsole

ブラウザのconsole.logに出力します。
いざコンテンツをアップロードした後に、traceコマンドを使ってもそれを見るのが大変だったりするので、
ブラウザに出力すれば、簡単に確認できます。

console_fig1

Console.logに対応しているのって、ChromeとFirefox, Safariだったと思います。
IEでデバッグしたことないからわからないです。

ソース

package kinkuma.util
{
	import flash.external.ExternalInterface;

	public class KKConsole
	{
		public static function log(text:String):void
		{
			if(ExternalInterface.available){
				ExternalInterface.call("console.log", text);
			}
		}
	}
}

使い方

package
{
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	
	import kinkuma.util.KKConsole;
	
	[SWF(width="450",height="450",backgroundColor="0xffffff")]
	public class KKConsoleUsage extends Sprite
	{
		private var _clickTimes:int = 0;
		
		public function KKConsoleUsage()
		{
			addEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
		}
		
		protected function onAddedToStage(event:Event):void
		{
			removeEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
			stage.addEventListener(MouseEvent.CLICK, onStageMouseClick);
		}
		
		protected function onStageMouseClick(event:MouseEvent):void
		{
			_clickTimes++;
			var logText:String = "You clicked " + _clickTimes + " time";
			if(_clickTimes > 1){
				logText += "s";
			}
			KKConsole.log(logText);
		}
	}
}

ちなみに、もっと便利なやつは既に作られています。
今回作った方は、与えられた引数をそのままログに出力します。

>> AS3 でどこからでも log();
>>【デバッグ強化週間】log.asを使ってFirebugのコンソールにデータを出力!

KKLogger

ログを黒い四角の上に出力します。
ブラウザでは上のconsoleが使えるんですが、
例えばAndroid案件だと実機でのログ出力に困ったりします。
そんなときに使えると思います。
ていうか、こないだたまたまそういうのがあったので使いました。

package kinkuma.util
{
	import flash.display.Graphics;
	import flash.display.Shape;
	import flash.display.Sprite;
	import flash.text.TextField;
	import flash.text.TextFormat;
	
	public class KKLogger extends Sprite
	{
		private var _textField:TextField;
		private var _bg:Shape;
		
		public function KKLogger(aWidth:int = 200, aHeight:int = 150)
		{
			_textField = new TextField();
			_textField.multiline = true;
			_textField.width = aWidth;
			_textField.height = aHeight;
			addChild(_textField);
			var tf:TextFormat = new TextFormat();
			tf.font = "_sans";
			tf.color = 0xffffff;
			tf.size = 10;
			_bg = new Shape();
			addChildAt(_bg, 0);
			var g:Graphics = _bg.graphics;
			g.beginFill(0x000000, 0.8);
			g.drawRect(0,0,aWidth, aHeight);
			g.endFill();
			_textField.defaultTextFormat = tf;
			mouseChildren = mouseEnabled = false;
		}
		
		public function log(text:String):void
		{
			if(_textField.text == ""){
				_textField.text = text;
			}else{
				_textField.appendText("\n" + text);
			}
			var tft:String = _textField.text;
			var ar:Array = tft.split("\r");
			while(_textField.textHeight + 5 > _textField.height){
				ar.shift();
				_textField.text = ar.join("\n");
			}
		}
	}
}

使い方

package
{
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	
	import kinkuma.util.KKLogger;
	
	[SWF(width="450",height="450",backgroundColor="0xffffff")]
	public class KKLoggerUsage extends Sprite
	{
		private var _clickTimes:int = 0;
		private var _logger:KKLogger;
		
		public function KKLoggerUsage()
		{
			_logger = new KKLogger();
			_logger.x = 10;
			_logger.y = 10;
			addChild(_logger);
			
			addEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
		}
		
		protected function onAddedToStage(event:Event):void
		{
			removeEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
			stage.addEventListener(MouseEvent.CLICK, onStageMouseClick);
		}
		
		protected function onStageMouseClick(event:MouseEvent):void
		{
			_clickTimes++;
			var logText:String = "You clicked " + _clickTimes + " time";
			if(_clickTimes > 1){
				logText += "s";
			}
			_logger.log(logText);
		}
	}
}

wonderflにもアップしました。

KKLogger – wonderfl build flash online

githubにアップしました

githubに初めてアップしてみました。
>> https://github.com/KinkumaDesign/KKDebug

sshがなんちゃらかんちゃらって設定がよくわかんなかったけど、マニュアルに沿ってやったらなんかできました。
良かった良かった。


自作iPhoneアプリ 好評発売中!
フォルメモ - シンプルなフォルダつきメモ帳
ジッピー電卓 - 消費税や割引もサクサク計算!

ページトップへ戻る