写真をぼかす Part.4 マスクを使って周辺だけをぼかす。

  • Article

#wp7dev_jp

さて、前回作ったアプリにマスクの機能をつけます。つまり、画面全部をぼかすのではなく画面の一部をぼかします。

プログラム的にやる方法もありますが、今回は簡単な方法でトライします。

その方法とは、OpacityMask。実は Image コントロールには初めからマスクの機能があるんです。

マスク画像の準備

ということでマスク画像を準備します。真中が透明（=画像が透明になる）で周りが黒（画像が不透明になる）のマスク画像を用意します。

opacityMask

これをプロジェクトにコピーします。

実は、ここでいきなり Result Image の Opacity Mask プロパティ設定に入れてしまえば終わりなのですが、あと後の応用のためにプログラムで実装します。

Opacity Mask を読み込む処理

Effect 処理の最後でOpacity Mask を読み込んでみます。 Opacity Mask 自体は Brush です。ですからこのくらいの画像なら GradientBrush を作ることも可能です。

 private void Effect()

{

    WriteableBitmap sourcewp = new WriteableBitmap(sourceimg, null); //元画像用

　　　　　　　：

    //透明度マスク用のイメージを読み込み

    ImageBrush maskbrush = new ImageBrush();

    Uri uri = new Uri("opacityMask.png", UriKind.Relative);

    maskbrush.ImageSource = new BitmapImage(uri);

    resultimg.OpacityMask = maskbrush;

    //処理時間表示

    MessageBox.Show((DateTime.Now - start).TotalSeconds.ToString() + " sec");

}

結果

出来上がり。画像を読み込んで、エフェクトをかければこんな感じです。周りだけぼけているでしょ？

image

尚、これは、背景画像に以下のようなマスクがかけられたぼかし画像を足してできています。

image

簡単！