This page was last modified 05:41, 19 June 2008.
Widget上でFlashコンテンツをパッケージ化する方法
From Forum Nokia Wiki
原文（英語）: How to package Flash content in a Widget
Flash Liteアプリケーションを配布する際の最大の問題の一つは、ユーザーがそのファイルを開くために、Flash Lite Playerを開くか、File managerもしくはGalleryを使用する必要があることです。Flash Liteコンテンツは、他のアプリケーションのようには扱えません。アイコンを取得することはできず、クイックアクセスメニューとしてアプリケーションショートカットに登録することもできません。
もう一つの欠点は、外部リソースを持っていた場合に別々に配布する必要があることで、これはユーザーにとってわずらわしいことです。s60プラットフォームでは、コンテンツを正しいフォルダに置くSISファイルを作成することにより解決できます。しかしこれも同様に、いくつかの問題があります。.sisファイルは署名を必要とし、ターゲットとなるフォルダは、S60プラットフォームのバージョンにより異なる可能性があるためです。
Contents |
.sisファイルを使用しない理由
Symbian C++でこれをする方法については既に、商用ソフトウェア、フリーウェア、ガイドがあります。しかし、これらは全て、Windows PCを起動でき、最低限のC++コーディング経験を持つことを必要とします。Flash開発者の多くはMacintosh PCを使用しており、その場合はS60 SDKやツール類をインストールできません。
Widgetによるパッケージング
Nokiaは、新たにWidgetプラットフォーム、すなわち、S60 Web Runtimeを発表しました。Web Runtimeで、Symbian C++を学ばなくても小型のアプリケーションを容易に開発することができます。必要となるのは、HTML, CSS, JavaScriptの知識だけです。コンテンツのパッケージはzip圧縮し、拡張子は.wgzとなります。このパッケージは署名を必要とせず、サポート端末により、インストール可能なアプリケーションと認識されます。パッケージの中身はプライベートフォルダにコピーされ、 Widget起動用のアイコンはApplicationsフォルダに置かれます。
Web RuntimeはS60ブラウザをベースとしているため、ブラウザがサポートする機能は、Web Runtimeでもサポートします。これはFlash Liteをサポートすることを意味し、Widget中にFlash Liteアプリケーションを入れてパッケージ化することができます。
Widgetをパッケージするための手順
Widgetサンプルを取得する
最初に、Web Runtimeについて少し目を通しておくことが望ましいです。最初の取り掛かりとして最も良いのは、Widget Webサイトです。以下に示す操作手順を参考ににすれば、パッケージを作成することができますが、Widgetのさらなる詳細について知りたい場合は、リンクを参照してください。
- Widgetサンプルをダウンロードする
- ダウンロードリンクは、Nokiaのモバイル共有コミュニティMoshへのものです。
- 自分のWidgetをアップロードする場合も、Moshを使用することを推奨します。
- ファイル名をFlashWidget.wgzに変更する
- .wgzファイルは、.zipファイルの名前を変更しただけのものです。
- コンテンツを抽出する
- フォルダ構成を維持することを忘れないようにします。
- 最も適切なターゲットフォルダを選択します。
アイコンを修正する
必要であれば、サンプルとして作ったアイコンを使うことができます。しかしそれはデモ目的に限られ、商用配布のFlashWidgetとして使用することはできません。アイコンはPNGフォーマットである必要があります。現在、SVGアイコンはサポートしていません。
info.plistファイルを修正する
info.plistファイルを開き、下記の緑色で示したキー値を編集します。DisplayNameはアプリケーション名として使い、AllowNetworkAccessはWidgetがインターネットにアクセスするかどうかを定義します。アプリケーションがネットワークを使用しない場合はその値を"false"に設定します。そうすると、Widgetを起動する時にアクセス許可について聞かれません。info.plistファイルの詳細情報については、Widget Webサイトで探すことができます。
<key>DisplayName</key> <string>MyFlashWidget</string> <key>Identifier</key> <string>textcom.forum.widgets.MyFlashWidget</string> <key>Version</key> <string>1.0</string> <key>MainHTML</key> <string>main.html</string> <key>AllowNetworkAccess</key> <true/>
HTMLとJavaScriptについて
テキストエディタまたはHTMLエディタでMain.htmlファイルを開くとき、基本的な3つの点について、修正する可能性があります。
CSSファイルの参照
外部CSSファイルを使用することを推奨します。例題の場合、Flashコンテンツをフルスクリーンで作成しているので、ファイルは小さなものです。そのCSSファイルが行うことはあまりありません。主に、背景を黒色にし、フルスクリーンFlash Liteコンテンツの位置が正しいことを確認しています。ここで詳細に入る必要はありません。WidgetにおけるHTMLやCSSの動作の詳細情報については、別途Widget Webサイトをご確認ください。
body { background: rgb(0,0,0); position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; margin: 0px; overflow: hidden; }
JavaScript
Widgetドキュメントによると、HTMLファイルとは別の.jsファイルを使用するのが好ましいコーディング方法です。この例題では、JavaScriptコードはナビゲーションモードを設定しているものだけです。さらに多くのWidget機能を使用する必要がある場合は、Widget Webサイトをご確認ください。
タブ・ナビゲーションモードを設定する
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT"> <!-- widget.setNavigationEnabled(false); //--> </SCRIPT>
上記のコードは、Main.htmlページに埋め込まれている簡単なJavaScriptコマンドです。 コード widget.setNavigationEnabled(false); は、Web Runtime環境で、タブベースのナビゲーションを使用することを意味します。代わりにポインタベースのナビゲーションを使用する場合、下記のように、値を´´true´´に変更します。
ポインタ・ナビゲーションモードを設定する
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT"> <!-- widget.setNavigationEnabled(true); //--> </SCRIPT>
例題のファイルはアニメーションを行うだけですが、タブ／ポインタ双方のナビゲーションモードでFlash Liteアプリケーションを起動するテストは済んでます。どう動かすのが良いのかについては、自由にテストしてください。
.swfファイルを埋め込む
下記に示すコードは、基本的にはAdobe Flash Professionalが生成したコードです。これを利用して、HTMLファイルに埋め込みを行うことができます。例題で提供したmain.htmlファイルを流用する場合、対応する.swfファイルの値の変更を確認する必要があります。主に、src, movieの各パラメータ、またallowScriptAccessディレクティブについてです。
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="238" height="318" id="MyFlash" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="movie" value="MyFlash.swf" /> <param name="loop" value="false" /> <param name="menu" value="false" /> <param name="quality" value="high" /> <param name="wmode" value="opaque" /> <param name="bgcolor" value="#ffffff" /> <embed src="MyFlash.swf" loop="false" menu="false" quality="high" wmode="opaque" bgcolor="#ffffff" width="238" height="318" name="Finish" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </object>
Flash Liteアプリケーション
テストするサンプルFlash Liteアプリケーションをまだ持っていない場合、今作成するか、以前に作ったものを編集するかします。ここでは、両サイドを2ピクセルずつ小さくして作成し、不要なアンチエイリアスが含まれていないことを確認しています。ここでは、画面サイズの値は238x318になってます。
TIP: Web Run-Timeをサポートする新端末はFlash Lite 3もサポートするので、その機能も使用することができます。
別の方法によるアプローチ
HTMLページ中に.swfファイルを埋め込む代わりに、mail.htmlファイルをその.swfファイルで置換えることができます。すなわち、必要なファイルは高々3つです。
- MainHTMLキーの値を.swfファイルの名前とした、Manifestファイル(Info.plist)
<key>MainHTML</key> <string>myFlash.swf</string>
- Info.plistファイル中で指定した.swfファイル
- icon.pngファイル(オプション)
この場合は、Flash Liteプレイヤーが.swfファイルを起動するようにはたらき、終了するときにファイルを保存するかどうか聞かれます。またその時には真っ白な「空Widget」(Empty Widget)画面になりますが、それを気にしなければ、これが.swfファイルをパッケージ化しアイコンを追加する簡単な方法です。
注意事項: 本アプローチは、一部開発者には問題があるものです。起動時に、カーソルを持つ真っ白な画面が出てくるためです。また、起動したSWFファイルにフォーカスが正しく配置されない場合もあります。現状での解決法の1つは、MainHTMLキーにHTMLページを設定するように戻し、そのHTMLページ中でmetaタグのrefreshを設定し、そのターゲットをSWFファイルにすることです。
Widgetパッケージを作成する
必要な修正を全て済ませ、また、必要なファイルを全て作成したら、Widgetをテストすることができます。上記で述べた通り、wgzファイルは、zipパッケージの名前を変更したものです。すなわち、ここでする必要があることは、zipファイルの名前を変更することです。.html .css .swf などのファイルがあるフォルダを、zipパッケージ中に含める必要があります。
Widgetをテストする
Widget SDK中のエミュレータは、Flash Liteをサポートしません。エミュレータで、Widgetパッケージの妥当性についてはテストできますが、そこでFlashコンテンツを見ることはできません。よって、S60 Web Runtimeをサポートする端末を持っていない場合、Remote Device Accessサービスを使用する必要があります。
インストール方法は常に同じです。Bluetooth、メモリカード、その他の手段を使い、.wgzパッケージを端末に転送し、実行します。そこで、端末またはエミュレータはインストール処理を開始します。インストールが終了すると、Applicationsフォルダ中で、インストールしたFlashWidgetのアイコンを確認することができます。
ヘルプが必要な場合
本ドキュメントに何らかの不備があった場合、commentタブ中でその問題を投稿してください。然るべき方法で処理します。 パッケージにおけるWidget部分の開発についてヘルプが必要な場合、Forum Nokia Discussion BoardのWeb Runtimeカテゴリに質問を投稿するとよいでしょう。Nokia端末に特化したFlash Liteに関するヘルプが必要な場合、Discussion BoardのFlash Liteカテゴリを利用でき、より一般的な問題の場合、Adobeのサービスを利用できます。
