イナヅマTVログ

2011.02.07
01:49
author: taikiken
0件のコメント

dispatchEventでEvent.targetがかわるよ、どうしようこうしよう

Flashで作ったswfをFlash BuilderでEmbedして使う で使ったクラスを利用しやすいようにチョイ変えようとしたんだけど、dispatchEvent(event)のEventインスタンス引数を関数呼び出しの引数と同じように勘違いしてしまい下記のようなコードにしてしまいダメダメに終わってしまいました。

package
{
	import flash.display.Loader;
	import flash.display.LoaderInfo;
	import flash.display.MovieClip;
	import flash.events.Event;
 
	public class ExampleClass extends MovieClip
	{
		[Embed(source="assets/example.swf", mimeType="application/octet-stream")]
		private var SWFParts:Class;
 
		public function ExampleClass()
		{
			init();;
		}
		private function init ():void
		{
			var lc:LoaderContext = new LoaderContext();
			lc.allowCodeImport = true;
 
			var loader:Loader = new Loader();
			loader.loadBytes(new SWFParts(), lc);
			loader.contentLoaderInfo.addEventListener(Event.COMPLETE, function(event:Event):void{
				trace(event.target);//[object LoaderInfo]
				dispatchEvent(event);
				}
			);
		}
	}
}

イベントハンドラに届いたEventインスタンスはtargetが変わります。
当たり前ですよね、targetは発生元になるから…

var example:ExampleClass = new ExampleClass();
example.addEventListener(Event.COMPLETE, onEmbedComplete);
 
function onEmbedComplete (event:Event):void {
	trace(event.currentTarget);// [object ExampleClass]
}

targetが変わらないようにするためには関数を呼び出してもらう方法があります。

package
{
	import flash.display.Loader;
	import flash.display.LoaderInfo;
	import flash.display.MovieClip;
	import flash.events.Event;
 
	public class ExampleClass
	{
		[Embed(source="assets/example.swf", mimeType="application/octet-stream")]
		private var SWFParts:Class;
 
		private var _closure:Function;
 
		public function ExampleClass(closure:Function)
		{
			_closure = closure;
			init();;
		}
		private function init ():void
		{
			var lc:LoaderContext = new LoaderContext();
			lc.allowCodeImport = true;
 
			var loader:Loader = new Loader();
			loader.loadBytes(new SWFParts(), lc);
			loader.contentLoaderInfo.addEventListener(Event.COMPLETE, function(event:Event):void{
				trace(event.target);//[object LoaderInfo]
				_closure(event);
				}
			);
		}
	}
}

終了時に呼び出して欲しい関数を先に登録(?)しとくとEventインスタンスの中身は変わらない。

var example:ExampleClass = new ExampleClass(onEmbedComplete);
 
function onEmbedComplete (event:Event):void {
	trace(event.currentTarget);//[object LoaderInfo]
}

setTimeOutなんかで実行して欲しい関数を設定するのに似てるかな。

2011.02.06
13:23
author: taikiken
0件のコメント

Flash CS5で作った埋め込みFontをFlash Bilder 4でEmbedして使う

Flash Bilder 4日本語で文字を限定した埋め込みFontの作り方が面倒くさそう。
Flash CS5 で埋め込みFontを作成してFlash Builder 4で使ってみることにしました。

【Flash CS5】
1.Flash新規ドキュメント(Actionscript 3)
2.テキストツール(T)でテキストフィールドを作成

以下、プロパティパネル
3.今回はTLFテキストを選択しました
4.埋め込みたいフォントのフォントファミリーとスタイルを選択
5.埋め込み…をクリック
6.オプションタブ:名前を入力、埋め込む文字を指定

フォントの埋め込み(オプション)

フォントの埋め込み(オプション)


7.Actionscriptタブ:アウトラインフォーマットを選択
 アウトラインフォーマットは、クラシック(DF3)とTLF(DF4)のどちらかを選択します。
 Actionscript 用に書き出しと1 フレームに書き出しにチェック
 クラス名にはオプションでつけた名前が入っています
 今回のクラス名は"HiraginoKakuGoW3"です
