将html转换为PDF时,未在iTextSharp中设置表格宽度

时间:2015-09-24 15:36:23

标签: pdf-generation itextsharp pdf-conversion

我正在尝试将html转换为pdf,但我面临的问题是html表标签宽度未正确设置..

这是我的HTML

<table cellpadding='4' cellspacing='4' border='0' width='100%' style='width:100%'>
    <tr style='background-color:#000000'>
        <td colspan='2' align='center' valign='middle' width='100%'>
            <font face='Calibri' size='6' color='#FFFFFF'>Retail Natural Gas Deal Sheet</font>
        </td>
    </tr>
    <tr>
        <td colspan='2' width='100%'>&nbsp;</td>
    </tr>
    <tr>
        <td width='90%' style='width:90%'>
            <table cellpadding='0' cellspacing='0' border='0' width='100%'>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='4'>
                            <b>Deal Number</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='4'>
                            <b>15RTLG7149</b>
                        </font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Trade Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Price Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Authorize Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
            </table>
        </td>
        <td width='10%' style='width:10%' valign='top'>
            <table cellpadding='0' cellspacing='0' border='0' width='100%'>
                <tr>
                    <td colspan='2' align='center' width='100%'>
                        <font face='Calibri' size='2'>
                            <b>Volumes (MMMBtu)</b>
                        </font>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

这是我用来生成pdf的c#代码

        Document pdfDoc = new Document();
        //Document pdfDoc = new Document(PageSize.A4, 10f, 10f, 10f, 0f);
        //HTMLWorker htmlparser = new HTMLWorker(pdfDoc);
        using (MemoryStream memoryStream = new MemoryStream())
        {
            PdfWriter writer = PdfWriter.GetInstance(pdfDoc, memoryStream);
            pdfDoc.Open();
            XMLWorkerHelper.GetInstance().ParseXHtml(writer, pdfDoc, new StringReader(HTML));
            pdfDoc.Close();
            byte[] bytes = memoryStream.ToArray();
            memoryStream.Close();

            return bytes;
        }

但这是它在pdf中呈现的方式..我无法找到正确的答案..我需要帮助..在此先感谢..

http://i.stack.imgur.com/8WyBh.jpg

1 个答案:

答案 0 :(得分:3)

我已将HTML复制粘贴到文本编辑器(Notepad ++;在下面的屏幕截图中标记为1)。我在浏览器中打开了这个HTML(Chrome;在下面的屏幕截图中标记为2)。我已将HTML转换为PDF(使用XML Worker; PDF在下面的屏幕截图中标记为3)。

enter image description here

当我将浏览器中看到的内容与我在PDF中看到的内容进行比较时,我的印象是iText的XML Worker正在做得很好。我在浏览器中看到的内容与我在PDF中看到的内容之间没有太大区别。

但是,当我查看您的HTML时,我发现不一致。您是否尝试在浏览器中查看HTML?它看起来并不像你期望的那样,是吗?似乎问题不是由iText引起的,而是由您创建HTML的方式引起的。请告诉我们HTML是否与浏览器中的预期方式相符。如果没有,请解释您的期望。现在,我很难理解这个问题,因为我在PDF中看到的内容与我在浏览器中看到的内容非常吻合。

<强>更新

在你的问题中,你没有添加任何边框(border='0'),很难看出你的意思。我现在添加了边框,因此HTML看起来像这样:

enter image description here

您希望PDF看起来像这样:

enter image description here

如果您像这样简化HTML,这非常简单:

<table cellpadding='4' cellspacing='4' border='1' width='100%' style='width:100%'>
    <tr style='background-color:#000000'>
        <td colspan='2' align='center' valign='middle'>
            <font face='Calibri' size='6' color='#FFFFFF'>XXXX XXXXX XXXXX</font>
        </td>
    </tr>
    <tr>
        <td colspan='2'>&nbsp;</td>
    </tr>
    <tr>
        <td width='90%' style='width:90%'>
            <table cellpadding='0' cellspacing='0' border='1' width='100%'>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='4'>
                            <b>Deal Number</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='4'>
                            <b>XXXXXXXXXX</b>
                        </font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Trade Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Price Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td width='42%'>
                        <font face='Calibri' size='2'>
                            <b>Authorize Date</b>
                        </font>
                    </td>
                    <td width='1%'>&nbsp;</td>
                    <td width='57%'>
                        <font face='Calibri' size='2'>February 09, 2015</font>
                    </td>
                </tr>
                <tr>
                    <td colspan='3' width='100%'>&nbsp;</td>
                </tr>
            </table>
        </td>
        <td width='10%' style='width:10%' valign='top'>
            <table cellpadding='0' cellspacing='0' border='1' width='100%'>
                <tr>
                    <td colspan='2' align='center' width='100%'>
                        <font face='Calibri' size='2'>
                            <b>Xxxxxxx (XXXXXXX)</b>
                        </font>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

我改变了什么?我删除了width='100%'标记<td>中的colspan='2'。这个信息含糊不清:你说两列一起应该占宽度的100%。但是:

  • 您已在<table>标记中定义了此内容,其中您还有width='100%'
  • 如果单元格有colspan 2并且您说该单元格应占宽度的100%,则无法分辨每列的宽度。将width='100%'放在那里是没有意义的。

iTextSharp根据第一行定义列的宽度,可以找到有关宽度的信息。在这种情况下,第一行宽度这样的信息是在具有2列的表中具有colspan 2的行。您将这两列的宽度组合为100%,iTextSharp将其解释为您想要说每列占宽度的50%(100%/ 2)。

如果删除这个不明确的信息,iText将根据第三行中定义的宽度(这是您所期望的)定义列的宽度。