Sliverlight 環境を構築したまさき君。いよいよプログラムを始めます。
まさき君
「これでSilverlightのプログラムを始める事ができる・・・でもどうすればいい？」
まりさん
「HTMLの中にSilverlight プロジェクトを生成する関数を組み込むだけです。まずは、HTML文をご覧ください。」
<html>
<head>
<title>Silverlight デモ</title>
<script type="text/javascript" src="Silverlight.js"></script>
<script type="text/javascript" src="createSilverlight.js"></script>
</head>
<body>
Silverlight START<br>
<!-- Silverlight プロジェクトを組み込む -->
<div id="testHost"></div>
Silverlight END<br>
<script type="text/javascript">
// Silverlight プロジェクトを生成する。
var parentElement = document.getElementById("testHost");
createMySilverlightPlugin();
</script>
</body>
</html>まさき君
「Silverlight.js は、前回入手したファイルだね。createSilverlight.js というファイルはどこにあります？」
まりさん
「そこにSilverlight プロジェクトを生成する関数を記述します。後ほど説明しますね。」
まさき君
「オーケー。・・・div のタグのところに、Silverlight プロジェクトが組み込まれるということかな。」
まりさん
「そうです。そして、createMySilverlightPlugin 関数（名前は変更できます）でSilverlightプロジェクトを生成します。これもcreateSilverlight.js に記述します。」
まさき君
「なるほど。HTML内の記述の仕方はわかったよ。では、createSilverlight.js の記述の仕方を教えて。」
まりさん
「こちらです。Silverlight.js内のcreateObject関数にパラメータを設定します。いまの時点で説明が必要なところは太字にしています。」
function createMySilverlightPlugin()
{
Silverlight.createObject(
"test.xaml",
parentElement,
"test",
{
width:'300',
height:'300',
inplaceInstallPrompt:false,
background:'#D6D6D6',
isWindowless:'false',
framerate:'24',
version:'1.0'
},
{
onError:null,
onLoad:null
},
null);
}
まさき君
「test.xaml はXAMLファイルの参照先だね。」
まりさん
「そうです。XAMLの記述の仕方については、改めて説明しますね。」
まさき君
「"test"というのは・・・何？」 まりさん
「これはSilverlight プロジェクトのID番号です。IDに"Host"をつけたものをHTML文に埋め込むと、Silverlight プロジェクトが組み込まれるんです。」 まさき君
「あ、そうか。HTML文の"testHost"と連動しているんだ。」 まりさん
「その通りです。」 まさき君
「width、height はそれぞれ幅、高さに関するものだね。」 まりさん
「数値はピクセル(pixel)で指定します。」 まさき君
「backgroundは背景色の設定だね・・・ふむふむ。では、ブラウザで確認してみよう。」 
まりさん
「ちゃんとできているようです。このグレーのところがSilverlight プロジェクトの領域になります。」 まさき君
「ほほう・・・だんだんわかってきたぞ。」
ということで、無事にSilverlight プロジェクトを組み込めたまさき君でした。
| 
