首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何使用pdfHtml和iText 7删除表单元格

如何使用pdfHtml和iText 7删除表单元格
EN

Stack Overflow用户
提问于 2020-07-29 09:49:32
回答 2查看 298关注 0票数 0

我在试着显示一个划过的表格格。

我试过几十种不同的方法。

我最好的解决方案是使用四个线性梯度,每个角落一个(因为不支持透明背景)。

这里的问题是,我必须指定表单元格的高度,因此,当同一行中任何其他单元格中的文本有比预期更多的行时,交叉不再是从一个角到另一个角。

我还尝试使用background-imagebackground-size设置为100% 100%。但是,pdfHtml不支持background-size

我尝试过多种在Chrome中工作的解决方案,但没有一个在pdfHtml中工作。

有人知道(可能的)解决办法吗?

谢谢,

-祖祖泰--

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2020-07-30 22:15:16

pdfHTML最终使用了iText的布局机制,这是相当灵活的。您可以通过自定义单元格的呈现逻辑并将该实现插入pdfHTML来实现您的最终目标。

首先,自定义单元格渲染器:

代码语言:javascript
复制
private static class CustomCellRenderer extends CellRenderer {
    public CustomCellRenderer(Cell modelElement) {
        super(modelElement);
    }

    @Override
    public IRenderer getNextRenderer() {
        return new CustomCellRenderer((Cell) modelElement);
    }

    @Override
    public void drawBackground(DrawContext drawContext) {
        super.drawBackground(drawContext);
        PdfCanvas canvas = drawContext.getCanvas();
        Rectangle area = getOccupiedAreaBBox();
        canvas.moveTo(area.getLeft(), area.getTop()).lineTo(area.getRight(), area.getBottom());
        canvas.moveTo(area.getLeft(), area.getBottom()).lineTo(area.getRight(), area.getTop());
        canvas.stroke();
    }
}

本质上,我们重用了默认实现,并通过从左下角到右上角以及从左上角到右下角绘制一条线来扩展它。

现在,我们需要为在pdfHTML中创建的布局对象使用自定义呈现程序。它们是在标记工作器中创建的,因此为表单元格自定义标记工作人员:

代码语言:javascript
复制
private static class CustomTdTagWorker extends TdTagWorker {
    public CustomTdTagWorker(IElementNode element,
            ProcessorContext context) {
        super(element, context);
    }

    @Override
    public IPropertyContainer getElementResult() {
        IPropertyContainer cell = super.getElementResult();
        if (cell instanceof Cell) {
            ((Cell) cell).setNextRenderer(new CustomCellRenderer((Cell) cell));
        }
        return cell;
    }
}

缺少的部分是,我们需要配置pdfHTML以使用<td>单元格的自定义标记工作者,以及创建自定义标记工人工厂的方法:

代码语言:javascript
复制
private static class CustomTagWorkerFactory extends DefaultTagWorkerFactory {
    @Override
    public ITagWorker getCustomTagWorker(IElementNode tag, ProcessorContext context) {
        if (TagConstants.TD.equals(tag.name())) {
            return new CustomTdTagWorker(tag, context);
        }
        return super.getCustomTagWorker(tag, context);
    }
}

唯一缺失的部分是将自定义标记工人工厂传递给pdfHTML本身,这是通过转换器属性完成的:

代码语言:javascript
复制
HtmlConverter.convertToPdf(inFile, outFile, new ConverterProperties().setTagWorkerFactory(new CustomTagWorkerFactory()));

以下HTML的代码:

代码语言:javascript
复制
<html>
<head>
    <style>
        td, th {
            border: solid 1px;
        }
    table {
      border-collapse: collapse;
    }
    </style>
</head>
<body>
<table>
  <tbody>
    <tr>
    <td>Cell 1</td>
    <td>Cell 2</td>
   </tr>
   <tr>
    <td>Another cell 1</td>
    <td>Another cell 2</td>
   </tr>
  </tbody>
  <tfoot>
    <td>
      Footer 1
    </td>
    <td>
      Footer 2
    </td>
  </tfoot>
</table>
</body>
</html>

在转换为PDF后,我得到了以下可视化结果:

票数 0
EN

Stack Overflow用户

发布于 2020-07-29 10:13:18

你试过用svg吗?在没有background-size属性的情况下也应该工作。

代码语言:javascript
复制
.diag {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' preserveAspectRatio='none' viewBox='0 0 100 100'><path d='M1 0 L0 1 L99 100 L100 99' fill='black' /><path d='M0 99 L99 0 L100 1 L1 100' fill='black' /></svg>");
  background-repeat: no-repeat;
  background-position: center center;
  border: 1px solid red;
}
代码语言:javascript
复制
<div style="background-color: blue;">
  <div class="diag" style="width: 300px; height: 100px;"></div>
</div>

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/63150893

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档