はじめに
前回は、Windowsストアアプリを開発するための準備についてご紹介をしました。本記事では、実際にWindowsストアアプリを作成する手順と、作成したアプリケーションに画面部品を配置する手順を説明していきます。
対象読者
本記事は、次の方を対象にしています。
- アプリケーション開発がはじめての人
- HTML/CSSでWebサイトを作ったことがある人
必要な環境
本連載で紹介する環境は次のとおりです。
- OS:Windows 8 Pro
- IDE:Microsoft Visual Studio Express 2012 for Windows 8
どんなアプリを作ろうかな?
Windowsストアアプリを開発するための準備が整ったので、具体的にどのようなアプリを作るかを決めていきます。
私は旅行が好きで、日程や予算などが決まればいろいろなところに出かけます。「どこに行こうかな?」とか「何を見に行こうかな? おいしいものはあるのかな?」といった情報を事前に集め、行先を決めるのも旅の楽しみの一つです。
最近の旅行は、個人のニーズに応じて航空便やホテルを自由に組み合わせて作るものが多くなっています。これらの旅行に関する情報を得るとき、旅行会社が発行している紙のカタログだと、手軽に見ることができますが、旅行代金を計算するために詳細な数字や金額/条件などを記載する必要があり、旅費を計算するのに電卓やメモなどが必要になります。また、パソコンであればインターネットから多くの情報を得ることができますが、ちょっとした空き時間にソファーやベッドルームでくつろぎながら情報を見るというのが難しくなります。スマートフォンだと、手軽に情報を得ることができますが、ホテルや観光地などの臨場感あふれる写真や動画を見るには、画面サイズが気になるところです。
そこで、タブレットで利用できる「旅行カタログ」を作ってみたいと思います。一般的に旅行先を決めるときは、次のような項目を検討するのではないでしょうか。
- どこに行くか
- いつからいつまで行くか
- どのような交通手段(飛行機・新幹線・車)で行くか
- どのグレードのホテルに滞在するか
- 何人で行くか、そのうちこどもは何人いるか
- 食事は必要か
など。
また、ホテルや飛行機などの料金は、目的地の天候(乾季/雨季)や観光イベント(お祭りがあるか)でも変わってきます。さらに、これらの空き状況は他のお客さんの予約状況によって時々刻々と変化します。また、旅行先の観光地情報や治安情勢といったことも、旅行者にとっては気になるところです。
では、具体的に「旅カタログ」の設計を行っていきます。
アプリケーションの要件を決める
はじめに、アプリケーションが誰のため/何のためのもので、なにを実現するかを決めます。これを「要件定義」といいます。
サンプルアプリケーションは、旅行に行きたい!と思っている人に、必要な情報を分かりやすく表示するためのものを作ります。ただし、旅行カタログに必要なすべての機能を取り込むと大がかりなプログラムになるので、サンプルアプリケーションで実現する要件を、以下の3点に絞ります。
- 旅行先の滞在ホテルを検討しているユーザに使ってもらう
- ホテルの宿泊料金を知ることができる
- ホテルの情報を分かりやすく表示する
次に、これらの要件を満たすためのアプリケーションの設計をします。
アプリケーションの設計をする
作りたいアプリケーションの要件が決まったら、アプリケーションを設計します。設計とは、どのようなデザイン/機能のアプリを作るかを具体的に決めることです。
ここでは、要件を満たすために次のようなアプリケーションを作ることとします。
- ディスプレイを4分割した画面に情報を表示する
- アプリケーション起動時に、タイトルと実行した日付を表示する
- 条件(ホテルグレード・滞在日数・人数)を入力して料金計算ボタンを押すとホテルの宿泊料金を自動計算して表示する
- 旅行先を選択すると、ホテルの写真や情報を画面に表示する