酢ろぐ!

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

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

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コントロールに表示させるようにしましょう。

<Page
    x:Class="BitmapEffectSample.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:BitmapEffectSample"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <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>
</Page>

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

using Softbuild.Media;

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

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

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);
            }
        }
    }
}

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