SaveJpeg 导致“阴影”具有透明度的工件

Question

只是想跟你确认一件事。我正在使用 WriteableBitmap 创建一个图像，并将其用作活动磁贴。工作正常，但我注意到文本边缘有阴影。使文字看起来有点脏或乱。

看看下面的图片。左侧部分来自使用 WriteableBitmap 创建的活动磁贴，右侧部分是 Windows Phone 标准磁贴（Internet Explorer 磁贴）。看到区别了吗？

http://img268.imageshack.us/img268/8749/unled2imo.png http://img268.imageshack.us/img268/8749/unled2imo.png http:/ /img268.imageshack.us/img268/8749/unled2imo.png

有什么我对此可以做什么？您以前注意到过这一点吗？

编辑： 嗯，我想我看错了函数。我认为这可能是 wbmp.SaveJpeg 造成的？我将文本和背景图像放入网格中，然后使用 wbmp.SaveJpeg 保存。是这个原因吗？有什么解决方法吗？

string sIsoStorePath = @"\Shared\ShellContent\tile.png";
using (IsolatedStorageFile appStorage =     IsolatedStorageFile.GetUserStoreForApplication())
{
    //ensure directory exists
    String sDirectory = System.IO.Path.GetDirectoryName(sIsoStorePath);
    if (!appStorage.DirectoryExists(sDirectory))
    {
        appStorage.CreateDirectory(sDirectory);
    }

    using (IsolatedStorageFileStream stream = new IsolatedStorageFileStream(sIsoStorePath, System.IO.FileMode.Create, appStorage))
    {
        wbmp.SaveJpeg(stream, 173, 173, 0, 100);
    }
}

Answer 1

WritableBitmap.Pixels 指出“Silverlight WriteableBitmap 使用的格式是 ARGB32（预乘 RGB）”。也许活动图块需要非预乘像素格式。

我在 Silverlight 中找不到任何 API 来更改格式，但我认为本文中的方法可能正是您需要的：

http://nokola.com/blog/post/2010/01/27/The-Most-Important-Silverlight-WriteableBitmap-Gotcha-Does-It-LoseChange-Colors.aspx

编辑：

根据我的测试，问题似乎出在 JPEG 压缩伪像上，因为 SaveJpeg 会以 JPEG 格式保存文件，即使您使用 .png 扩展名命名它们。

下面的示例代码有一个对 MakeNonPremultiplied(bitmap.Pixels) 的注释掉调用，它显示了如果您使用某些库将其保存为适用于透明度和期望的文件格式，则如何调用过滤器将像素格式修改为非预乘非预乘格式。

using System;
using System.IO;
using System.IO.IsolatedStorage;
using System.Linq;
using System.Windows;
using System.Windows.Media.Imaging;
using Microsoft.Phone.Shell;

namespace LiveTilePlayground
{
    public partial class LiveTileGenerator
    {
        /// <summary>
        /// Renders a FrameworkElement (control) to a bitmap
        /// the size of a live tile or a custom sized square.
        /// </summary>
        /// <param name="element">The element.</param>
        /// <param name="size">
        /// The size of the bitmap (in each dimension).
        /// </param>
        /// <returns></returns>
        public static WriteableBitmap RenderBitmap(
            FrameworkElement element,
            double size = 173.0)
        {
            element.Measure(new Size(size, size));
            element.Arrange(new Rect(0, 0, size, size));
            return new WriteableBitmap(element, null);
        }

        /// <summary>
        /// Updates the primary tile with specific title and background image.
        /// </summary>
        /// <param name="title">The title.</param>
        /// <param name="backgroundImage">The background image.</param>
        public static void UpdatePrimaryTile(string title, Uri backgroundImage)
        {
            ShellTile primaryTile = ShellTile.ActiveTiles.First();
            StandardTileData newTileData = new StandardTileData
            { Title = title, BackgroundImage = backgroundImage };
            primaryTile.Update(newTileData);
        }

        /// <summary>
        /// Saves the tile bitmap with a given file name and returns the URI.
        /// </summary>
        /// <param name="bitmap">The bitmap.</param>
        /// <param name="fileName">Name of the file.</param>
        /// <returns></returns>
        public static Uri SaveTileBitmap(
            WriteableBitmap bitmap, string fileName)
        {
            //MakeNonPremultiplied(bitmap.Pixels);

            using (var store = IsolatedStorageFile.GetUserStoreForApplication())
            {
                if (!store.DirectoryExists(@"Shared\ShellContent"))
                {
                    store.CreateDirectory(@"Shared\ShellContent");
                }

                using (
                    var stream = store.OpenFile(
                        @"Shared\ShellContent\" + fileName,
                        FileMode.OpenOrCreate))
                {
                    bitmap.SaveJpeg(stream, 173, 173, 0, 100);
                }
            }

            return new Uri(
                "isostore:/Shared/ShellContent/" + fileName, UriKind.Absolute);
        }

        /// <summary>
        /// Transforms bitmap pixels to a non-alpha premultiplied format.
        /// </summary>
        /// <param name="bitmapPixels">The bitmap pixels.</param>
        public static void MakeNonPremultiplied(int[] bitmapPixels)
        {
            int count = bitmapPixels.Length;

            // Iterate through all pixels and
            // make each semi-transparent pixel non-premultiplied
            for (int i = 0; i < count; i++)
            {
                uint pixel = unchecked((uint)bitmapPixels[i]);

                // Decompose ARGB structure from the uint into separate channels

                // Shift by 3 bytes to get Alpha
                double a = pixel >> 24;

                // If alpha is 255 (solid color) or 0 (completely transparent) -
                // skip this pixel.
                if ((a == 255) || (a == 0))
                {
                    continue;
                }

                // Shift 2 bytes and filter out the Alpha byte to get Red
                double r = (pixel >> 16) & 255;

                // Shift 1 bytes and filter out Alpha and Red bytes to get Green
                double g = (pixel >> 8) & 255;

                // Filter out Alpha, Red and Green bytes to get Blue
                double b = (pixel) & 255;

                // Divide by normalized Alpha to get non-premultiplied values
                double factor = 256 / a;
                uint newR = (uint)Math.Round(r * factor);
                uint newG = (uint)Math.Round(g * factor);
                uint newB = (uint)Math.Round(b * factor);

                // Compose back to ARGB uint
                bitmapPixels[i] =
                    unchecked((int)(
                        (pixel & 0xFF000000) |
                        (newR << 16) |
                        (newG << 8) |
                        newB));
            }
        }
    }
}

Answer 2

我遇到了完全相同的问题，但对我来说简单的答案是检查使用的透明 PNG。它被设置为使用 16 位颜色深度。将 PNG 更改为 8 位颜色深度解决了我的问题。