フォントの埋め込み(Actionscript)

フォントの埋め込み(Actionscript)


 クラシックはFlash Player 9までの従来のTextFieldのことで
 TLFはFlash Player 10以降のflash.text.engine.*flashx.textLayout.*のことだろうと思います。
http://help.adobe.com/ja_JP/flash/cs/using/WSb03e830bd6f770ee21a3597d124daee0526-8000.html

「ActionScript 用に書き出し」を選択した場合は、アウトラインフォーマットも選択します。TLF テキストコンテナの場合は、「TLF(DF4)」をアウトラインフォーマットとして選択します。クラシックテキストコンテナの場合は、「クラシック(DF3)」を選択します。
TLF コンテナとクラシックテキストコンテナのそれぞれで埋め込みフォントシンボルを使用するには、それぞれのコンテナごとに埋め込みフォントシンボルを作成する必要があります。TLF(DF4)アウトラインフォーマットは、PostScript Type 1 フォントでは使用できません。TLF(DF4)を使用するには、Flash Player バージョン 10 以降が必要です。

8.パブリッシュする。今回はfont.swfにしました。

【Flash Builder 4】
フォントをEmbedするClassをFontFamilyとしsingletonで作成しています。
リンケージクラス名をsymbolに設定します。

package
{
	import flash.events.EventDispatcher;
	import flash.events.IEventDispatcher;
	import flash.text.Font;
 
	public class FontFamily extends EventDispatcher
	{
		private static var _instance:FontFamily;
 
		[Embed(source="assets/font.swf", symbol="HiraginoKakuGoW3")]
		private static var HiraginoKakuGoW3:Class;
 
		private static var _hiraginow3:Font;
 
		public function FontFamily(target:IEventDispatcher=null)
		{
			super(target);
			if( _instance != null ) throw new Error("Error:FontFamily already initialised.");
			if( _instance == null ) _instance = this;
		}
 
		public static function get instance():FontFamily
		{
			return initialize();
		}
 
		private static function initialize():FontFamily
		{
			if (_instance == null){
				_instance = new FontFamily();
			}
			return _instance;
		}
 
		public static function get hiraginow3():Font
		{
			if (!_hiraginow3)
				_hiraginow3 = new HiraginoKakuGoW3() as Font;
			return _hiraginow3;
		}
	}
}

使い方はいたって簡単です。
今回はflash.text.engine.*を使いました。

var size:uint = 13;
var color:uint = 0xffffff;
var locale:String = 'ja';
 
// FontFamily.hiraginow3.fontName
// FontLookup.EMBEDDED_CFF
var font:FontDescription = new FontDescription(FontFamily.hiraginow3.fontName,FontWeight.NORMAL, FontPosture.NORMAL, FontLookup.EMBEDDED_CFF, RenderingMode.CFF);
 
var format:ElementFormat = new ElementFormat(font, size, color);
format.locale = locale;
 
var textBlock:TextBlock = new TextBlock();
textBlock.lineRotation = TextRotation.ROTATE_0;
textBlock.textJustifier = new EastAsianJustifier(locale, LineJustification.UNJUSTIFIED);
 
var str:String = "埋め込みFont作成";
var w:uint = 300;
 
var textElement:TextElement = new TextElement(str, format);
textBlock.content = textElement;
 
var textLine:TextLine = textBlock.createTextLine(null, w);
 
var ypos:uint = 0;
while(textLine) {
	addChild(textLine);
	textLine.x = 0;
	ypos += textLine.textHeight + 8;
	textLine.y = ypos;
	textLine = textBlock.createTextLine(textLine, w);
}

FontDescriptionを新規作成する時にフォント名を指定するのと、FontLookup.EMBEDDED_CFFに設定します。

Text Engine めんどくさい。
Text Layout Framework(TLF)もかなりめんどくさいけど、負けず劣らずです。
Adobeは何をさせたいんかなぁ。

