自定义NReco.PdfGenerator中的页面编号

huangapple
go评论105阅读模式
英文:

Customize Page Number in NReco.PdfGenerator

问题

目前在页脚已经写了页码，第一页是：第1页，第二页是：第2页，以此类推。

我想要实现的是第一页：第1页，第二页：第3页。

我该如何自定义这些数字？

  1. public void GenerateHtmlToPdf()
  2.  {
  3.    var htmlContent = String.Format("<body>Hello world: {0}</body>",DateTime.Now);
  4.    var htmlToPdf = new NReco.PdfGenerator.HtmlToPdfConverter();
  5.    htmlToPdf.PageFooterHtml = "<table style=/"border-bottom: 1px solid black; width: 100%/"><tr><td class=/"section/"></td><td style=/"text-align:right/">Page <span class=/"page/"></span></td></tr></table>";
  6.    var pdfBytes = htmlToPdf.GeneratePdf(htmlContent);
  7. ...
  8. }
英文:

Currently in footer already write page number which are first page : Page 1, second page : Page 2 and so on.

I am trying to achieve is first page : Page 1 and second page: Page 3.

How can I customize those number?

  1. public void GenerateHtmlToPdf()
  2.  {
  3.    var htmlContent = String.Format("<body>Hello world: {0}</body>",DateTime.Now);
  4.    var htmlToPdf = new NReco.PdfGenerator.HtmlToPdfConverter();
  5.    htmlToPdf.PageFooterHtml = "<table style=/"border-bottom: 1px solid black; width: 100%/"><tr><td class=/"section/"></td><td style=/"text-align:right/">Page <span class=/"page/"></span></td></tr></table>";
  6.    var pdfBytes = htmlToPdf.GeneratePdf(htmlContent);
  7. ...
  8. }

答案1

得分: 1

以下是已翻译的内容：

方法 #1

如果您可以将内容分成两个不同的HTML输入（一个用于第一页，应该从第一页开始，另一个应该从第三页开始），那么您可以使用GeneratePdfFromFiles方法，并为第二个文件指定从第3页开始（使用wkhtmltopdf选项“--page-offset”）：

  1. var htmlToPdf = new NReco.PdfGenerator.HtmlToPdfConverter();
  2. htmlToPdf.GeneratePdfFromFiles(
  3.   new WkHtmlInput[] {
  4.     new WkHtmlInput("first.html") {  
  5.       PageFooterHtml = "<table style=\"border-bottom: 1px solid black; width: 100%\"><tr><td class=\"section\"></td><td style=\"text-align:right;\">Page <span class=\"page\"></span></td></tr></table>" },
  6.     new WkHtmlInput("main.html"){
  7.         CustomWkHtmlPageArgs = " --page-offset 2 ",    // 页码将为：3, 4, 5 等
  8.         PageFooterHtml = "<table style=\"border-bottom: 1px solid black; width: 100%\"><tr><td class=\"section\"></td><td style=\"text-align:right;\">Page <span class=\"page\"></span></td></tr></table>" },
  9.     }
  10.     null, // 可选的封面页 HTML
  11.     "output.pdf"
  12. );

方法 #2

您可以覆盖默认的JS代码（将页码插入到<span class="page"></span>占位符中）在页脚模板中。要了解这个JS代码如何工作，请参考wkhtmltopdf帮助（“Footers And Headers”部分）：https://wkhtmltopdf.org/usage/wkhtmltopdf.txt

以下是一个这种覆盖的示例：

  1. htmlToPdf.PageFooterHtml = @"
  2.     <script>
  3.     window.subst = function() {
  4.         var pageOffset = 20;  // 第一页将成为第21页
  5.         var vars={};
  6.         var x=document.location.search.substring(1).split('&');
  7.         for(var i in x) {var z=x[i].split('=',2);vars[z[0]] = unescape(z[1]);}
  8.         var x=['frompage','topage','page','webpage','section','subsection','subsubsection'];
  9.         for(var i in x) {
  10.             var y = document.getElementsByClassName(x[i]);
  11.             var val = vars[x[i]];
  12.             if (x[i]=='page' && parseInt(val)>1)
  13.                 val = parseInt(val)+1;  // 页码将为：1, 3, 4, 5 等
  14.             for(var j=0; j<y.length; ++j) y[j].textContent = val;
  15.         }
  16.     }
  17.     </script>  
  19.     <table style=\"border-bottom: 1px solid black; width: 100%\"><tr><td class=\"section\"></td><td style=\"text-align:right;\">Page <span class=\"page\"></span></td></tr></table>
  20. ";
