wpf 实现实时毛玻璃(live blur)效果

I2OS7发布后,就被它的时实模糊吸引了,就想着能不能将这个效果引入到我们的产品上。拿来当mask肯定会很爽,其实在之前也做过类似的,但是不是实时效果,是死的,只是截图然后模糊,当背景,效果可想而知。


然后就想着自己做实时滤镜,   自己写了高斯模糊算法,模糊效果还算可以,但是背景取样效率太低,也试过优化这个过程。试过:将截图缩小,再模糊,再放大,模糊时先横向再纵向,最终效果还是不理想。

最后 发现WPF里的自VisualBrush就可以轻松完成这个效果。 惊恐


首先来一张最终运行的效果图:



这里为了确定它真的是实时的,我将两个图片放在ScrollViewer里面。以便可以拖动预览效果。这里的模糊半径是80


主要思路是,在BlurMask里面添加一个Border,这个Border的背景就是实时模糊效果。

模糊层我是自定义了一个BlurMask控件,该控件继承Grid,以便在上面添加内容,也方便在没有被BlurMask覆盖的时候将模糊效果切断(下面那个小的模糊区域)。

BlurMask中最主要的代码:其中targetpanel就是需要覆盖的那个控件


Border border=new Border();
VisualBrush brush = new VisualBrush();
brush.Visual = targetPanel;
brush.Stretch = Stretch.Uniform;
border.Background = brush;
border.Effect = new BlurEffect()
	{
		Radius = 80,
		RenderingBias = RenderingBias.Performance
	}
border.Margin = new Thickness(-this.Margin.Left, -this.Margin.Top, 0, 0);



这样我们就能实时的将targetpanel模糊,并显示到Border的背景上。接下来需要做的就是将border添加到Grid中


this.ClipToBounds = true;
this.Children.Clear();
this.Children.Add(border);


主要代码就这么一些,然后我们要做的是暴露需要设置的参数 模糊半径和遮罩目标。



源码下载


  • 1
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 7
    评论
WPF(Windows Presentation Foundation)可以通过使用动画和转换效果实现图片环形旋转轮动效果。首先,我们可以使用WPF中的Ellipse控件来创建一个圆形容器,然后在这个容器中放置图片控件。接下来,我们可以使用WPF中的动画功能来实现图片的环形旋转效果。 首先,我们可以使用DoubleAnimation来定义图片旋转的动画效果。通过改变图片控件的RenderTransform属性(例如RotateTransform),我们可以让图片围绕圆形容器的中心点进行旋转。我们可以使用Storyboard来组织动画,并通过使用AnimateProperty属性来让图片按照一定的速度和方向进行环形旋转。 另外,我们还可以使用Path类来定义图片的旋转路径,通过使用PathAnimationUsingPath属性来让图片沿着指定的路径进行环形旋转。在这个过程中,我们可以通过设置RepeatBehavior属性来让图片循环环形旋转一定的次数或者无限循环。 此外,我们还可以通过使用触发器和事件来控制图片环形旋转的起始和停止。例如,我们可以通过鼠标悬停事件(MouseEnter)来触发环形旋转效果的开始,而通过鼠标离开事件(MouseLeave)来触发环形旋转效果的停止。 总体来说,利用WPF中丰富的动画和转换功能,我们可以很容易地实现图片的环形旋转轮动效果。相比较于传统的WinForms等框架,WPF提供了更加灵活和强大的界面设计和动画效果实现方式。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 7
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值