ところで、Text Engine と TLFの使い分けはどこなんでしょう?

2011.02.05
07:41
author: taikiken
1件のコメント

Flashで作ったswfをFlash BuilderでEmbedして使う

Flashで作成したswfをFlash BuilderでEmbedして利用するのに右往左往したのでメモ。

Embed ClassをnewしてもインスタンスはMovieClipにならず、ByteArrayのような状態(?)になっているらしい。
byteをLoader.loadBytesを使ってloadする。
非同期イベントEvent.COMPLETEを待って処理を開始する。
あと、AIR 2, Flash Player 10.1で変更されたセキュリティ・ポリシーに対応するため LoaderContext.allowCodeImporttrueにする。

*Flash CS5 で作成したexample.swfをFlash Builder 4でEmbedして使う。
*swfのステージにインスタンス名"some_mc"のMovieClipが配置されている。

package
{
	import flash.display.Loader;
	import flash.display.LoaderInfo;
	import flash.display.MovieClip;
	import flash.events.Event;
 
	public class ExampleClass
	{
		[Embed(source="assets/example.swf", mimeType="application/octet-stream")]
		private var SWFParts:Class;
 
		public function ExampleClass()
		{
			init();;
		}
		private function init ():void
		{
			var lc:LoaderContext = new LoaderContext();
			lc.allowCodeImport = true;
 
			var loader:Loader = new Loader();
			loader.loadBytes(new SWFParts(), lc);
			loader.contentLoaderInfo.addEventListener(Event.COMPLETE, function(event:Event):void{
				var mc:MovieClip = event.target.content;
				var some_mc:MovieClip = mc.getChildByName('some_mc') as MovieClip;
				}
			);
		}
	}
}

AIR 2, Flash Player 10.1で変更されたセキュリティ・ポリシーにひっかったのが大きかった。
これが良くわからず時間がかかってしまいました。
LoaderContext.allowCodeImport はデフォルトではfalseでtrueにしないとセキュリティエラーが発生します。
SecurityError: Error #3226: Cannot import a SWF file when LoaderContext.allowCodeImport is false.

Adobeのサイトに解説がありました。
Understanding the security changes in Flash Player 10.1 and AIR 2

If the content to be loaded is a SWF file when you have set LoaderContext.allowCodeImport = false for an import operation, a SecurityError event will be dispatched, indicating error 3226:

Note that LoaderContext.allowCodeImport affects only cases that perform sandbox importing—so, for example, an ordinary Loader.load operation will always load either a SWF file or an image file, even if LoaderContext.allowCodeImport = false.

なんか超面倒くさい。
swfぐらい簡単にEmbedさせてくれたら良いのに、なんでこんな手間のかかる手順をしなきゃいけないんだ。
ライブラリにリンケージ設定されているシンボルを使うのはビックリするくらい簡単なのに。

*追記
読み込まれるswfに配置されているインスタンスにリンケージ設定するとgetChildByNameで取得できませんでした。

2011.02.01
03:21
author: taikiken
0件のコメント

GTween.proxyを使ってみました

GTweenに用意されているproxyプロパティを使ってみました。
サンプル無いから使い方分かんないと思っていましたがAPIドキュメントに書いてありました。

使い方が分かるとかなり便利な機能でした。
Tween対象のプロパティを後で決めることが可能になります。

Demo

import com.gskinner.motion.GTween;
import com.gskinner.motion.easing.*;
import com.gskinner.motion.plugins.*;
import flash.events.MouseEvent;
 
ColorTransformPlugin.install();
 
var gt:GTween = new GTween(target_mc, 1, null, {ease:Sine.easeOut, onComplete:onGTComplete});
 
function onGTComplete (g:GTween):void {
	trace(g);
}
 
x_btn.addEventListener(MouseEvent.CLICK, onClick);
y_btn.addEventListener(MouseEvent.CLICK, onClick);
color_btn.addEventListener(MouseEvent.CLICK, onClick);
 
