読者です 読者をやめる 読者になる 読者になる

酢ろぐ!

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

WindowsストアアプリでWriteableBitmapExを使って画像をリサイズ処理、blit処理する

Windows Store Apps

WriteableBitmapExを使って、画像のリサイズする方法2枚の画像を合成する方法を紹介します。WriteableBitmapExの導入方法については「WindowsストアアプリでWriteableBitmapExを使ってクリッピング処理する - 酢ろぐ!」に書いたことがありますので参考にしてください。

WindowsストアアプリのプロジェクトへWriteableBitmapExを導入済みとします。

WriteableBitmapExを使って画像をリサイズする

private async void ResizeImage()
{
    // 「Assets/image1.jpg」をロードする
    var bitmap = await WriteableBitmapExtensions
        .FromContent(null, new Uri("ms-appx:///Assets/image1.jpg"));

    // 縦方向(Height)を半分に画像を縮小する
    var resizedBitmap = bitmap.Resize(500, bitmap.PixelHeight / 2,
        WriteableBitmapExtensions.Interpolation.NearestNeighbor);

    ResultImage.Source = resizedBitmap;
}

サンプルコードを実行すると下図のようにリサイズされて表示されます。

f:id:ch3cooh393:20141106210222p:plain

WriteableBitmapExを使って画像をblit処理(画像の上に画像を描画)する

private async void BlitImage()
{
    // 「Assets/image1.jpg」をロードする
    var bitmap1 = await WriteableBitmapExtensions
        .FromContent(null, new Uri("ms-appx:///Assets/image1.jpg"));

    // 「Assets/image2.jpg」をロードする
    var bitmap2 = await WriteableBitmapExtensions
        .FromContent(null, new Uri("ms-appx:///Assets/image2.jpg"));

    // image1 の上に image2 を縮小して描画する
    bitmap1.Blit(new Rect(10, 20, 300, 450), bitmap2, 
        new Rect(0, 0, bitmap2.PixelWidth, bitmap2.PixelHeight));

    ResultImage.Source = bitmap1;
}

サンプルコードを実行すると下図のように上からビットマップが描画されて表示されます。

f:id:ch3cooh393:20141106210301p:plain

関連記事

WindowsランタイムAPI(Windows Runtime API, WinRT API)を使ってアプリ開発する際に逆引きとしてお使いください。