選択した画像と、テクスチャとなる画像を合成して保存するには：2カ月で160本作った還暦開発者が送る10のアプリ開発ノウハウ（7）（1/4 ページ）

古（いにしえ）からのVBでWindows 8.1向けのさまざまな機能のアプリを開発する手順やコツを解説していく。今回は、選択した画像と、テクスチャとなる画像を合成して保存する方法をサンプルを交えて解説する。

[薬師寺国安，PROJECT KySS]

　前回の「指定したフォルダー内の画像をスライド形式で表示させるには」に続き、VBで、Windows 8.1アプリを開発する手順を解説する。今回のアプリは、選択した画像と、テクスチャとなる画像を合成して保存するサンプルだ。動かし方から説明する。

　まず、「元画像」ボタンで、ローカルにある画像を取り込む（図1）。

図1　「元画像」ボタンで画像を撮り込んだ

　次に「合成画像」ボタンの使用が可能になるので、これもローカルから、テクスチャとなる画像を取り込む（図2）。

図2　「合成画像」ボタンで画像を撮り込んだ

　特に、テクスチャは通常の画像でもいい。ただし、640×480サイズ以外の画像は読み込めないので気を付けてほしい。「合成」ボタンの使用が可能になるので、このボタンをタップすると、2枚の画像が合成して表示され、保存される（図3）。

図3　「合成」ボタンで2枚の画像を合成して保存した

　「データ一覧」ボタンで、保存した合成画像の一覧ができる（図4）。

図4　「データ一覧」ボタンで保存した画像の一覧ができる

　一番新しく作成された画像が選択状態になり、周囲が白い枠線で囲まれている。この状態なら、キーボードの［←］［→］キーで画像の選択が可能だ。

　Windows ストアに申請する際は、このような場面では、キーボードで画像の選択ができないとリジェクトされるので、注意してほしい。

　マウスの右クリックで表示されるアプリケーションバーから画像の削除ができる。「削除」「一括削除」アイコンが表示される（図5）。

図5　マウスの右クリックで表示されるアプリケーションバーに「削除」と「一括削除」アイコンが表示される

　「削除」アイコンでは、画像を選択しておいてから削除する必要がある。「一括削除」では、画像を選択することなく、このアイコンをタップするだけで全ての画像が削除されるので注意してほしい。

　今回のサンプルプログラムは下記のURLからダウンロードできる。

• http://2008r2.projectkyss.net/atmarkIT/WriteableBitmap_Bilt.zip

プロジェクトの作成

　Visual Studio（以下、VS） 2013のメニューから［ファイル（F）］→［新規作成（N）］→［プロジェクト（P）］と選択する。

　次に、［テンプレート］から［Windows ストア］を選択し、右に表示される項目名から［新しいアプリケーション（XAML）］を選択する。［名前（N）］に任意のプロジェクト名を指定する。ここでは「WriteableBitmap_Bilt.xaml」という名前を付けている。

「画像ライブラリ」へのアクセス許可の設定

　ピクチャライブラリー内にフォルダーを作成して画像を保存するため、「画像ライブラリ」へのアクセス許可を設定する。

　［ソリューション・エクスプローラー］内にある、Package.appxmanifestファイルをダブルクリックして開く。［機能］タブ内の「機能：」にある、「画像ライブラリ」にチェックを付ける（図6）。

図6　「画像ライブラリ」にチェックを付ける

Nugetパッケージの管理

　［ソリューション・エクスプローラー］の［全てのファイルを表示］アイコンで、［参照設定］を表示する。［参照設定］を選択し、マウスの右クリックで表示されるメニューから［Nugetパッケージの管理］を選択し、表示される画面の［オンライン］を選択し、［検索］欄に「WinRTXamlToolkit」と入力する。すると、WinRT XAML Toolkitが表示されるので、［インストール］をクリックしてインストールする。

　同様にして「WriteableBitmapEx」もインストールしておく。WriteableBitmpExには画像の合成に使用するメソッドが含まれている。

　詳細については、連載第1回「カメラでクラウディア（Webカメラと画像を合成保存）」の「Nugetパッケージの管理」を参照してほしい。