function onClick (e:MouseEvent):void {
	switch (e.target.label.toLowerCase()) {
		case "x" :
			gt.proxy.x = (stage.stageWidth - target_mc.width) * Math.random();
			break;
		case "y" :
			gt.proxy.y = (stage.stageHeight - target_mc.height) * Math.random();
			break;
		case "color" :
			gt.proxy.tint = 0xffffffff * Math.random();
			break;
	}
}

Fade In / Out しなくちゃ行けない時に便利に使えそう。

2011.01.30
13:11
author: taikiken
1件のコメント

iPhone, iPad で Flash を見れるブラウザアプリPuffin – それなりに

ようやくなんとかFlashコンテンツを見れるブラウザアプリが登場しました。
価格は 100円。
早速ダウロードして使いました。

それなりに見れる、まぁ見れるな感じですが…

Puffin Web Browser – CloudMosa, Inc.

http://www.cloudmosa.com/puffin-ios.php
の説明によれば、クラウドベースのブラウザって書いてあるので、どこかのサーバーでレンダリングされたデータを転送しているんでしょうかね。

Puffin is a cloud accelerated web browser for mobile devices. Key features and advantages:

  • Render desktop version websites extremely fast
  • Run modern web applications with 100% compatibility
  • Work very well on smartphones and perform even better on tablets

Flash features and limitations:

  • Display Flash contents (click to enable)
  • Stream Flash videos (YouTube only)
  • Play Flash games (not optimized and no sound)

iPadで使うとご機嫌です。
デスクトップバージョンのコンテンツが見れる、というのが売りみたいです。
そのため画面は自動縮小されずにiPhoneだと横へもスクロールしながらのブラウズになるので若干使いずらい感じがあります。
iPadの大画面がベストです。

オマケですが、Shadowbox系のポップアップがmobile webkitだとうまく表示されない問題も解消します。

アクセス速度はギリですが許容範囲でしょう、Flashの再生パフォーマンスは残念な感じがします、仕組みが仕組みだけにしょうがないとあきらめるしか無いのでしょう。

ハードとiOSに最適化されたネイティブ Flash Player が登場すればそこそこ使えそうに思えてきましたが、ジョブズさんの気は変わらないでしょうねぇ。
アプリケーション・プロバイダ独自の電子書籍市場を閉め出そうとしてる位ですから…

なにはともあれ使い方自体は普通のブラウザと変わらない簡単さでiPhone, iPadでFlashコンテンツが見れるのは嬉しいお知らせでした。

update 2011-01-31
昨日(2011-01-30)は福岡てら子に出席しながら東京てら子のUstをこのPuffinで見ていたのですが、動画部分はコマ落ちしてしまいますが音声は問題なく聞くことができました。
使い方によってはありだなぁと思う今日この頃です。

update 2011-05-10
Puffinを使ってFacebookにログインしようとしたところ、いつもと違うIP、リージョンを使ってアクセスしているのでテストに合格しないとアクセスさせてあげないと怒られました。
Facebookのユーザーアイコンを見せられどの友人かを3人当てないとなりませんでした。

やはり、想像どおりサーバーでレンダリングしたデータを送信してるようです。

ということは、

ID, パスワードの入力はまずい気がしてきました。
Puffinチームを信用しないという訳では無いですが、彼らはユーザーが送信したデータの扱いをどうしてるのかが気になります。

クレジットカードは絶対無しでしょう。

Flashを軽く楽しめるブラウザとして使うのが良さそうです。

2011.01.18
12:05
author: taikiken
0件のコメント

【Memolane】Facebook,Twitter,flickr,forsquare他を時系列に並べるサービス

ベータアカウントの準備ができたとMemolaneからメールが来たので早速アカウントを設定して使ってみました。

facebook, twitter, flickr, Picasa, last.fm, forsquare, Tripit, YouTubeなどのWebサービスと接続しMemolane上で時系列に並べてくれるサービスです。
他にRSSも指定できるのでほぼ全てのサービスと連携が可能です。

