使用itextsharp在PDF中显示图像上的文本

使用itextsharp在PDF中显示图像上的文本

问题描述:

我使用iTextsharp的HTMLWorker生成了PDF。在PDF中我想在图像标记特定区域上显示文本。为此,我使用div标签的位置,但它没有在图像上显示文本,但如果我在浏览器中运行相同的HTML,那么它会在特定位置的图像上显示文本。



我的代码中是否有任何遗漏?或者有没有其他方法可以使用iTextsharp在图像上显示文字?



I have generated a PDF using the HTMLWorker of iTextsharp. In PDF I want to show text on image marking specific area. For that, I have used div tag with the position but it not showing text on the image, but if I run the same HTML in the browser then it shows text on an image on specific location.

Is there anything which I missing in my code? Or is there another way to show text on the image using iTextsharp?

iTextsharp: Version 5.5.13.0



以下是在浏览器中正常工作的HTML:


Below is the HTML which work correctly in browser:

<table style="table-layout:fixed" width="100%" style="font-family:Verdana;font-size:8px;">
    <tr>
        <td align="left"><img src="http://localhost/TheAutoAuction/img/image1.jpg" width="520"></img></td>
    </tr>
</table>
<div id="divArea1" style="position:absolute;left:50px;top:250px;;font-weight:bold;">Area1</div>




当前输出预览:

https ://i.stack.imgur.com/hrRl7.png [ ^ ]



我的尝试:





Current Output Preview:
https://i.stack.imgur.com/hrRl7.png[^]

What I have tried:

StringBuilder sReportHeader = new StringBuilder();

sReportHeader.Append("<table style=\"table-layout:fixed\" width=\"100%\" style=\"font-family:Verdana;font-size:8px;\">" +
                        "<tr>" +
                            "<td align=\"left\">" + @"<img src=\"http://localhost/img/image1.jpg\" width=\"520\"></img></td>" +
                        "</tr>" +
                    "</table>" +
                    "<div id=\"divArea1\" style=\"position:absolute;left:50px;top:250px;font-weight:bold;\">Area1</div>");

MemoryStream workStream = new MemoryStream();
Document document = new Document();
var worker = new HTMLWorker(document);
var pdfWriter = PdfWriter.GetInstance(document, workStream);
document.Open();
worker.StartDocument();
pdfWriter.CloseStream = false;
TwoColumnHeaderFooter twopdf = new TwoColumnHeaderFooter();
pdfWriter.PageEvent = twopdf;
twopdf.OnOpenDocument(pdfWriter, document);
worker.Parse(new StringReader(sReportHeader.ToString()));
worker.EndDocument();
worker.Close();
document.CloseDocument();
document.Close();

byte[] byteInfo = workStream.ToArray();
workStream.Write(byteInfo, 0, byteInfo.Length);
workStream.Position = 0;
pdfWriter.Flush();
pdfWriter.Close();

return new FileStreamResult(workStream, "application/pdf");

两个最重要的设计网页时要记住的规则是:



1。了解用户代理,它的功能,这是怪癖。并非所有浏览器和其他渲染应用程序都以相同的方式呈现HTML,并且它们并不都支持所有可用的HTML / XHTML版本。 20年前,当每个人都在推动网景时,有些东西IE浏览器正确但Navigator嘘声。



2。使用有效标记当HTML / XHTML无效时,您不知道渲染时效果如何;这被称为怪癖模式。并且对于规则#1,不同的用户代理将以不同方式呈现相同的错误。几乎所有浏览器自Firefox 3.x都会不正确地关闭破坏的HTML评论标签。



至于你的问题,它可能是上述两条规则的组合;因为 img 元素无效:
Two of the most important rules to remember in designing a web page are:

1. Know you user agent, it's capabilities, and it's quirks. Not all browsers and other rendering applications will render HTML the same way, and they don't all support all available HTML/XHTML versions. 20 years ago when everyone was pushing Netscape there were things that IE got right but Navigator boinked.

2. Use valid markup When the HTML/XHTML is invalid, you don't know how what the effect will be when it is rendered; this is called quirks mode. And with respect to Rule #1, the different user-agents will render the same error differently. Just about every browser since Firefox 3.x will improperly close broken HTML comment tags.

As for your problem, it could be a combination of the 2 above rules; as your img element will be invalid:
"<td align=\"left\">" + @"<img src=\"http://localhost/img/image1.jpg\" width=\"520\"></img></td>"

应该成为

<td align="left"><img src=\"http://localhost/img/image1.jpg\" width=\"520\"></img></td>

这是不正确的,它是一个元素,意味着没有结束标记它有一些斜线不属于。

尝试使用此

Which is incorrect, it is an empty element meaning there is no closing tag and it has some slashes in it which don't belong.
Try using this

@"<td align=""left""><img src=""http://localhost/img/image1.jpg"" width=""520"" /></td>"

请注意,C#块中的着色没有变化,因为我用 @ 包裹了整行,删除了斜线,& LT;将所有的双引号变为2双引号。



如果将你的html修为100%完美,你可以做些什么来试验。尝试将表中所需的图像作为所需表格或单元格的背景。或尝试别的。



您可能还想尝试查看iTextPDF及其HTML功能/怪癖:

书页:我的HTML必须是有效的XML? [ ^ ]

Notice the coloring doesn't change in the C# blocks as I wrapped the entire line with @, got rid of the slashes, and< made all of the double-quotes into 2-double-quotes.

What you can do if fixing your html to be 100% perfect is to experiment. Try making the image you want in the table be the background for the table or cell you want it is. Or try something else.

You may also want to try looking into iTextPDF and it's HTML capabilities/quirks:
Book page : Does my HTML have to be valid XML?[^]