在 WebBrowser 控件中打印水印背景图像答案

【问题标题】：Print watermark background Image in WebBrowser control在 WebBrowser 控件中打印水印背景图像
【发布时间】：2020-03-21 19:52:01
【问题描述】：

我想在我的 html 文档中添加透明水印背景图像并打印出来。为此，我使用 svc data uri 创建了以下背景图片：

body {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%20%3D%20%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20version%20%3D%20%271.1%27%20height%20%3D%20%27100px%27%20width%20%3D%20%27100px%27%3E%3Ctext%20transform%20%3D%20%27translate(20%2C%20100)%20rotate(-45)%27%20fill%20%3D%20%27rgb(245%2C45%2C45)%27%20font-size%20%3D%20%2720%27%3E%20watermark%20%3C%2Ftext%3E%3C%2Fsvg%3E");
}

要使用 WebBrowser 控件打印背景图像，我尝试了这篇文章：How to print background image and styles in WebBrowser control。但由于 IE 的限制，它似乎没有打印我的 data-uri svc 图像。

如何在 WebBrowser 控件中打印水印背景图片？

这是我尝试过的替代解决方案。

我尝试在网络浏览器中静默打印转换为图像的 HTML，但它打印的是空白页面。为此，我使用了 HTMLRenderer 是一个 nuget 包。参考这个answer。

public MemoryStream ConvertHtmlToImage(string html)
{
    Bitmap m_Bitmap = new Bitmap("image");
    HtmlRender.RenderGdiPlus(Graphics.FromImage(m_Bitmap),
                                           html);
    MemoryStream memoryStream = new MemoryStream();

    m_Bitmap.Save(memoryStream, System.Drawing.Imaging.ImageFormat.Png);
    return memoryStream;

}

MemoryStream HtmlImage = ConvertHtmlToImage(processedDocTest);
webBrowserTest = new System.Windows.Forms.WebBrowser();
webBrowserTest.DocumentStream = HtmlImage; //Assign the image as a stream

private void btn_print_test_Click(object sender, EventArgs e)
{
    if (Common.TestPrinter != null && !string.IsNullOrEmpty(Common.TestPrinter))
    {
        SetupPage();
        SetDefaultPrinter(Common.TestPrinter);
    }
    PrinterSettings settings = new PrinterSettings();
    defaultPrinter = settings.PrinterName;

    if (Common.TestPrinter == defaultPrinter)
    {
        PrintTest();
    }
    else
    {
        ResetSetupPage();
        Environment.Exit(1);
    }
}

【问题讨论】：

您用来打印图像的代码在哪里？我只看到 PrintTest()，我假设这是打印测试页（可能是空的）？
链接的帖子显示了如何使用 WebBropwser 控件成功地进行静默打印。如果您加载 bing.com（包含背景图像），链接帖子的 cmets 中已经讨论过它，您将看到它按预期工作。它是链接问题的后续行动吗？
@RezaAghaei 这是一个后续问题，在我意识到 IE 仅限打印 SVG 作为背景图像后，我决定将整个 html 文档转换为图像以静默打印，以便我可以克服这个限制。因此，对于图书馆，我编辑了问题以引用它，并且 U 在以前与此上下文相关的问题中帮助了我很多（我非常感激），所以 html 是一个简单的 html 文档，包含 svg 作为背景对于相关问题中的正文（水印），我将整个文档转换为图像，以便我可以打印它。

标签： c# html .net winforms webbrowser-control

【解决方案1】：

Internet Explorer 可以很好地显示 svg 数据 uri 背景图像，但在打印 svg 数据 uri 背景图像时效果不佳。

要轻松打印背景图像，您可以使用 svg 图像而不是数据 uri，或者如果出于某种原因，您想使用数据 uri，然后使用透明的 png 数据 uri 作为背景图像。

在这篇文章中，我假设您想在运行时生成文本的透明 png 图像，并使用数据 uri 格式将该图像用作页面的背景图像。

这里是答案的组成部分：

在运行时从文本创建透明图像
将图像转换为数据uri
在 WebBrowser 控件中启用打印背景
打印 WebBrowser 控件而不显示打印对话框

这样打印：

在运行时从文本创建透明图像

此方法接受文本、字体、文本颜色和图像大小，然后生成图像：

public Image CreateWatermarkImage(string text, Font font, Color color, Size size)
{
    var bm = new Bitmap(size.Width, size.Height, PixelFormat.Format32bppArgb);
    using (var g = Graphics.FromImage(bm))
    {
        g.TextRenderingHint = System.Drawing.Text.TextRenderingHint.AntiAlias;
        g.RotateTransform(45);
        var format = new StringFormat();
        format.Alignment = StringAlignment.Center;
        using (var brush = new SolidBrush(color))
            g.DrawString(text, font, brush, new Rectangle(Point.Empty, size), format);
    }
    return bm;
}

将图像转换为数据uri

该方法获取图片并将其转换为数据uri：

public static string GetDataURL(Image image)
{
    var bytes = (byte[])new ImageConverter().ConvertTo(image, typeof(byte[]));
    return $"data:image/png;base64,{Convert.ToBase64String(bytes)}";
}

在 WebBrowser 控件中启用打印背景

正如我在关于Print Background Image in WebBrowser 的链接答案中已经解释的那样，您需要更改注册表中的设置。（阅读链接的帖子了解更多详情。）

public void EnablePrintBackground(bool value)
{
    using (var key = Microsoft.Win32.Registry.CurrentUser.OpenSubKey(
        @"Software\Microsoft\Internet Explorer\PageSetup", true))
    {
        key.SetValue("Print_Background", value ? "yes" : "no",
            Microsoft.Win32.RegistryValueKind.String);
        key.Close();
    }
}

打印 WebBrowser 控件而不显示打印对话框

正如我在另一篇关于Print WebBrowser control without showing Print Dialog 的帖子中解释的那样，只需使用Web 浏览器控件的Print() 方法即可。（您可以在链接的帖子中阅读更多详细信息。）

webBrowser1.Print();

将所有内容放在一个示例中

在这里，我将所有东西放在一起打印一个在运行时具有数据 uri 透明背景图像的 html：

private void Form1_Load(object sender, EventArgs e)
{
    var dataURL = "";
    using (var image = CreateWatermarkImage("Watermark!",
        new Font("Arial", 16, FontStyle.Bold), Color.Red, new Size(150, 150)))
    {
        dataURL = GetDataURL(image);
    }
    var html = $@"
        <html>
            <head>
                <style>body {{background-image: url(""{dataURL}"");}}</style>
            </head>
            <body>
                <h1>Lorem ipsum dolor sit amet</h1> 
                consectetur adipiscing elit, 
                sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
                Ut enim ad minim veniam, quis nostrud exercitation ullamco 
                laboris nisi ut aliquip ex ea commodo consequat. 
                Duis aute irure dolor in reprehenderit in voluptate velit 
                esse cillum dolore eu fugiat nulla pariatur. Excepteur sint 
                occaecat cupidatat non proident, sunt in culpa qui officia 
                deserunt mollit anim id est laborum.
            </body>
        </html>";
    webBrowser1.DocumentText = html;
    webBrowser1.DocumentCompleted += (obj, args) =>
    {
        EnablePrintBackground(true);
        webBrowser1.Print();
    };
}

结果如下：

【讨论】：

【解决方案2】：

使用此代码：

public void ConvertHtmlToImage(string html)
{
Bitmap m_Bitmap = new Bitmap(400, 600);
PointF point = new PointF(0, 0);
SizeF maxSize = new System.Drawing.SizeF(500, 500);
HtmlRenderer.HtmlRender.Render(Graphics.FromImage(m_Bitmap),html,
                                        point, maxSize);

m_Bitmap.Save(@"C:\MyHtml.png", ImageFormat.Png);
}

【讨论】：