👈🏾 👁‍🗨 🦆 JavaScriptを使用したActionScript2.0の復活 👩🏽‍💼 👨🏾‍🚀 🤸🏿

すでに2017年3月に、少なくともGoogle Chromeでは、明示的なユーザーアクションなしでAdobe Flash Playerがデフォルトで起動しなくなりました。AdobeFlash Playerコンテンツを自動的に起動するには、次の手順に従う必要があります。 HTML5 Canvasへのアクセスを提供するJavaStriptライブラリの使用に向けて。

Flashの代わりにHTML5 Canvasを開発する便利な方法の1つは、次のタイプのプロジェクトをサポートするAdobe Animate CC 2017です。

リストは、ActionScript2.0のサポートが開発環境の現在のバージョンから完全に除外されていることを示しています。また、既存のAS2 / 3コードをhtml5 Canvasに転送する方法もありません。

Adobe Animate CC 2017でできることは、FlashプロジェクトとそのすべてのコンポーネントのグラフィックコンテンツをHTML5プロジェクトに変換することだけです。

これを行うには、Flashプロジェクトを開き、[ コマンド ]メニューから[ 他のドキュメント形式に変換]を選択します。その後、変換するプロジェクトのタイプを選択するよう求めるダイアログボックスが開きます。デフォルトでは、HTML5 Canvasが使用されており、新しいプロジェクトで使用します。

Flashプロジェクトを変換した後、プロジェクト内のすべてのASコードにコメントが付けられます。つまり、すべてをJavaScriptで再度書き換える必要があります。開発環境と対話するためのAPIインターフェースとして、 CreateJSライブラリーが使用されます。

このライブラリは多くの点で機能しますが、残念ながらすべてではありませんが、多くの標準ASメソッドおよびクラスに馴染みのあるものと互換性があります。たとえば、 MovieClipオブジェクトには、フレーム間などを切り替えるためのgotoAndStop（）メソッドが含まれています。

ActionScript2.0コードが大量にあるため、CreateJSライブラリを確認した後、AS2.0と互換性のある追加メソッドを使用してライブラリ機能の拡張機能を開発することにしました。

その結果、グラフィックコンポーネントFlash CreateJSToAS2のコード転送をより簡単にするためのプロジェクトが作成されました。このライブラリには、MovieClipクラスの基本的な拡張メソッドがいくつか含まれています。また、eval関数が実装（オーバーロード）されているため、次の呼び出しが可能になります。

ActionScript 2.0で行われる方法と同様に、文字列を使用してムービーの特定の要素に追加します。

これはまだActionScript 2.0の機能のごく一部ですが、既にコードを変更せずに多くを転送することができます。

CreateJSToAS2ライブラリーは、ファイルLib \ AS2_Library.jsを使用して、htmlファイルのヘッダーで接続されます。

<script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script> <script src="Lib\AS2_Library.js"></script>

また、init関数の本体では、ライブラリを初期化するInitAS2（）関数を呼び出す必要があります。コードを記述した後、もちろん、イベントを呼び出す別のオプションも可能ですが、これは最も簡単です。

  var canvas, stage, exportRoot; function init() { canvas = document.getElementById("canvas"); exportRoot = new lib.AS2ToAS3_Canvas(); stage = new createjs.Stage(canvas); stage.addChild(exportRoot); stage.update(); createjs.Ticker.setFPS(lib.properties.fps); createjs.Ticker.addEventListener("tick", stage); InitAS2(); Init(); } function Init(){ var _root = exportRoot; // Write your code here }

たとえば、MovieClipを作成して線を描画する次の例は、html 5 Canvasと互換性があります。

  _root.createEmptyMovieClip("line_mc", 1); _root.line_mc.lineStyle(10, 0xFF0000, 100); _root.line_mc.moveTo(0, 0); _root.line_mc.lineTo(150, 0); _root.line_mc.lineTo(150, 50); _root.line_mc.lineTo(0, 50); _root.line_mc.lineTo(0, 0); _root.line_mc._x=150; _root.line_mc._y=150;

テキスト「Hello Word」で新しいMyTextテキストを作成します

  eval('line_mc').createTextField("MyText", undefined, 10, 10); eval('line_mc.MyText').text = 'Hello Word';

Adobe Animateライブラリから新しいコンポーネントを接続することでさえ、AS2でそれを行う方法と似ています。たとえば、コンポーネント「LibMovie」がある場合、Movie2のように接続します。

  _root.attachMovie("LibMovie","Movie2",undefined).x = 250; _root.Movie2.y = 100; eval('Movie2')._width = 40; eval('Movie2')._height = 40;

もちろん、すでに行われているのと同じ方法でこのライブラリにさらに拡張して実装できるものがまだたくさんありますが、もちろんこのためには、コミュニティがオープンソースプロジェクトに関心を持っている必要があります。ご清聴ありがとうございました。

JavaScriptを使用したActionScript2.0の復活

More articles: