<fieldset> 和 <legend> 标签在 itext7 中带有 pdfHtml

<fieldset> and <legend> tags with pdfHtml in itext7

使用 HTML 文件,我使用 iText pdfHTML 生成了 PDF 文件。我想为内容提供标题,就像 HTML <fieldset><legend> 所做的那样。

我使用了下面的 HTML 代码。在 HTML 页面中,它按预期显示。但是当使用 pdfHTML 生成 PDF 文件时, "Summary" 出现在框内。不在框的边框中显示内容的标题。

<!DOCTYPE html>
<html>
<body>

 <fieldset>
  <legend>Summary</legend>
  <p>Some paragraph</p>  
 </fieldset>


</body>
</html>

我该如何解决这个问题?

pdfHTML 尚不支持 fieldset 标签,实际上您的示例已转换为如下内容:

您可以将自定义实现插入到 pdfHTML 中,但可以在一定程度上调整视觉外观(取决于您的需要)。这是一个关于如何使用大量假设调整视觉外观的基本示例:

private static class LegendTagWorker extends DivTagWorker {
    public LegendTagWorker(IElementNode element, ProcessorContext context) {
        super(element, context);
    }

    @Override
    public IPropertyContainer getElementResult() {
        IPropertyContainer result = super.getElementResult();
        // Shift the position of the legend a bit above
        result.setProperty(Property.POSITION, LayoutPosition.RELATIVE);
        result.setProperty(Property.TOP, -14);

        // Set the background of the text to white so that it does not overlap with the border of outer element
        if (result instanceof Div && ((Div) result).getChildren().get(0) instanceof Paragraph) {
            Paragraph p = (Paragraph) ((Div) result).getChildren().get(0);
            ((Text)p.getChildren().get(0)).setBackgroundColor(ColorConstants.WHITE);
        }
        return result;
    }
}

private static class CustomTagWorkerFactory extends DefaultTagWorkerFactory {
    @Override
    public ITagWorker getCustomTagWorker(IElementNode tag, ProcessorContext context) {
        if (tag.name().equals("legend")) {
            return new LegendTagWorker(tag, context);
        }
        return super.getCustomTagWorker(tag, context);
    }
}

然后你只需要将你的标签工人工厂传递给转换器属性:

ConverterProperties properties = new ConverterProperties();
properties.setTagWorkerFactory(new CustomTagWorkerFactory());
HtmlConverter.convertToPdf(inFile, outFile, properties);

现在我们得到以下结果:

请注意,这是一个非常基本的示例,您需要根据需要对其进行调整。在 pdfHTML 中实现此功能之前,您必须使用一种解决方法 - 可以按照我的建议在代码中使用,或者您可以使用 CSS 进行一些调整,类似于我在 [=33] 中所做的调整=]代码