创建一个活的平铺图像 - 在屏幕上看起来很好 - 看起来像活瓷砖一样错误

Question

我在Windows Universal App的屏幕上绘制了一些形状，然后我也尝试将基础UIElement保存到文件中并指定我的LiveTile模板使用它。

我认为我很接近，但有些事情是非常错误的。这是它在我的屏幕上的样子：

以下是它在瓷砖上的样子：

第一张图片中的黑色是透明的，而实时图块似乎有很多透明像素（浅灰色是我的背景图像）。我可以看到很多黄色和绿色，所以它似乎正确创建/查找文件并更新实时切片模板。我只是无法看到我的意图 - 在我的Windows Phone上。

然而，在我的Windows 10桌面上 - 它看起来我的期望（只是它似乎已经失去了它的透明度 - 我很满意）

画布是150x150。实时切片模板是TileSquare150x150Image。我正在使用.png文件。我已经尝试更改BitmapPixelFormat，手动设置logicalDpi，以便在调用encoder.SetPixelData时使用，并使用不同的BitmapAlphaModes ...偶尔会抛出异常，否则它似乎渲染大致相同。

有人能把我推向正确的方向吗？我认为通用应用程序可以确保设备之间的相同行为，所以我非常惊讶地看到它在手机和桌面之间表现得如此不同......但我确信我只是做错了什么。我的代码如下所示：

var renderBitMap = new RenderTargetBitmap();
await renderBitMap.RenderAsync(_container);

var pixels = await renderBitMap.GetPixelsAsync();            
byte[] myBytes = pixels.ToArray();

var folder = ApplicationData.Current.LocalFolder;
var file = await folder.CreateFileAsync("ts150.png", CreationCollisionOption.ReplaceExisting);
var logicalDpi = DisplayInformation.GetForCurrentView().LogicalDpi;
using (var stream = await file.OpenAsync(FileAccessMode.ReadWrite))
{
    var encoder = await BitmapEncoder.CreateAsync(BitmapEncoder.PngEncoderId, stream);
    encoder.SetPixelData(BitmapPixelFormat.Bgra8, BitmapAlphaMode.Ignore, (uint)options.Size.Width, (uint)options.Size.Height, logicalDpi, logicalDpi, myBytes);

    await encoder.FlushAsync();
}

Answer 1

当您使用RenderTargetBitmap渲染控件时，图片会自动缩放DisplayInformation.RawPixelsPerViewPixel（即使您在RenderAsync()调用中指定宽度和高度）。

因此，您应始终使用PixelWidth的{​​{1}}和PixelHeight属性来确定已呈现图片的实际尺寸。

问题中的问题是RenderTargetBitmap和options.Size.Width与options.Size.Height中的值不同，因此像素数据和图像的大小传递给编码器不匹配。