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をパッケージするための手順
その1 Flashファイルを埋め込む
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アプリケーションをまだ持っていない場合、今作成するか、以前に作ったものを編集するかします。ここでは、上下左右を1ピクセルずつ小さくして作成し、不要なアンチエイリアスが含まれていないことを確認しています。ここでは、画面サイズの値は238x318になってます。
TIP: Web Run-Timeをサポートする新端末はFlash Lite 3もサポートするので、その機能も使用することができます。
異なる画面サイズを考慮する
端末には様々なスクリーンサイズのものがあるので、スクリーンサイズを検知し、変数もしくは複数の.swfファイルを使って可能なスペースによりうまく.swfファイルを配置し、その情報を使うJavaScriptファイルを、Web Runtime Widget上にいくつか置いて使うことができます。あるいは、記事 Dynamic_Layout_control_for_Flash_Lite で説明したように、.swfファイル中でその全てをハンドリングすることもできます。
その2 .swfファイルの直接実行
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ファイルをパッケージ化しアイコンを追加する簡単な方法です。
注意点 Thank you画面を出して終了せず、直接終了させたい場合、Flashファイルを修正し、"Exit"コマンドを使用不可にする必要があります。"Exit"コマンドは、デフォルトでは右ソフトキーになります。
fscommand2("FullScreen", true); //To hide the softkey labels
fscommand2("SetSoftKeys", "right dummy", "left dummy"); //Replace the dummy values, if you like to use Flash Player's softkey labels instead of creating your own.
この方法を使う場合、アプリケーションを終了する唯一の方法が赤受話器ボタンを押すことということを、ユーザーに知らせるのも良い方法です。この方法では、真っ白な画面が出ません。Web Runtimeエンジン上でFlash Liteプレイヤーが開始されると、全てのパッケージが消去します。
その3 meta-refreshタグを使った、最後のThank youページを表示
3番目の方法は、メインHTMLファイルの<head>セクション内に、meta-refreshタグを使用することです。これは依然として、真っ白なページを取得することになりますが、ここでコンテンツを編集することができます。ユーザーをホームページに導き、多少情報を追加したページを使うことができますし、あるいは、簡単に"cheers"とだけ書くこともできます。
以下に示すのは、その一例です。URLの前の"0"は、タイムアウトが発生しないことを意味します。一部端末では、これにより安定した運用ができます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>SWF Launcher</title>
<META http-equiv="REFRESH" content="0; url=MyFlash.swf">
<script type='text/JavaScript'>
function killWRT(){
var WRT = window.open("", "_top");
WRT.close();
}
</script>
</head>
<body>
<div align="center">
<br><br>
You can find more information at <a href="http://www.forum.nokia.com">Forum Nokia</a>.
<br>
<input type="button" value="Close this window" onclick="killWRT()" />
<br><br>
<b>Thank you for choosing our Flash Lite application.
<br><br>
- the team -</b>
</div>
</body>
</html>
注意点 また、"その2 .swfファイルの直接実行" で示した通り、ソフトキーを使用不可にし、"end call"ボタンで閉じるようにする方法も使えます。
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のサービスを利用できます。
Related Wiki Articles
No related wiki articles found