並んでみるとなかなか興味深いものがあります。

日頃はTwitterとtumblrメインでたまにYouTubeでオキニに登録してるのですが、それがちゃんとまとめられると価値があるように思えます。

ありそうでなかったサービス、Memolaneはなかなか良さげです。
UIも凝っていて使いやすいし面白いと感じました。

2011.01.17
14:42
author: taikiken
0件のコメント

ActionScript 3.0, AS2ライクにDuplicateMovieclipをするために2 – 完全に複製できない

Actionscript 3.0, AS2ライクにDuplicateMovieclipをするために、でsenocularさんのコードを紹介しましたが、@tail_y さんよりオーサリングMCではできない指摘がありました。

以下、@tail_y さんのTLより。

実行してみたけど、やっぱオーサリングのMCは、内容をコピーしてこれないよ

MC.clone()実験報告1 まず、巷ではconstructorでできるよーって記事が出回っているけど、これは嘘。オリジナル拡張したMCに限って、コンストラクタに処理が走るので同じような表示になるように見えているだけで、オーサリングのMCは空MCになってしまう。

MC.clone()実験報告2 オーサリングMCでは、表示物はShapeクラスにまとめられ、childに入っている。ところが、このShapeのgraphics.copyFrom()が全然何も表示してくれない。なんだこれ、駄目なんですか?

MC.clone()実験報告3 オーサリングMCの内部Shape.graphicsは他にも特殊な挙動をする。例えばこのgraphicsにさらに何かを書き足そうとlineTo等の処理を入れると、元々あったグラフィックは勝手にclear()されてしまう。

MC.clone()実験報告4 ByteArrayによるオブジェクトコピーも考えられるが、AMF 直列化形式は現在MovieClipを未対応としている。実際にやってみるとエラーになる。対応する予定がありますよみたいなこと書いてあるのに、ずーっと対応されない。

MC.clone()実験報告5 結局今のところまともにコピーできる方法は、素材swfをByteArrayで取っておいて、loadしなおしてやるという方法。でも小さいMCを1個ずつこの方法で取り出すのもパフォーマンスや記述的に現実的ではないと思う。

MC.clone()実験報告6 っていうかswfならByteArrayを介してコピーできるのに、MCが駄目ってどういうことよ。MCをswfファイルとしてByteArrayに突っ込む方法を探してみたけど、見つからずに断念。

MC.clone()実験報告まとめ 今のところ、スマートな方法は無い。可能なのはswfをByteArrayから持ってくること、もしくはライブラリでリンケージしておくこと。どっちも面倒。1個だけ配置したボタンをduplicateして可変数配置したい。誰かいいアイデアないですかねぇ。

ご指摘通りです。

rect_mcがx:100, y:100に配置されています。

import com.senocular.display.duplicateDisplayObject;
 
import flash.display.MovieClip;
import flash.events.MouseEvent;
 
rect_mc.addEventListener(MouseEvent.CLICK, onClick);
 
function onClick (e:MouseEvent):void {
	trace(e);
}
 
rect_mc.graphics.clear();
rect_mc.graphics.beginFill(0xffff00, .5);
rect_mc.graphics.drawCircle(0, 0, 15);
rect_mc.graphics.endFill();
 
var copied:MovieClip = duplicateDisplayObject(rect_mc, true);
copied.x = 200;
addChild(copied);

複製されたMCは完全にはコピーされていない状態で表示されます。
う〜〜む。

2011.01.16
03:50
author: taikiken
4件のコメント

ActionScript 3.0, AS2ライクにDuplicateMovieclipをするために

以前のエントリー。
DisplayObject['constructor'] as Class を使えば ActionScript 2 の DuplicateMovieclip みたいなことができるかもって記事です。

で、実際に DuplicateMovieclip みたいにするためにはプロパティを全コピー出来ないと duplicate にはなりません。
あの膨大なプロパティをどうやったらコピーできるかと悶々してたら Google 先生が教えてくれました。

kirupa.com にそのものズバリがありました。
http://www.kirupa.com/forum/showthread.php?p=1939827

