タイマーを使って時刻を表示してみよう

では、次にちょっと変わったアニメーションを伴った時刻の表示方法を紹介しましょう。

WinRT XAML Toolkitに含まれるコントロールを使ってみよう

今回はWinRT XAML Toolkitに含まれるコントロールを使って、アニメーションを伴った時刻表示に挑戦してみます。WinRT XAML Toolkitについては下記のURLを参照してください（図5）。http://winrtxamltoolkit.codeplex.com/

図5　WinRT XAML ToolkitのHOMEページ

では、このWinRT XAML Toolkitに含まれているコントロールを、どのようにしてVS2013で使用できるようにするのか、その手順を解説していきましょう。

今回も新しいプロジェクトを作成します。「名前」は「AimationTimer」としました。

Nugetパケージの管理

まず、ソリューションエクスプローラーを開きます。次にソリューションエクスプローラーに表示されているアイコンから「全てのファイルを表示」アイコンをタップします。すると、ソリューションエクスプローラー内に「参照設定」という項目が現れます（図6）。

図6　「全てのファイルを表示」アイコンで「参照設定」が表示された

「参照設定」には、参照対象のアセンブリやファイルを指定します。それでは、この参照設定にWinRT XAML Toolkitを追加してみましょう。

まず、「参照設定」を選択し、マウスの右クリックで表示される「Nugetパケージの追加」を選択します（図7）。

図7　「参照設定」から「Nugetパッケージの追加」を選択

表示される画面から「オンライン」を選択し、「Nuget公式パッケージソース」を選択し、「オンラインの検索」欄に「WinRT XAML Toolkit」と入力します。すると「WinRT XAML Toolkit」に［インストール］ボタンが追加で表示されます（図8）。

図8　「Nugetパッケージの管理」でWinRT XAML Toolkitのインストール画面が表示された

［インストール］ボタンをタップするとインストールが開始され、インストールが完了すると図8のように緑色のチェックアイコンが表示されます（図9）。

図9　WinRT XAML Toolkitが無事インストールされた

では、無事インストールされているかどうか、ソリューションエクスプローラー内の「参照の追加」の中を確認してみましょう。すると図10のように「WinRT Xaml Toolkit」が追加されているのがわかります。また同時に、package.configというWinRT Xaml Toolkitの情報を記録したファイルも作成されています。もし、「参照の追加」からWinRT Xaml Toolkitを削除して再インストールする場合、このpackage.configファイルが存在していると、すでにインストール済みと解釈されて再インストールができないので、このファイルも一緒に削除してから再インストールを試みましょう。

図10　「参照の追加」内にWinRT Xaml Toolkitが追加されている

では、次に、このWinRT Xaml Toolkitに含まれているコントロールをツールボックスに追加して使用可能な状態にしてみましょう。

WinRT Xaml Toolkitのコントロールをツールボックスに追加する

ツールボックスを表示し、「コモン XAMLコントロール」または「全ての XAMLコントロール」の項目名の上で、マウスの右クリックをします。表示されるメニューから「アイテムの選択」をクリックします（図11）。

図11　ツールボックスから「アイテムの選択」をクリックする

表示される画面から、［参照］ボタンをクリックします。AnimationTimer/packages/winrtxamltoolkit.1.5.4.3/lib/netcore451/WinRTXamlToolkit.dllを指定します（図12）

図12　［参照］ボタンでWinRTXamlToolkit.dllを指定する

［開く］ボタンをタップするとWinRTXamlToolkit.Controlsのコントロールが追加されています。［OK］をクリックします（図13）

図13　WinRT XAML Toolkitのコントロールが追加された

すると「ツールバー」にWinRT XAML Toolkitのコントロールが追加されます（図14）。

図14　「ツールバー」にWinRT XAML Toolkitのコントロールが追加された

これで、VS2013でWinRT XAML Toolkitのコントロールを使用する準備ができました。