Win 2D在直接应用于文件时产生不同的效果级别UIElement

Question

我将Win2D高斯模糊应用于图像文件（存储文件）并直接应用于UIElement - Image（这是一个XAML图像），并且我看到为BlurAmount我正在用于存储文件输出和XAML图像不同的输出相同的值..

原始图像

当施加到XAML图片100％模糊（输出或者任何UIElement）

输出时施加到存储文件

---

相关代码100％的模糊：

对于图像文件：

using (var stream = await originalFile.OpenAsync(FileAccessMode.Read)) 
{ 
    var device = new CanvasDevice(); 
    var bitmap = await CanvasBitmap.LoadAsync(device, stream); 
    var renderer = new CanvasRenderTarget(device, bitmap.SizeInPixels.Width, bitmap.SizeInPixels.Height, bitmap.Dpi); 

    using (var ds = renderer.CreateDrawingSession()) 
    { 
     var blur = new GaussianBlurEffect(); 
     blur.BlurAmount = eo.effectAmount1; 
     blur.BorderMode = EffectBorderMode.Hard;      
     blur.Source = bitmap; 
     ds.DrawImage(blur);      
    } 
    var saveFile = await ApplicationData.Current.TemporaryFolder.CreateFileAsync("ImageName.jpg", CreationCollisionOption.GenerateUniqueName); 

    using (var outStream = await saveFile.OpenAsync(FileAccessMode.ReadWrite)) 
    { 
     await renderer.SaveAsync(outStream, CanvasBitmapFileFormat.Png,1.0f); 
    } 
}      

对于的UIElement（XAML图片）：

using (var stream = await sourceElement.RenderToRandomAccessStream())    
{ 
    var device = new CanvasDevice(); 
    var bitmap = await CanvasBitmap.LoadAsync(device, stream); 

    var renderer = new CanvasRenderTarget(device,bitmap.SizeInPixels.Width, 
                  bitmap.SizeInPixels.Height, 
                  bitmap.Dpi); 

    using (var ds = renderer.CreateDrawingSession()) 
    { 
     var blur = new GaussianBlurEffect(); 
     blur.BlurAmount = blurAmount; 
     blur.Source = bitmap; 
     blur.BorderMode = EffectBorderMode.Hard; 
     ds.DrawImage(blur); 
     } 

     stream.Seek(0); 
     await renderer.SaveAsync(stream, CanvasBitmapFileFormat.Png); 

    } 

问：这是预期的行为？如果是的话，我怎样才能使这两个案件有相同的输出？如果不是，我做错了什么？

Answer 1

你可以尝试使用bitmap.Size而不是bitmap.SizeInPixels？

var renderer = new CanvasRenderTarget(bitmap, bitmap.Size); 

我猜你正在体验模糊效果和像素化。

编辑1

如果不工作，您创建渲染后把这一说法。 SizeInPixels需要匹配：

Debug.Assert(
    bitmap.SizeInPixels.Width == renderer.SizeInPixels.Width 
    && bitmap.SizeInPixels.Height == renderer.SizeInPixels.Height 
); 

编辑2

如果像素都ok，尝试图像元素上设置StretchMode到None。

<Image Stretch="None" /> 

我只是在视觉树的某个地方像素化的怀疑。

说明

你需要适应DPI规模。您的屏幕可能设置为200％。所以，如果你有一个尺寸为100x100的Image控件，你实际上需要200x200像素的图片来填充它。如果你给它一个100x100的位图源，那么它会将其拉伸以适应。这就是你得到像素化的原因。

因此，要解决您的问题，请禁用图像上的任何拉伸，或按DPI比例缩小的源大小调整其大小。也就是说，在200％DPI比例下，将图像宽度和高度设置为100x100像素图像的50x50。

DPI可以使用UI线程上获得规模：

var dpiScale = DisplayInformation.GetForCurrentView().LogicalDpi/96f;