Blur(ぼかし)エフェクトをかける

UWPにてXAMLコントロールに対するBlur(ぼかし)効果は廃止されました。

しかし、RenderTargetBitmapというXAMLコントロールをビットマップ化するAPIを用いてビットマップ化 -> ぼかし画像処理 -> コントロールのBackgroundに適用をすることでぼかしを再現できます。

というわけでこんなBlurコントロールを作ってみました。

 

あとはこんな感じにUpdateBlurメソッドを適用するとOKです。

 


ブラーをSplitViewのPaneの背景にするとすごくかっこいいですがSplitViewのPaneは出るのに時間がかかるため、ブラーがへんなところにかかります。

そこでupdateBlurの引数にdelayの時間を指定することで指定時間後にブラーをかけることで対処できます。

超参考になったサイト

Render XAML to image, Blur app UI, or how to enable awesome user experiences in your UWP app