［速報］HTML5/JavaScriptでWindows 8対応アプリを作る「Visual Studio」「Expression Blend」登場。BUILD 2011

マイクロソフトは9月13日（日本時間9月14日早朝）、開発者向けのイベント「BUILDカンファレンス」を開催、開発コード名「Windows 8」の詳細を初めて明らかにしました。

Windows 8で搭載される「Metroスタイル」と呼ばれるインターフェイスに対応したアプリケーションの構築には新しいAPIが用意され、C/C++、C#、VBなどに加えてHTML5/JavaScriptでも開発可能になります。

これに合わせ、開発ツールのVisual Studio、Expression BlendもHTML5/JavaScript対応となりました。

基調講演の模様を紹介しましょう。

（本記事は「Windows 7より軽くなったWindows 8、タッチUIなど詳細をマイクロソフトが初披露。BUILD 2011」の続きです）

Metroスタイル用の新しいAPI「WinRT」

Windows and Windows Live Divisionプレジデント、スティーブン・シノフスキー氏、再び登場。Windows 8アプリケーションの開発について。

これまでのWindowsアプリケーションは、C/C++でWin32 APIの開発や、C#やVBで.NETやSilverlightの開発、そしてHTML/JavaScriptのアプリケーションはInternet Explorer上で実行するという形になっていた。言語ごとにAPIが違い、サイロ化していた。

しかしWindows 8のMetroスタイルのアプリケーションでは、C/C++、C#、VB、HTML/CSS/JavaScriptのどれでも選んで開発することができる。（会場拍手）

APIを新しくWinRT（Windows Run Time）とした。WinRTは、モダンなアプリケーション構築を実現する。すべての言語はWinRTを呼び出す。

Visual StudioとExpression BlendでHTML5/JavaScript

Metroスタイルの開発に対応したVisual Studio 11 Developer Preview。あらかじめテンプレートが用意されている。ここではHTML5/JavaScriptでアプリケーションを開発してみよう。

HTML5のテンプレートが展開された。CSSにはスタイリングのルールも書き込まれている。

ここに3行、hタグでタイトル、canvasタグ、buttonタグを書き込み、CSSで背景の色を設定、JavaScriptでマウスイベントを取得してキャンバスを操作するコードを書き込む。

これを実行してみよう。JavaScriptだからコンパイルもせずそのまますぐ実行できる。すると、タッチやマウスで絵が描けるアプリができた。

これはまだMetroスタイルになっていないので、もう少し追加する。

JavaScrioptからAPIでファイルピッカーを呼ぶコードを1行追加する。すると、Metroスタイルのファイルピッカーがすぐに実現できる。

これで写真を選んで読み込み、そこに絵を上書きできる。「Charms」からTwitterへポストもできる。

もっとMetroスタイルっぽくしよう。画面レイアウトのために、Expression Blendを起動する。

Expression BlendではCSSを扱えるるようになった。CSSの新機能グリッドレイアウトを使い、Canvasをグリッドで中心に持ってくる（注：CSSのグリッドは現在策定中で、プロパティには-ms-gridプレフィックスが付いている模様）

これで実行すると、Canvasが画面中央に位置するようになった。

Windows 8に統合されたストアでアプリケーション販売も可能

Windows 8には「Store」が統合される。

ここからソフトウェアをクリックすると、自動的にダウンロードが始まり、インストールされてすぐにアプリケーションが実行できる。

もちろん無料、有料のもの、ゲームもあるし、いま作ったアプリケーションも登録できる。

従来のスタイルのアプリケーション「Quicken」も売っている。つまりストアで販売するために何かアプリケーションを書き換える必要はない。

まとめよう。Metroスタイルのアプリケーションのために、新しいAPIとツールを用意した。しかもMetroスタイルのアプリケーションは簡単に作れ、言語やツールもえらべる。

ストアが用意され、ビジネス機会も広がる。

基調講演の模様は「［速報］Windows 8のハードウェアサポート機能、Hyper-V搭載。Windows LiveもタッチUIに。BUILD 2011」に続きます。

Build 2011関連記事

• ［速報］Windows 7より軽くなったWindows 8、タッチUIなど詳細をマイクロソフトが初披露。BUILD 2011
• ［速報］HTML5/JavaScriptでWindows 8対応アプリを作る「Visual Studio」「Expression Blend」登場。BUILD 2011
• ［速報］Windows 8のハードウェアサポート機能、Hyper-V搭載。Windows LiveもタッチUIに。BUILD 2011
• マイクロソフト、Windows Server 8を披露。「Windows Azureから学んだ技術を投入」し、クラウドに最適化したOSに。BUILD 2011
• マイクロソフトとインテル、重なった基調講演で語られなかったこと