WP7背景模糊效果

Question

我需要知道，这是模糊Windows Phone 7应用程序背景的最佳方式，以便将用户的注意力集中在“永远在线”的弹出窗口上。

我的想法是：

1. 制作背景网格的内存屏幕截图（将其转换为freezable或其他内容）。
2. 添加与背景网格重叠的图像，但在弹出窗口下方（使用z-index）。

我仍然怀疑我能否重叠应用程序栏。

此时，如果您有解决方案，请告知。

Answer 1

为您指点......

不幸的是Silverlight BlurEffect和其他Bitmap效果didn't make it into Window Phone 7，所以你必须自己实现模糊。这实际上非常简单，只需使用Gaussian Convolution Filter。

要实现此效果，您可以将应用程序的视觉效果捕获到WriteableBitmap中，操纵图像以创建模糊，然后使用PopUp将此图像覆盖在应用程序上。我在博客文章中做了类似的事情，我在这里写了关于飞出文本动画的文章：

http://www.scottlogic.co.uk/blog/colin/2011/04/metro-in-motion-3-flying-titles/

按如下方式查找根视觉：

var rootElement = Application.Current.RootVisual as FrameworkElement;

将此UI的副本添加到弹出窗口中，如下所示：

  _backgroundMask = new Rectangle()
  {
    Fill = new SolidColorBrush(Colors.Black),
    Opacity = 0.0,
    Width = rootElement.ActualWidth,
    Height = rootElement.ActualHeight
  };
  _popupCanvas.Children.Add(_backgroundMask);

  _targetElementClone = new Image()
  {
    Source = new WriteableBitmap(element, null)
  };
  _popupCanvas.Children.Add(_targetElementClone);

并表明：

_popup.IsOpen = true;

我会告诉你如何模糊背景！

另外，您将无法覆盖或捕获应用栏视觉效果。在执行此转换之前隐藏它。

最后，模糊背景并不是真正的'Metro'。你确定要这么做吗？

Answer 2

只需在页面顶部使用半透明图层，而不是模糊。

在尝试创建此类效果之前，您应隐藏应用程序栏，因为您无法在其上放置任何内容。