Question

大家好，感谢您的提前帮助。我正在学习iText 7，并正在创建一个应用程序，该应用程序从URL提取网页并将其转换为PDF。我已经完成了非常基本的工作，即抓取页面，将其转换为PDF，然后将其写入磁盘。接下来，我要添加页眉和页脚以及y的Page x。我尝试过：

        @media print {
        @page {
            size: 8.5in 5.5in portrait;
            margin-left: 0.5cm;
            margin-right: 0.5cm;
            margin-bottom: .5cm;
            padding-bottom: 3.5cm;
            background: #FFF;
        }

        thead { display: table-header-group; }
        tfoot { display: table-footer-group; }
    }

这似乎在每页上都放置了页眉和页脚，尽管文档的最后一页的页脚位于最后一个元素的显示位置之后（不理想）。由于我要抓取页面，因此我不确定如何添加页码和计数。所以我的问题是如何解决这个问题，即我应该坚持使用媒体查询，还是生成PDF，使用某种类型的处理程序插入页眉和页脚（或者在创建初始文件）。我现在有一些关于分页的教程，但没有与转换网页结合使用，因此我对如何进行感到困惑（可能不必要）。任何帮助将不胜感激。

我尝试过：

        @media print {
        @page {
            size: 8.5in 5.5in portrait;
            margin-left: 0.5cm;
            margin-right: 0.5cm;
            margin-bottom: .5cm;
            padding-bottom: 3.5cm;
            background: #FFF;

        @bottom-right {
        content: "Page " counter(page) " of " counter(pages);
        }   
        }

        thead { display: table-header-group; }
        tfoot { display: table-footer-group; }
    }

，但是在HTML或转换的PDF上均不显示页码。我需要使用：thead { display: table-header-group; } tfoot { display: table-footer-group; } to force the header and footer to display on each page. Obviously I'm not handling this correctly, but don't know what to try next.

`

在此处输入代码

Answer 1

您需要页面页眉和页脚，但是在CSS上，我看不到您在任何地方定义页面页眉或页脚（<thead>和<tfoot>用于表，而不是页面）。您想在每个页面中添加“ Y的第X页”，但是我看不到您在任何地方定义该内容。

请阅读有关将HTML转换为PDF的教程的Chapter 2。在其中一个示例中，您将看到：

@page {
    @bottom-right {
        content: "Page " counter(page) " of " counter(pages);
    }
}

这将在每个页面的右下角定义一个页脚，内容为“ X的页面Y”，其中X将是当前页面，Y总页数。

详细了解@page rule，您会发现还可以定义@bottom-left，@bottom-center，@top-left等。

还要知道您使用@media print的事实，这意味着如果定义了正确的媒体查询，iText只会查看这些括号之间的内容。请参阅本教程的Chapter 3。

最终更新：

我从tutorial举了以下示例：C03E02_Print

public static void main(String[] args) throws IOException {
    File file = new File(TARGET);
    file.mkdirs();
    new Kmcnet().createPdf(BASEURI, SRC, DEST);
}

public void createPdf(String baseUri, String src, String dest) throws IOException { 
    ConverterProperties properties = new ConverterProperties();
    properties.setBaseUri(baseUri);
    MediaDeviceDescription mediaDeviceDescription = new MediaDeviceDescription(MediaType.PRINT);
    properties.setMediaDeviceDescription(mediaDeviceDescription);
    HtmlConverter.convertToPdf(new FileInputStream(src), new FileOutputStream(dest), properties);
}

我进入了sxsw.html页面，并像这样更改了sxsw_print.css：

@page {
    @top-left {
        content: "HEADER";
    }
    @top-center {
        content: "READ THE TUTORIAL";
    }
    @top-right {
        content: "kmcnet";
    }
    @bottom-left {
        content: "FOOTER";
    }
    @bottom-center {
        content: "Page " counter(page) " of " counter(pages);
    }
    @bottom-right {
        content: "The end";
    }
}

我运行了代码，这就是结果：

OP，kmcnet声称页面上没有“ Y的第X页”，但是如果仔细观察，您可以在页面中间看到“第1页，共2页”和“第2页，共2页”。屏幕截图的页面底部。此外，kmcnet声称不可能在页眉或页脚中添加客户名称，但是如果您查看屏幕截图，您会在页面的右上角清楚地看到“ kmcnet”。

然后，我获取了movies2.html文件，并像这样更改了内联CSS：

<style>
@media print {
    @page {
        @top-left {
            content: "HEADER";
        }
        @top-center {
            content: "READ THE TUTORIAL";
        }
        @top-right {
            content: "kmcnet";
        }
        @bottom-left {
            content: "FOOTER";
        }
        @bottom-center {
            content: "Page " counter(page) " of " counter(pages);
        }
        @bottom-right {
            content: "The end";
        }
    }
}
</style>

我在该HTML上运行了C03E02_Print示例，结果显示了相似的页眉和页脚：

最初的问题是：

接下来，我要添加页眉和页脚以及y的Page x。

我认为我的答案和教程充分说明了如何执行此操作。不幸的是，OP坚持说我的答案不起作用，也没有教程中写的内容。

我将这个问题列为题外，更具体地讲，是一个无法重现的问题：

Answer 2

我能够通过修改html标头中的css样式来创建自定义页脚。此示例与ASP.NET MVC一起使用。在视图中动态填充样式。如果每个客户的页脚都不同，则最好为每个客户生成一个pdf文件，然后合并它们。

剃刀视图

@model YourNamespace.ViewModels.XYZViewModel
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <style type="text/css">
        @@page {
            @@bottom-left {
                content: "@Model.FullName";
            }

            @@bottom-center {
                content: "@DateTime.Now.ToShortDateString()";
            }

            @@bottom-right {
                content: "Page " counter(page);
            }
        }
    </style>
</head>
...............

然后可以将视图生成为HTML

public static string RenderView<TModel>(this Controller controller, string viewName, TModel model)
        {
            using (var sw = new StringWriter())
            {
                controller.ViewData.Model = model;
                var viewResult = ViewEngines.Engines.FindView(controller.ControllerContext, viewName, "");
                var viewContext = new ViewContext(controller.ControllerContext, viewResult.View, controller.ViewData, controller.TempData, sw);
                viewResult.View.Render(viewContext, sw);
                viewResult.ViewEngine.ReleaseView(controller.ControllerContext, viewResult.View);
                return sw.GetStringBuilder().ToString();
            }
        }

在控制器中将视图呈现为HTML的调用

string html = this.RenderView(@"~\Views\Folder\ViewName.cshtml", viewModel);

将页眉，页脚和页码添加到已转换为PDF的HTML页面iText 7

2 个答案: