使用itextsharp xmlworker将html转换为pdf并垂直写入文本

Dan*_*iel 10 html c# asp.net itextsharp xmlworker

是否有可能在xmlworker中实现自下而上的文本方向编写?我想在表格中使用它.我的代码是

     <table border=1>
     <tr>
     <td style="padding-right:18px">
          <p style="writing-mode:sideways-lr;text-align:center">First</p</td>
     <td style="padding-right:18px">
          <p style="writing-mode:sideways-lr;text-align:center">Second</p></td></tr>
     <tr><td><p style="text-align:center">1</p>  </td>
         <td><p style="text-align:center">2</p></td> 
     </tr>
        </table>
Run Code Online (Sandbox Code Playgroud)

但它从html转换为pdf后无法正常工作.文本FIRST和SECOND不是从下到上的方向.

kuu*_*nbo 8

这是一个非常有趣的问题,所以+1问题.

第一步是查找iTextSharp XML Worker是否支持该HTML td标记.可以在iTextSharp.tool.xml.html.Tags中的源代码中找到映射.在那里,您会发现td映射到iTextSharp.tool.xml.html.table.TableData,这使得实现自定义标记处理器的工作变得更加容易.即我们需要从类继承并覆盖End():

public class TableDataProcessor : TableData
{
    /*
     * a **very** simple implementation of the CSS writing-mode property:
     * https://developer.mozilla.org/en-US/docs/Web/CSS/writing-mode
     */
    bool HasWritingMode(IDictionary<string, string> attributeMap)
    {
        bool hasStyle = attributeMap.ContainsKey("style");
        return hasStyle
                && attributeMap["style"].Split(new char[] { ';' })
                .Where(x => x.StartsWith("writing-mode:"))
                .Count() > 0
            ? true : false;
    }

    public override IList<IElement> End(
        IWorkerContext ctx,
        Tag tag,
        IList<IElement> currentContent)
    {
        var cells = base.End(ctx, tag, currentContent);
        var attributeMap = tag.Attributes;
        if (HasWritingMode(attributeMap))
        {
            var pdfPCell = (PdfPCell) cells[0];
            // **always** 'sideways-lr'
            pdfPCell.Rotation = 90;
        }
        return cells;
    }
}
Run Code Online (Sandbox Code Playgroud)

正如内联评论中所述,这是一个非常简单的实现,可满足您的特定需求.您需要添加额外的逻辑来支持任何其他写入模式 CSS属性值,并包括任何健全性检查.

UPDATE

根据留下的评论@Daniel,目前还不清楚如何添加自定义的CSS转换时HTMLPDF.首先是更新的HTML:

string XHTML = @"
<h1>Table with Vertical Text</h1>
<table><tr>
<td style='writing-mode:sideways-lr;text-align:center;width:40px;'>First</td>
<td style='writing-mode:sideways-lr;text-align:center;width:40px;'>Second</td></tr>
<tr><td style='text-align:center'>1</td>
<td style='text-align:center'>2</td></tr></table>

<h1>Table <u>without</u> Vertical Text</h1>
<table width='50%'>
<tr><td class='light-yellow'>0</td></tr>
<tr><td>1</td></tr>
<tr><td class='light-yellow'>2</td></tr>
<tr><td>3</td></tr>
</table>";
Run Code Online (Sandbox Code Playgroud)

然后是一小段自定义CSS:

string CSS = @"
    body {font-size: 12px;}
    table {border-collapse:collapse; margin:8px;}
    .light-yellow {background-color:#ffff99;}
    td {border:1px solid #ccc;padding:4px;}
";
Run Code Online (Sandbox Code Playgroud)

稍微有些困难的部分是额外的设置 - 你不能使用XMLWorkerHelper.GetInstance().ParseXHtml()SO 中常见的简单开箱即用.这是一个简单的帮助方法,可以帮助您入门:

public void ConvertHtmlToPdf(string xHtml, string css)
{
    using (var stream = new FileStream(OUTPUT_FILE, FileMode.Create))
    {
        using (var document = new Document())
        {
            var writer = PdfWriter.GetInstance(document, stream);
            document.Open();

            // instantiate custom tag processor and add to `HtmlPipelineContext`.
            var tagProcessorFactory = Tags.GetHtmlTagProcessorFactory();
            tagProcessorFactory.AddProcessor(
                new TableDataProcessor(), 
                new string[] { HTML.Tag.TD }
            );
            var htmlPipelineContext = new HtmlPipelineContext(null);
            htmlPipelineContext.SetTagFactory(tagProcessorFactory);

            var pdfWriterPipeline = new PdfWriterPipeline(document, writer);
            var htmlPipeline = new HtmlPipeline(htmlPipelineContext, pdfWriterPipeline);

            // get an ICssResolver and add the custom CSS
            var cssResolver = XMLWorkerHelper.GetInstance().GetDefaultCssResolver(true);
            cssResolver.AddCss(css, "utf-8", true);
            var cssResolverPipeline = new CssResolverPipeline(
                cssResolver, htmlPipeline
            );

            var worker = new XMLWorker(cssResolverPipeline, true);
            var parser = new XMLParser(worker);
            using (var stringReader = new StringReader(xHtml))
            {
                parser.Parse(stringReader);
            }
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

而不是重复上面的示例代码的解释,请参阅文档(iText删除文档,链接到Wayback Machine),以更好地了解为什么需要以这种方式设置解析器.

另请注意:

  1. XML Worker 支持所有CSS2/CSS3属性,因此您可能需要试验哪些有效或不可用,以及您希望PDF与浏览器中显示的HTML的接近程度.
  2. HTML代码段删除了p代码,因为该样式可以直接应用于td代码.
  3. 内联width属性.如果省略,则列将是可变宽度,如果文本已水平呈现则匹配.

使用iTextSharp和XML Worker版本5.5.9进行测试以下是更新的结果:

在此输入图像描述