手順 1：モバイル MVC Classic Web アプリケーションの作成

最初に、新しい ASP.NET MVC 4 Wijmo モバイルアプリケーションを作成します。組み込みビューを使用して自動的にスタイルが設定されます。次の手順に従います。

Visual Studio で、［ファイル］→［新規作成］→［プロジェクト］を選択します。
［インストールされたテンプレート］から［Visual C#］を選択します。ASP.NET MVC 4 Wijmo モバイルアプリケーションを作成するには、［.NET Framework 4］を選択します。
［ASP.NET MVC 4 Wijmo モバイルアプリケーション］を選択し、アプリケーションの名前を入力して、［OK］をクリックします。
Wijmo プロジェクトが作成されます。プロジェクトには、Models、Views、および Controllersフォルダが含まれています。MVC スキャフォールディングの場合は、CodeTemplates フォルダも作成されます。
ソリューションエクスプローラで、Views→ Sharedと順にノードを展開し、_Layout.cshtmlを開きます。定義済みの wijappview ウィジェットと wijlistview ウィジェットを使用して、アプリケーションフォーマットが既に設定されています。次のマークアップを見つけてください。

ソースビュー	コードのコピー
<div data-role="menu" class="ui-body-a"> <ul data-role="listview" data-theme="a"> <li>@Html.ActionLink("バージョン情報", "About", "Home")</li> <li>@Html.ActionLink("連絡先", "Contact", "Home")</li> </ul> </div>

ソースビュー

コードのコピー

<div data-role="menu" class="ui-body-a">
    <ul data-role="listview" data-theme="a">
        <li>@Html.ActionLink("バージョン情報", "About", "Home")</li>
        <li>@Html.ActionLink("連絡先", "Contact", "Home")</li>                    
    </ul>
</div>

次のようにマークアップを変更します。これで、ToDo 項目がメニューに追加されます。

ソースビュー	コードのコピー
<div data-role="menu" class="ui-body-a"> <ul data-role="listview" data-theme="a"> <li>@Html.ActionLink("ToDo", "Index", "ToDo")</li> <li>@Html.ActionLink("連絡先", "About", "Home")</li> <li>@Html.ActionLink("バージョン情報", "Contact", "Home")</li> </ul> </div>

ソースビュー

コードのコピー

<div data-role="menu" class="ui-body-a">
    <ul data-role="listview" data-theme="a">
        <li>@Html.ActionLink("ToDo", "Index", "ToDo")</li>
        <li>@Html.ActionLink("連絡先", "About", "Home")</li>
        <li>@Html.ActionLink("バージョン情報", "Contact", "Home")</li>                    
    </ul>
</div>

次の手順では、プロジェクトのモデルを追加します。