package com.senocular.display {
 
	import flash.display.DisplayObject;
	import flash.geom.Rectangle;
 
	/**
	 * duplicateDisplayObject
	 * creates a duplicate of the DisplayObject passed.
	 * similar to duplicateMovieClip in AVM1
	 * @param target the display object to duplicate
	 * @param autoAdd if true, adds the duplicate to the display list
	 * in which target was located
	 * @return a duplicate instance of target
	 */
	public function duplicateDisplayObject(target:DisplayObject, autoAdd:Boolean = false):DisplayObject {
		// create duplicate
		var targetClass:Class = Object(target).constructor;
		var duplicate:DisplayObject = new targetClass();
 
		// duplicate properties
		duplicate.transform = target.transform;
		duplicate.filters = target.filters;
		duplicate.cacheAsBitmap = target.cacheAsBitmap;
		duplicate.opaqueBackground = target.opaqueBackground;
		if (target.scale9Grid) {
			var rect:Rectangle = target.scale9Grid;
			// WAS Flash 9 bug where returned scale9Grid is 20x larger than assigned
			// rect.x /= 20, rect.y /= 20, rect.width /= 20, rect.height /= 20;
			duplicate.scale9Grid = rect;
		}
 
		// add to target parent's display list
		// if autoAdd was provided as true
		if (autoAdd && target.parent) {
			target.parent.addChild(duplicate);
		}
		return duplicate;
	}
}

x, y… などのプロパティをコピーするのに DisplayObject.transform をつかうのかぁ。
transform でコピーできないプロパティは個別に設定するのか。

使い方は

import com.senocular.display.duplicateDisplayObject;
 
// create duplicate and assign to newInstance variable
// using true for autoAdd automatically adds the newInstance
// into the display list where myOldSprite is located
var newInstance:Sprite = duplicateDisplayObject(myOldSprite, true);
newInstance.x += 100; // shift to see duplicate

ご存知、senocularさんの投稿です。

ためになるなぁ。

update 2011-01-17
muta244さんのコメントのByteArrayを使う方法はreadObjectをキャストすると戻り値がnullになり残念ながら使えないようです。
キャストしないと戻り値型はObjectになりプロパティ値にアクセスすることは可能です。
ただインスタンスそのものを再利用したいのでこの方法だと役不足でした。

import flash.utils.ByteArray;
import flash.display.Sprite;
 
var original:Sprite = new Sprite();
original.graphics.clear();
original.graphics.beginFill(0xffff00);
original.graphics.drawRect(0, 0, 30, 30);
original.graphics.endFill();
addChild(original);
original.x = 100;
 
var data:ByteArray = new ByteArray();
data.writeObject(original);
data.position = 0;
 
var copy:Object = data.readObject();
trace(copy.x); // 100
 
data.position = 0;
var copy2:Sprite = data.readObject();
trace(copy2.x); // TypeError: Error #1034: 強制型変換に失敗しました。Object@3ce16d79 を flash.display.Sprite に変換できません。
 
data.position = 0;
var copy3:Sprite = data.readObject() as Sprite;
trace(copy3.x); // TypeError: Error #1009: null のオブジェクト参照のプロパティまたはメソッドにアクセスすることはできません。

タイムラインに配置したMCや生成したSpriteをByteArrayを使って再利用はどうも無理っぽい。

2011.01.12
16:11
author: taikiken
0件のコメント

モバイルAIR最適化Tips by theFlashBlog – Lee Brimelow

theFlashBlogの記事
Optimizing Drag and Drop for Mobile Applications

モバイルAIRを作成する時の最適化について書かれています。
記事自体はすでに知っていることでした。
GPUアクセレーションを使えとか、ドラッグさせる時にはMOUSE_MOVEではなくENTER_FRAMEを使ってマウス位置にインスタンス座標を設定しろとか。。。

Use GPU Acceleration, のサンプルコード cacheAsBitmapMatrix = new Matrix() が不勉強で分からなかったので調べてみた。

