Adobe Flash Player 9といえば、ActionScript 3をサポートし、実行速度も最大10倍早くなっているのだとか。

まだオーサリング環境のFlash Professional 9などがリリースされていないのですが、リリースされる頃にはAdobe Flash Player 9の普及率もかなりのものになっていて、MacユーザーはすぐにAdobe Flash Player 9のリッチなコンテンツを体験できそうですね。

今現在でAdobe Flash Player 9を必要とするコンテンツとしては、Flex 2.0で作成されたRIAなどがあります。

今まではFlashのオーサリング環境が提供された後にFlashPlayerがリリースされるというのが定番で、最新環境でオーサリングしても実行環境がないから新機能も使えないし、古いバージョンで書き出すということがよく行われていたのですが、今回は逆に実行環境であるFlashPlayerが先にリリースされたため、Flash 9がリリースされる頃には実行環境であるFlash Player9も浸透していることでしょう。なのでFlash9やActionScript 3.0の新機能を使ったコンテンツをすぐにユーザーに見てもらえることができます。

FlashPlayer 9は従来FlashPlayer 8.5としてリリースされる予定だったものです。変更点はActionScriptを実行するための仮想マシンがAVM2(ActionScript Virtual Machine 2) として生まれ変わり、ActionScript 3.0を実行できるようになりました。

ActionScript 3.0はよりJavaライクな構文になり、ECMAScript 4に準拠したものとなっています。以下はActionScript3の例です（Via.akihiro kamijo: コンストラクタ （と Singleton））。

package pattern {

public class Singleton {
private static var instance:Singleton;

// コンストラクタ定義
// 引数が PrivateClass のインスタンス
public function Singleton(x:PrivateClass) {
}

// Singleton クラスのインスタンスを返す関数
public static function getInstance():Singleton {
if(Singleton.instance == null) {
Singleton.instance = new Singleton(new PrivateClass());
}
return Singleton.instance;
}
}
// プライベートクラスの定義
private class PrivateClass {
}
}

そのほか、FlashPlayer 9とActionScript 3についてはAdobeのFlash担当者に訊く – Flash Player 9とActionScript 3.0何が変わる?が詳しいです。

FlashPlayer 9はFlex2の実行環境としても重要。なぜならFlex2のスクリプト部分はActionScript 3だからです。

ちなみにRIA制作環境であるFlex2ですが、Flex1ではMXMLからswfにコンパイルするソフトウェアをサーバー上にインストールしなければならず、またそのソフトウェアがすごく高かったのですが、Flex2ではMXMLからswfへのコンパイルはFlex Builder 2上で行えます（Flex Builder 2は$499です）。またうろ覚えで申し訳ないのですが、無料のFlex 2 SDKを使えば、Flex Builder 2などのソフトウェアを購入することなくMXMLからswfへのコンパイルが行えたかと思います。つまり、MXML(実態はXML)が編集できるテキストエディタさえあればFlex2なアプリケションを作成できるということです。サーバー上に追加でソフトウェアをインストールする必要がなく、また無料でFlex2なアプリケーションを作ることができるので、Flex2をつかったRIAが増えることは容易に予想できます。

ということで、皆さんもぜひFlashPlayer 9をインストールし、Flex2なアプリケーションを作ってみてください。

具体的には、従来のようにHTMLページ内にobjectタグやembedタグでFlashを表示するように記述した場合、Flash上にマウスカーソルを持って行くと「このコントロールをアクティブ化して使用するにはクリックしてください」 と表示され、そのFlashがクリックを受け付けたり、マウスの位置情報を取得したりするためには（インタラクティブに振る舞うには）、一旦Flash上でクリックなどをしてFlashコントロールをアクティブ化しなくてはならなくなりました。

これの回避方法として、外部JavaScriptによって動的にobjectタグやembedタグを書き出す方法があるのですが、Adobeが公開している対策スクリプトがいまいちだったので、自作しました。

ダウンロードはこちら swfTagWriter107.zip。配布ライセンスはMITライセンスです。

使い方は、Flashを表示しているobjectタグが書いてある部分を、以下のよう書き換えるだけです。

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.writeHTML();
//]]>
</script>
<noscript>
<object data="fma.swf" width="720" height="200" type="application/x-shockwave-flash">
<param name="movie" value="fma.swf" />
</object>
</noscript>

