映像制作 eラーニングのことならビズバレー
文字サイズの変更 標準 
大きい
ホーム > スタッフブログ
スタッフブログ
k.takahashi
k.taguchi
j.hashimoto
j.katou
y.hotate
m.kawai
s_inomata
m_muraoka
ビズバレーは、東京都 千代田区で活動する、映像制作、DVD、eラーニングを扱う会社です。

前回はスマホで動作する付属サンプルのデモを試しましたが、今回は、Webブラウザで動作するサンプルデモを試してみようと思います。

今回も一発では動作しないため、修正を行います。主な修正事項は、下記になります。
スマホ用のデモと修正内容が重複する部分もあるので、それほど難しくはないでしょう。

・Starling.swcへのパスのズレを修正する (スマホ用と同じ)
・source pathのパス変数を設定する (スマホ用と同じ)
・HTMLを修正する

まずプロジェクトフォルダーとして「demo_web」を読み込みます。

20140627-1

そうすると、このように読み込まれます。パス変数は設定されておらず、そしてライブラリのパスもズレているので設定が必要です。

20140627-2

まず、Starling.swcのライブラリパスを修正します。

20140627-3

修正後
20140627-4

次に、ActionScriptコンパイラーの画面にて、「特定のバージョンを使用」にチェックを入れます。これを指定しないと(なぜか)swfが書き出されませんでした。そして、HTMLラッパーの設定箇所で、「HTMLラッパーファイルの生成」にチェックをいれます。これはブラウザでFlashを読み込むときの土台となるHTMLファイルです。

20140627-5

次にパス変数の設定を行います。

20140628-6

スマホ用のデモと同じですね。

20140628-7

これで、とりあえず実行構成で、Webアプリケーションを選び「実行」するとSWF、HTMLファイルが書き出され、ブラウザが起動します。

20140628-8

そうすると、このようなエラーがでてきました。
「Context3D not available! Possible reasons:wrong wmode or missing device support.」
GPUを利用するときは、HTMLファイルにwmodeパラメーターを追加する必要があり、抜けているとこのようなエラーが発生します。

20140628-9

Demo_Web.htmlを開いて修正します。

20140628-10

params.wmode = "direct" を追加して、GPUでレンダリングできるように設定します。スマホ用のデモのときは、何も設定しませんでしたが、たまたま、すでに設定されていたため、気にする必要がなかったのです。(※ 記述仕方はちょっと異なりますが)

20140628-11

これですべて、設定できましたので、再度ブラウザで表示すると、このようにちゃんと表示されました。

20140628-12

実際にデモを自分でコンパイルして動かしてみることで、印象はだいぶ変わると思います。
次回は、UIフレームワークのfeathersを動かしてみようと思います。

(参考)
FlashBuilderでStarling Frameworkのスマホ用デモを試す
http://bizvalley.co.jp/blog/6732.html