ピクチャライブラリ内の画像を指定して表示する+1つのサンプル

今回は2つのサンプルを紹介します。「ピクチャライブラリ内の画像を指定して表示する」と「カメラで写した写真を保存する」です。最初は、「ピクチャライブラリ内の画像を指定して表示する」を紹介します。

ピクチャライブラリ内の画像を指定して表示する

今回のサンプルはピクチャライブラリ内の画像を指定して表示するというシンプルなものです。ユーザーがファイルを開いて選択できるようにするUI要素を表す、FileOpenPickerクラスの基本的な使い方のサンプルです。

実行すると画面の左隅上に[選択]ボタンが表示されています。このボタンをクリックすると、デフォルトでピクチャライブラリ内の画像がサムネイル表示されます。最初のフォルダーがピクチャライブラリになっているだけで、その他のフォルダー内の画像を選択して表示することも可能です（図1）。

図1：ピクチャライブラリ内の任意の画像を選択して表示した（クリックで拡大）

実際に動かした動画は下記のようになります。Windows Store Applicationの動画を撮るアプリケーションが存在していませんので、スマホで撮った動画です。見難い点はご了承願います。

サンプル一式は、会員限定特典としてダウンロードできます。記事末尾をご確認ください。

プロジェクトの作成

VS 2012のメニューから[ファイル(F)／新規作成(N)／プロジェクト(P)]と選択します。次に、「テンプレート」から「Windows ストア」を選択し、右に表示される項目名から「新しいアプリケーション(XAML)」を選択します。「名前(N)」に任意のプロジェクト名を指定します。ここでは「Win8_ImageSelectBasic」という名前を付けています。

コントロールの配置

ツールボックスからデザイン画面上にButtonとImageコントロールを1個ずつ配置します。ImageコントロールにはWidthとHeightは指定しないでおきます。StretchプロパティにはNoneを指定しておきます（図2）。Stretch列挙体の値については下記のURLを参照してください。
→　Stretch 列挙体（msdn）

図2：Imageコントロールをレイアウトした（クリックで拡大）

ピクチャライブラリへのアクセス許可の設定

今回のサンプルは「ピクチャライブラリ」にアクセスするため、ピクチャライブラリへのアクセス許可が必要になります。ソリューションエクスプローラー内にpackage.appxmanifestというファイルがありますので、このファイルをダブルクリックします。「機能」タブをクリックします。

機能」タブが開いたら、左の「機能：」内にある、「画像ライブラリ」にチェックを付けます（図3）。この作業は重要で、「ドキュメントライブラリ」「マイク」「音楽ライブラリ」「ビデオライブラリ」「Webカメラ」等へのアクセスを必要とする場合は、ここで設定を行います。

図3：package.appxmanifestを開き「機能」タブをクリックする（クリックで拡大）

書き出されるXAMLコードは省略します。