JavaScriptが書き出すタグはXHTML1.0 Validになるようにしています。See also:FlashをXHTMLで表示させるには（embedタグを使わずに表示させるには）

詳しいリファレンスは以下の通り。

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.writeHTML();
//]]>
</script>

<object type="application/x-shockwave-flash" data="fma.swf" width="720" height="200" id="test01" >
<param name="movie" value="fma-1.swf" />
<param name="loop" value="false" />
<param name="quality" value="high" />
</object>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.setRequiredVersion(7,0,20);
swf.setAltContent('最新のFlashPlayerをインストールしてください');
swf.writeHTML();
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.setLoop(true);
swf.writeHTML();
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.setQuality("low");
swf.writeHTML();
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.setAltContent('<img src="a.gif" width="720" height="200" alt="alternative content" />');
swf.writeHTML();
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.addFlashVars('key1', 'val1');
swf.writeHTML();
//]]>
</script>

<object type="application/x-shockwave-flash" data="fma.swf" width="720" height="200" id="test01" >
<param name="movie" value="fma-1.swf" />
<param name="loop" value="false" />
<param name="quality" value="high" />
<param name="flashvars" value="key1=val1" />
</object>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.addAttribute('accesskey', 'a');
swf.writeHTML();
//]]>
</script>

<object type="application/x-shockwave-flash" data="fma.swf" width="720" height="200" id="test01" accesskey="a" >
<param name="movie" value="fma-1.swf" />
<param name="loop" value="false" />
<param name="quality" value="high" />
</object>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.addParam('param1', 'value1');
swf.writeHTML();
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.doesShowPlayerInstallMsg(false);
swf.writeHTML();
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.doesShowPlayerInstallMsg(true);
swf.setPlayerInstallMsg('<p><a href="http://tinyurl.com/knoal">Flash Playerをインストールしてください</a></p>');
swf.writeHTML();
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.writeHTML();
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.setFlashDetectorSwfUrl('FlashDetector.swf');
swf.writeHTML();
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
alert(jp.catalase.FlashPlayerDetector.isFlashPlayerAvailable());
//インストールされている場合true、されていない場合false
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var ver = jp.catalase.FlashPlayerDetector.getFlashPlayerVersion();
alert(ver);
//「7,0,20,0」など
//]]>
</script>

更にブラッシュアップしていこうと思っているので、ご意見などはコメント欄まで。

追記 2006/4/26

同様のことをするスクリプトにSWFObjectがあるのですが、以前はFlashObjectと呼ばれていました。ただ、Flashという商標をAdobe法務部が使うことを許さなかったため、SWFObjectに改名したようです。当方も法務部に怒られるのはいやなのでSwfTagWriterに変更しました。

追記 2006/5/1

swfTagWriter106.zipにいくつかバグを見つけたのでswfTagWriter107.zipとしてリリースしました。

アメリカではFlash Professional 8とFlash Basic 8がすでに発売されていますが（トライアル版も公開されています）、それに合わせてFlash Playerの最新バージョン（8.0r22）もリリースされています。

まだまだFlash Player 8が必要とされるコンテンツは少ないですが、今回のメジャーリリースではモーションブラーフィルターやビデオのアルファチャンネルサポートなど表現面での向上が図られていて、そのうちFlash Player 8が必要とされるコンテンツのリリースラッシュが起こるのではないかと思います。