Adobe® Flex® 4.1 リファレンスガイド
DisplayObject.cacheAsBitmapMatrix
言語バージョン: ActionScript 3.0
ランタイムバージョン: AIR 2.0

AIR専用なのか。

null 以外の場合、この Matrix オブジェクトは cacheAsBitmap を true に設定したときの表示オブジェクトのレンダリング方法を定義します。アプリケーションでは、このマトリックスを、ビットマップバージョンの表示オブジェクトをレンダリングするときに適用された変換マトリックスとして使用します。

AIR プロファイルのサポート:この機能はモバイルデバイスでサポートされますが、デスクトップオペレーティングシステムではサポートされません。複数のプロファイル間での API サポートについて詳しくは、AIR プロファイルのサポートを参照してください。

cacheAsBitmapMatrix セットを使用して、アプリケーションは移動、回転、拡大や縮小などの様々な 2D 変形にわたって、キャッシュされたビットマップイメージを保持します。アプリケーションでハードウェアアクセラレーションが使用されている場合、オブジェクトはテクスチャとしてビデオメモリに格納されます。これにより、GPU が、サポートされている変形をオブジェクトに適用できます。GPU では、これらの変換を CPU よりも高速に実行できます。

ハードウェアアクセラレーションを使用するには、Flash Professional CS5 の iPhone 設定ダイアログボックスの「一般」タブで「レンダリング」を「GPU」に設定します。または、アプリケーション記述ファイルで renderMode プロパティを gpu に設定します。

例えば、次のコードは表示オブジェクトの未変換のビットマップ表現を GPU に送信します。

matrix:Matrix = new Matrix(); // creates an identity matrix 
mySprite.cacheAsBitmapMatrix = matrix; 
mySprite.cacheAsBitmap = true;

注意があった。

注意:cacheAsBitmapMatrix プロパティは、2D 変形に適しています。3D 変形を適用する必要がある場合は、オブジェクトの 3D プロパティを設定し、その transform.matrix3D プロパティを操作します。アプリケーションが GPU モードを使用してパッケージされている場合、この操作を行うと、GPU によって 3D 変形をオブジェクトに適用できます。cacheAsBitmapMatrix は、3D オブジェクトでは無視されます。

なるほど2D専用ってわけなのね。

2011.01.12
15:04
author: taikiken
0件のコメント

HTML 5, ヘルパーJavaScript Modenizrをインストールしました

HTML 5 サイト制作を助けてくれるヘルパーJavaScript ライブラリModenizr を導入しました。
http://www.modernizr.com/

HTML 5 サイトを作るには、このCSS プロパティに対応してるかとかこのタグに対応してるかとかブラウザ判別しなくてはいけないことがちょくちょく発生します。
Modenizr はブラウザの機能を判別しその結果を html タグにクラスとして書出してくれます。
ただこれだけの単純・簡潔な機能を実装しているJavaScriptライブラリです。

以下のような感じでClassを設定してくれます。

<html dir="ltr" lang="ja" class=" js flexbox canvas canvastext no-webgl no-touch geolocation postmessage websqldatabase no-indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms csstransforms3d csstransitions fontface video audio localstorage sessionstorage webworkers applicationcache svg no-inlinesvg smil svgclippaths">

後は対応しているブラウザとそうでないブラウザ向けにCSSを設定するだけです。
ハックを使う必要がありません。

複数背景対応かどうかでCSSを切り分ける例。

.multiplebgs div p {
  /* properties for browsers that
     support multiple backgrounds */
}
.no-multiplebgs div p {
  /* optional fallback properties
     for browsers that don't */
}

ドキュメントによればあらかじめ

<html class='no-js'>

としておくとJavaScript未対応の場合にも対応できるそうです。
Modenizrが働けば設定しておいた'no-js''js'に置換えられます。

詳細はDocumentをご覧になって下さい。
Modenizr Document

ソースはgithubにもホストされています。
https://github.com/Modernizr/Modernizr