F1大好きな、インチキ技術者の日記

F1大好きなインチキ技術者が情報を発信して、自分を変えようとしている日記です

Windows 8 と Visual Studio Express 2012 で Metroアプリを作ってみた(1)

Windows 8 Release Previewが公開された、時を同じくしてVisual Studio Express 2012も公開された。

 

Visual Studio と言えば個人的にはぶっちぎりのダントツですばらしい統合開発環境だ。

社会人になってからほぼずっと使っている。(Xcodeにはなかなかなれない・・・(T-T))

近年はプログラマーではなくなり、インチキSEになってしまったため使う機会が減ってしまったがやはり手放せない。ツール類をちょこっと作るときは本当に最高だと思う。

 

と言うわけで、早速開発をして見た。

デジタル朝日や日経新聞がアプリを出しているのをみて、「あーこれくらいならすぐ出来そう」となめてかかってみる。

 

両社のアプリが非常に似ているので、きっとテンプレートがあるに違いない。と思っていたがやっぱりあった。

f:id:hanamiche:20120611092824p:plain

僕は、C#がお気に入りなので、ひとまず選択してプロジェクトを作成してみる。

ビルドすると普通に動くひな形が出来ている。

 

おーーー

後はコンテンツをどうするかだけじゃん?って言うわけでどこでデータを取得して保存しているのかを確認する。ココは完全に手探りだ。ソースコードのコメントも英語のため無いも同然(T-T)

 

いろいろ探していると「ソリューションエクスプローラ」の

DataModel → SampleDataSource.cs の public SampleDataSource() に どうやらそれっぽい記述があるので恐る恐る改造。

 

 

var group1 = new SampleDataGroup("F1",
                    "F1",
                    "F1の最新情報",
                    "Assets/DarkGray.png",
                    "Group Description: なんだ?");
            group1.Items.Add(new SampleDataItem("Group-1-Item-1",
                    "メルセデスミハエル・シューマッハの残留を希望",
                    "メルセデスAMGのチーム代表ロス・ブラウンは、メルセデス側としてはミハエル・シューマッハの残留を望んでいることを示唆",
                    "Assets/schumacher.jpg",
                    "Item Description: Pellentesque porta, mauris quis interdum vehicula, urna sapien ultrices velit, nec venenatis dui odio in augue. Cras posuere, enim a cursus convallis, neque turpis malesuada erat, ut adipiscing neque tortor ac erat.",
                    "メルセデスAMGのチーム代表ロス・ブラウンは、メルセデス側としてはミハエル・シューマッハの残留を望んでいることを示唆した。・・・省略」 ",
                    group1));

 

おおおお~~なんと簡単にできたじゃないか。

その後、記事一つだとアレなのでいくつかの記事を持ってきてみてビルドするとすっかりそれっぽくなった。

 

あとは、アプリのタイトル(? アプリ画面左上に出る文字列)がApp1っていうデフォルトのものだったので、App.xaml の x:Key="AppName" を修正したり、

ソリューションエクスプローラのAssetsにある画像に手を加えたりして見た。

 

そして、ビルドしてみるとご覧の通り、めっちゃそれっぽい。

f:id:hanamiche:20120611094111p:plain

 

記事の画面も、ご覧の通り完全にそれっぽい

f:id:hanamiche:20120611094231p:plain

 

ブログではどうにも伝えられないが、スムーズなアニメーションもちゃんとする。

今回はコンテンツをソースにハードコーディングですがRSSやAtom、自分でコンテンツを持っている人ならすぐにでもアプリが出せそうだ。(自分にはコンテンツがないので・・・このサンプルからの発展は・・・無い(T-T))

 

ちなみに、ホーム画面にもちゃんとアイコンが表示されていました。

f:id:hanamiche:20120611094509p:plain

※アイコンは、最近はまっている有村架純さんです。。。