おそらくスクリプトの実行速度やグラフィックの描画速度などもFlash Player 7より向上していることでしょうから、入れておいて損のあるものではありません。ぜひダウンロードしてインストールしましょう。

]]> http://www.onflow.jp/cyano/archives/88/feed 0 http://www.onflow.jp/cyano/archives/87?utm_source=rss&utm_medium=rss&utm_campaign=flash%25e3%2582%2592xhtml%25e3%2581%25a7%25e8%25a1%25a8%25e7%25a4%25ba%25e3%2581%2595%25e3%2581%259b%25e3%2582%258b%25e3%2581%25ab%25e3%2581%25af%25ef%25bc%2588embed%25e3%2582%25bf%25e3%2582%25b0%25e3%2582%2592%25e4%25bd%25bf%25e3%2582%258f%25e3%2581%259a%25e3%2581%25ab%25e8%25a1%25a8%25e7%25a4%25ba%25e3%2581%2595 http://www.onflow.jp/cyano/archives/87#comments Sat, 10 Sep 2005 09:49:20 +0000 ksakai http://www.onflow.jp/kleio/2005/09/flash%e3%82%92xhtml%e3%81%a7%e8%a1%a8%e7%a4%ba%e3%81%95%e3%81%9b%e3%82%8b%e3%81%ab%e3%81%af%ef%bc%88embed%e3%82%bf%e3%82%b0%e3%82%92%e4%bd%bf%e3%82%8f%e3%81%9a%e3%81%ab%e8%a1%a8%e7%a4%ba%e3%81%95/ Continue reading →]]>

最近はstrict XHTMLを使ってWebページを製作することが多くなったのですが、そういった場合Flashをどうやって表示させるかは悩みどころ。というのは、embedタグはXHTMLには定義されていないからです。embedタグを使わないとFirefoxやNetscape系でFlashを表示させることができないと思われがちですが、そうでもないようです。

SG::Acme : Flashをstrict XHTMLで。では、XHTMLで定義されているobjectタグだけを使ってFlashを表示させる方法を紹介しています。objectタグにどの属性をつけてどの属性を取り除くのかがポイントのようですね。

この件に関する詳しい議論はリンク先を読んでいただくとして、どのブラウザでもobjectタグのみで表示するのに最低限必要なコードは以下の通り。

<object data="fma.swf" width="720" height="200" type="application/x-shockwave-flash">
<param name="movie" value="fma.swf" />
</object>

codebase属性などを取り除く必要があるようなので、Win IEでのFlash Playerの自動インストールや自動バージョンアップなどができなくなってしまいますが、Flash Playerのインストール率は90%を超えていると思ったので（Windows XPにはバンドルされてますよね）、なくても構わないような気もします。どうしても必要ならJavaScriptでブラウザ別のobjectタグを動的に書き出せば済みますからね。追記2006年12月30日:自動バージョンアップが全くできないわけではなくExpress Installという方法を使えば自動バージョンアップが可能です。

JavaScriptでこのようなXHTML 1.0 ValidなFlashを表示するためのライブラリを公開しました。上記のIEの自動インストールができない問題などにも対処してます。

気になるのは、レガシーブラウザ（IE4とかNetscape4とか）でどうなるかというところ。とりあえず上記の方法では、IE4では表示されましたが、Netscape4では表示されませんでした。ただ、これらのブラウザではCSSをうまく解釈してくれないので、CSSを適用させないようにすることが多いのですが、Flashに関しても同じような考え方で代替のJPEGみたいなものを表示させると言うことにしておけば良いのかもしれません。

Flashの上で、音素材を並べてシーケンスを作り再生するようなアプリケーションは今までにもありましたが、BEATERATORは力のいれ具合が違います。

他のシーケンサーと同様に、音素材をトラックに並べて再生すると言うところは変わらないのですが、他にもBPMが変更できたり、キーボードで打ち込んでいくことができたり、音素材にエコーなどのエフェクトをかけることができます。また、自分で録音したハイハットの音などをアップロードできたり、作曲したデータをダウンロードすることもできるようです。

Flash単体でここまでできるのかと思っていたら、どうやらサーバーサイドでBPMを変更したりエフェクトをかけたりしたサウンドファイルを動的に生成している模様。でも、ここまでするのは正直すごいです。さながらオンライン版GarageBandです。

]]> http://www.onflow.jp/cyano/archives/72/feed 0 http://www.onflow.jp/cyano/archives/66?utm_source=rss&utm_medium=rss&utm_campaign=%25e5%2589%258d%25e3%2581%25ae%25e3%2583%2590%25e3%2583%25bc%25e3%2582%25b8%25e3%2583%25a7%25e3%2583%25b3%25e3%2581%25aeflashplayer%25e3%2582%2592%25e5%2585%25a5%25e6%2589%258b%25e3%2581%2599%25e3%2582%258b%25e6%2596%25b9%25e6%25b3%2595 http://www.onflow.jp/cyano/archives/66#comments Mon, 07 Mar 2005 16:44:07 +0000 ksakai http://www.onflow.jp/kleio/2005/03/%e5%89%8d%e3%81%ae%e3%83%90%e3%83%bc%e3%82%b8%e3%83%a7%e3%83%b3%e3%81%aeflashplayer%e3%82%92%e5%85%a5%e6%89%8b%e3%81%99%e3%82%8b%e6%96%b9%e6%b3%95/ Continue reading →]]>

