酢ろぐ！

カレーが嫌いなスマートフォンアプリプログラマのブログ。

Windows ストア アプリでNuGetパッケージを利用する

開発-Windows Store Apps

TwitterやFacebookなどのサービス側の仕様変更に伴うライブラリのバージョンアップであったり、バグフィックスでのバージョンアップであったりと、アプリケーション本体ではなく、ライブラリのバージョン管理にはつい忘れがちになってしまいます。

Windowsストアアプリケーションの開発で、ライブラリの導入と管理を楽におこなえる「NuGet」が利用できます。ここでは、NuGetの管理ダイアログでライブラリを追加する方法を紹介します。

**NuGetマネージャでライブラリを追加する

Visual Studioのツールバーの[ファイル]、[新規作成]、[プロジェクト]の順にクリックします。[新しいプロジェクト]ダイアログが表示されます。

左のツリーの中から[テンプレート]を選択し、[Visual C#]の[Windows ストア]を選択します。[新しいアプリケーション (XAML)]を選び、適当なプロジェクト名にします。ここではBitmapEffectSampleと命名しました。

ソリューション エクスプローラーの「参照設定」を右クリックしてください。メニューから[NuGetパッケージの管理]をクリックします。左のツリーの中から[オンライン]を選択し、右上の検索欄に「WriteableBitmap」と入力してEnterキーを押下すると真ん中のウィンドウに検索結果が表示されます。

WriteableBitmapExなど複数のライブラリが表示されています。WriteableBitmapクラスに拡張メソッドを追加する「WriteableBitmapEffector」を選択し、[インストール]ボタンをクリックします。

選択したライブラリをプロジェクトに取り込みに成功すると、チェックマークが付きます。

以上でライブラリの導入は完了です。

**ついでにWriteableBitmapEffectorの使い方

WriteableBitmapEffectorの使い方は、「WriteableBitmapEffectorの使い方 - 酢ろぐ！」でも紹介しています。撮影した写真を加工しアプリケーション上に表示させます。

ButtonコントロールとImageコントロールを適当な位置に配置します。ButtonコントロールのClickイベントを写真撮影のトリガーにし、加工した写真をImageコントロールに表示させるようにしましょう。

|xml| 

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
    <Button Content="Button" HorizontalAlignment="Left" Margin="236,48,0,0" 
            VerticalAlignment="Top" Height="67" Width="170" Click="Button_Click_1"/>
    <Image x:Name="image" HorizontalAlignment="Left" Height="316" 
           Margin="36,158,0,0" VerticalAlignment="Top" Width="311"/>
</Grid>

||<

WriteableBitmapの拡張メソッドを使用するために、MainPage.xaml.csの頭にはSoftbuild.Media名前空間のusingディレクティブを追加します。

|cs| using Softbuild.Media; ||<

ボタンがクリックされるとButton_Click_1メソッドが呼び出されます。CameraCaptureUIクラスを使って写真撮影をおこない、StorageFileオブジェクトからファイルストリームを開き、WriteableBitmapオブジェクトに読み込ませます。

EffectSaturationメソッドでWriteableBitmapオブジェクトを生成します。生成したWriteableBitmapオブジェクトをImageコントロールのSourceプロパティに設定します。

|cs| using Softbuild.Media; using System; using Windows.Foundation; using Windows.Media.Capture; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; using Windows.UI.Xaml.Media.Imaging;

namespace BitmapEffectSample { public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); }

    private async void Button_Click_1(object sender, RoutedEventArgs e)
    {
        // 内部カメラを使用して撮影をおこなう
        var capture = new Windows.Media.Capture.CameraCaptureUI();
        capture.PhotoSettings.CroppedSizeInPixels = new Size(320, 240);
        var file = await capture.CaptureFileAsync(CameraCaptureUIMode.Photo);
        if (file != null)
        {
            var bmp = new WriteableBitmap(320, 240);
            await bmp.SetSourceAsync(await file.OpenReadAsync());

            // 彩度の調整をおこないImageコントロールへ設定する
            image.Source = bmp.EffectSaturation(0.7);
        }
    }
}

} ||<

上記のサンプルコードを実行すると、彩度を調整した写真が表示されたと思います。