英文:

There are 2 ways how you can achieve the desired result:

Approach #1

If you can split your content on 2 different HTML inputs (one for the 1st page which should have page number #1, and another one that should start from page number #3) then you can use GeneratePdfFromFiles method and specify for 2nd file that it should start from page number = 3 (with wkhtmltopdf option "--page-offset"):

  1. var htmlToPdf = new NReco.PdfGenerator.HtmlToPdfConverter();
  2. htmlToPdf.GeneratePdfFromFiles(
  3.   new WkHtmlInput[] {
  4.     new WkHtmlInput(&quot;first.html&quot;) {  
  5. 	    PageFooterHtml = &quot;&lt;table style=/&quot;border-bottom: 1px solid black; width: 100%/&quot;&gt;&lt;tr&gt;&lt;td class=/&quot;section/&quot;&gt;&lt;/td&gt;&lt;td style=/&quot;text-align:right/&quot;&gt;Page &lt;span class=/&quot;page/&quot;&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&quot; },
  6.     new WkHtmlInput(&quot;main.html&quot;){
  7.         CustomWkHtmlPageArgs = &quot; --page-offset 2 &quot;,    // page numbers will be: 3, 4, 5 etc
  8.         PageFooterHtml = &quot;&lt;table style=/&quot;border-bottom: 1px solid black; width: 100%/&quot;&gt;&lt;tr&gt;&lt;td class=/&quot;section/&quot;&gt;&lt;/td&gt;&lt;td style=/&quot;text-align:right/&quot;&gt;Page &lt;span class=/&quot;page/&quot;&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&quot; },
  9. 	}
  10.     null, // optional cover page html
  11. 	&quot;output.pdf&quot;
  12. );

Approach #2

You may override default JS code (that inserts a page number into &lt;span class=&quot;page&quot;&gt;&lt;/span&gt; placeholder) in the footer's template. To get an understanding how this JS code works take a look at the wkhtmltopdf help ("Footers And Headers" section): https://wkhtmltopdf.org/usage/wkhtmltopdf.txt

Here an example of such override:

  1.    htmlToPdf.PageFooterHtml = @&quot;
  2.             &lt;script&gt;
  3. window.subst = function() {
  4. 	var pageOffset = 20;  // first page will become 21
  5. 	var vars={};
  6. 	var x=document.location.search.substring(1).split(&#39;&amp;&#39;);
  7. 	for(var i in x) {var z=x[i].split(&#39;=&#39;,2);vars[z[0]] = unescape(z[1]);}
  8. 	var x=[&#39;frompage&#39;,&#39;topage&#39;,&#39;page&#39;,&#39;webpage&#39;,&#39;section&#39;,&#39;subsection&#39;,&#39;subsubsection&#39;];
  9. 	for(var i in x) {
  10. 		var y = document.getElementsByClassName(x[i]);
  11. 		var val = vars[x[i]];
  12. 		if (x[i]==&#39;page&#39; &amp;&amp; parseInt(val)&gt;1)
  13. 			val = parseInt(val)+1;  // page numbers will be: 1, 3, 4, 5 etc
  14. 		for(var j=0; j&lt;y.length; ++j) y[j].textContent = val;
  15. 	}
  16. }
  17. &lt;/script&gt;  
  18.    
  19.    
  20.  &lt;table style=&quot;&quot;border-bottom: 1px solid black; width: 100%&quot;&quot;&gt;&lt;tr&gt;&lt;td class=&quot;&quot;section&quot;&quot;&gt;&lt;/td&gt;&lt;td style=&quot;&quot;text-align:right&quot;&quot;&gt;Page &lt;span class=&quot;&quot;page&quot;&quot;&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
  21. &quot;;

huangapple
  • 本文由 发表于 2023年6月12日 09:47:35
  • 转载请务必保留本文链接：https://go.coder-hub.com/76453225.html
  • asp.net-core
  • css
  • html
  • javascript
  • nreco
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定