Windows 8商店应用中的模糊效果?

3

如何在Windows 8商店应用程序的XAML中为UI元素(如StackPanelRectangle)添加模糊效果?

我想到了类似WPF中的BlurEffect就像这里演示的那样。任何解决方案都应该适用于动画或至少每秒更新多次。

1个回答

0

您可以使用this库来模糊并编写图像。

它可能看起来像这样:

// Blit a bitmap using the additive blend mode at P1(10, 10)
writeableBmp.Blit(new Point(10, 10), bitmap, sourceRect, Colors.White, WriteableBitmapExtensions.BlendMode.Additive);

或者,您可以编写自己的代码(或使用其他人编写的代码),类似于this

private static Bitmap Blur(Bitmap image, Rectangle rectangle, Int32 blurSize)
{
    Bitmap blurred = new Bitmap(image.Width, image.Height);

    // make an exact copy of the bitmap provided
    using(Graphics graphics = Graphics.FromImage(blurred))
        graphics.DrawImage(image, new Rectangle(0, 0, image.Width, image.Height),
            new Rectangle(0, 0, image.Width, image.Height), GraphicsUnit.Pixel);

    // look at every pixel in the blur rectangle
    for (Int32 xx = rectangle.X; xx < rectangle.X + rectangle.Width; xx++)
    {
        for (Int32 yy = rectangle.Y; yy < rectangle.Y + rectangle.Height; yy++)
        {
            Int32 avgR = 0, avgG = 0, avgB = 0;
            Int32 blurPixelCount = 0;

            // average the color of the red, green and blue for each pixel in the
            // blur size while making sure you don't go outside the image bounds
            for (Int32 x = xx; (x < xx + blurSize && x < image.Width); x++)
            {
                for (Int32 y = yy; (y < yy + blurSize && y < image.Height); y++)
                {
                    Color pixel = blurred.GetPixel(x, y);

                    avgR += pixel.R;
                    avgG += pixel.G;
                    avgB += pixel.B;

                    blurPixelCount++;
                }
            }

            avgR = avgR / blurPixelCount;
            avgG = avgG / blurPixelCount;
            avgB = avgB / blurPixelCount;

            // now that we know the average for the blur size, set each pixel to that color
            for (Int32 x = xx; x < xx + blurSize && x < image.Width && x < rectangle.Width; x++)
                for (Int32 y = yy; y < yy + blurSize && y < image.Height && y < rectangle.Height; y++)
                    blurred.SetPixel(x, y, Color.FromArgb(avgR, avgG, avgB));
        }
    }

    return blurred;
}

要获取第二种方法的单个像素,请查看此处
BitmapImage iSrc

var array = new int[iSrc.PixelWidth * iSrc.PixelHeight]

var rect = new Int32Rect(0, 0, iSrc.PixelWidth, iSrc.PixelHeight)

iSrc.CopyPixels(rect, array, iSrc.PixelWidth * 4, 0) 

如果我没有Bitmap,这个能工作吗?以全屏60 fps运行的性能如何? - Vegard Larsen
哦...你想要做动画吗?我建议使用DirectX。使用控件可能无法获得所需的性能。请参阅http://msdn.microsoft.com/en-us/library/windows/apps/br229580.aspx。 - N_A
我可能会给它添加动画效果,但希望它足够简单,不需要使用DirectX,因为那需要比我们舒适的工作量更大。 - Vegard Larsen
要使其动画化,您需要做的就是将模糊和非模糊图像叠加在一起,然后慢慢淡入一个图像,同时淡出另一个图像。 - N_A
@VegardLarsen 那听起来相当处理器密集。 - N_A
显示剩余2条评论

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接