MacromediaのWebからは、基本的には最新のバージョンのFlashPlayerしか配布していません。しかしながら、前のバージョンで正しく動くか検証するため用に歴代のFlashPlayerのアーカイブが用意されています。

米MacromediaのFlash TechNote Archived Macromedia Flash Player minor versions available for testingにアクセスするとバージョン5r30以降のFlashPlayerを入手することが出来ます。

]]> http://www.onflow.jp/cyano/archives/66/feed 0 http://www.onflow.jp/cyano/archives/46?utm_source=rss&utm_medium=rss&utm_campaign=tips%25e8%2589%25b2%25e8%25a6%258b%25e6%259c%25ac%25e3%2582%2592gif%25e3%2583%2595%25e3%2582%25a1%25e3%2582%25a4%25e3%2583%25ab%25e3%2581%258b%25e3%2582%2589%25e5%258f%2596%25e3%2582%258a%25e8%25be%25bc%25e3%2582%2580 http://www.onflow.jp/cyano/archives/46#comments Sun, 21 Mar 2004 14:40:38 +0000 ksakai http://www.onflow.jp/kleio/2004/03/tips%e8%89%b2%e8%a6%8b%e6%9c%ac%e3%82%92gif%e3%83%95%e3%82%a1%e3%82%a4%e3%83%ab%e3%81%8b%e3%82%89%e5%8f%96%e3%82%8a%e8%be%bc%e3%82%80/ Continue reading →]]> FlashやFireworksに色見本パレットと言うのがありますが、そこに色を追加する方法としてgifファイルを読み込んでgifファイルのなかで使われている色を追加するという方法があります。このtipsの利用方法として、たとえば風景写真やColor schemeのようなページをgif形式で書き出して色見本に読み込み、そこに使われている色調を真似することが出来ます。

方法は簡単で、まず色を取り込みたいgifファイルを用意します。そして、FlashやFireworksを起動し、色見本パレットを表示します。次に色見本パレットのメニューから「カラーの置換(Flash)」「色見本の置き換え(Fireworks)」を選びます。（キャプチャーの色がおかしくなっているのはうちのMacがおかしいせいです…）

そうするとダイアログが出てくるので先ほど保存したgifファイルを選びます。下のgifファイルはColor schemeをキャプチャーしたものです。

そうするとgifファイルで使われてる色が色見本に読み込まれます。

Flashだけになってしまいますが、色見本をPhotoshopのスウォッチに持って行くことができます。方法は色見本パレットのメニューから「カラーの保存」を選び、種類に「カラーテーブル」を選んで保存します。Photoshopのスウォッチパネルのメニューから「スウォッチの読み込み」を選び先ほど保存したファイルを選ぶとスウォッチに読み込まれます。

余談ですが、Color schemeはなかなかよくできたサイトでJavaScriptで作られてます。

このtipsは最近友達に教えてもらって思わず５へぇをあげてしまいました。私は全然知らなかったんですが、もしかして有名なtipsのかな。

Social Circle

メーリングリストで誰がどれぐらい活発に参加していて、誰が中心となっているのかを視覚化するアプリケーション。円の大きさが発言数で、中心にいるほどその人が話題の中心と言うことなんでしょう。ColdFusion + Flash MXで作られているそうです。

musicplasma

音楽のアーティスト同士の繋がりを視覚化するアプリケーション。円と円の近さは音楽のスタイルの近さと活動年代の近さを表していて、円の大きさは有名さを表しているようです。アーティストを選ぶと左側にそのアーティストのCDのリストが出てきて、それがAmazonへのリンクになってます。ついつい買いたくなります。