とりあえずのゴールは、BubbleMarkをManaged JSで実現すること。
といってもいきなりサンプルコードをダウンロードさせるのも面白くないから、Step By Stepで、かつなるべく説明を多めにしようと思う。
1. SDKの導入
- Silverlight 2.0 Beta 1 プラグインのインストール
SDKの前に、Silverlight 2.0 Beta 1をインストールしておく。
Install Microsoft Silverlight 2 Beta 1(英語, Windows/Mac) - Dynamic Languages SDKのダウンロード
うまくインストールできたら、次はSDKだ。
WindowsユーザーならDownload Centerで入手できるSilverlight 2 Beta 1 SDKでもいいのだが、これだとMacの人はどうしようもない。ここでは、動的言語を使って開発する人向けのDynamic Languages SDKを使うことにする。これならWindowsでもMacでも大丈夫だ。
CodePlex: Silverlight Dynamic Languages SDK(英語, 要 .NET Framework 2.0以降)
注意: for Mac User
Dynamic Languages SDKに含まれているchiron(ケイロン: ギリシャ神話から)というツールは.NETアプリケーションである。MicrosoftはMac OS向けの.NET Frameworkをリリースしていないが、chironをMacで動かす方法はある。Monoだ。MacユーザーはMonoもインストールしておこう。
Download Mono(英語, Linux/Windows/Mac/Solaris)
2. プロジェクトの作成
プロジェクト作成といっても特別なファイルを作るわけではない。
- パスを通す
コマンドプロンプトまたはターミナルからchiron.exeを実行できるようにしておく。Windowsであれば「システムのプロパティ」→「詳細設定」→「環境変数」でPATH変数の値を書き換えておけばよい。 - プロジェクトフォルダの作成
どこに作っても良い。そのフォルダを基点に作業することになる。
作成したフォルダの中にサブフォルダを作る。この中に置いたファイルをchironを使ってパッケージングする。名前は何でもいい。ここでは仮に"app"という名前としておく。 - Silverlightをホストするhtmlファイルの作成
プロジェクトフォルダの直下に置いておくのなら名前は何でもいい。中身にはSilverlightを起動する<object>タグが必要になる。他にもエラー出力などのためにも以下のようなファイルを作っておくと良い。
<html>
<head>
<title>Silverlight Application</title>
</head>
<body>
<div id='errorLocation' style="font-size: small;color: Gray;"></div>
<div id="silverlightControlHost">
<object id="silverlightControl" data="data:application/x-silverlight,"
type="application/x-silverlight-2-b1" width="400px" height="300px">
<param name="source" value="app.xap"/>
<param name="background" value="white" />
<param name="initParams" value="debug=true, reportErrors=errorLocation" />
<param name="windowless" value="true" />
</object>
</div>
</body>
</html>
ここで注目してほしいのは<param name="source" value="app.xap"/>である。"app.xap"というのはchironによってパッケージングされたSilverlightアプリケーションである。ファイル名は(2)のサブフォルダ名に合わせておく。
3. Hello World その1
BubbleMarkに挑戦する前に、まずはHello Worldを済ませておこう。以下、作成するファイルはすべて"app"サブフォルダの中に置く。
- AppManifest.xaml 設定ファイルの作成 (省略)
本当はAppManifest.xamlという名前の設定ファイルを作らないといけないが、作っていなかった場合はchironがデフォルトの設定内容でxapファイルを作る。Hello Worldであればデフォルトで問題ないので省略する。 - app.js (またはapp.jsx)の作成
動的言語でSilverlightアプリケーションを作る場合のエントリポイントとなる。ファイル名は"app"にする(追記：変える時は起動パラメータで指定することができるそうだ。thanks っきさん)。拡張子は、Managed JSの場合は.jsまたは.jsx。IronPythonの場合は.py。IronRubyの場合は.rbにすること。
とりあえずapp.jsxという名前にする。内容は以下。
Import("System.Windows.Browser.HtmlPage");
HtmlPage.Window.Alert("Hello, World!"); - chironの実行＆Hello World実行
ここまでできたら、プロジェクトフォルダをカレントディレクトリにして、chiron /b
と実行する。するとchironが開発用Webサーバを立ち上げ、ブラウザが起動するはず(Silverlight2に対応してないブラウザが起動してしまった場合は、対応ブラウザで同じURLにアクセスすること)。
カレントディレクトリの一覧が表示されている。この状態で最初に作っておいたhtmlをクリックする。すると、chironがappサブフォルダの中身を動的にパッケージしてくれて、Silverlightアプリケーションが起動する。
無事アラートが表示されただろうか。
……よく見ると、これはブラウザのjavascriptエンジンがアラートを表示させているだけだ。もっとマシな方法はないのか。そのあたりは次回に。
0 件のコメント:
コメントを投稿