如何生成(XHTMLRenderer)和iText生成页眉/页脚?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (615)

我意识到这个问题之前就有人问过(我看了所有的解决方案,都试过了),但我仍然试图生成一个PDF文档,其中包含页眉和页脚,在每一页上重复。

我在用flying saucerR8iText2.0.8我尝试过许多不同的方法来使它起作用,但到目前为止都没有用。

标头中div包含2个其他div与图像和我的页脚只是为了页编号。将html放入StringBuffer叫BUF。

buf.append("<head>");
    buf.append("<title>blabla</title> ");
    buf.append("<style type='text/css' media='print'>  ");
    buf.append("@page { size:8.5in 11in; padding:1em; @bottom-left { content: element(footer); } } ");
    buf.append("#footer { font-size: 90%; font-style: italic;  position: running(footer); top: 0; left: 0; }");
    buf.append("#pagenumber:before { content: counter(page); } ");
    buf.append("#pagecount:before { content: counter(pages); } ");
buf.append("</style></head>");
buf.append("<body>");
 buf.append("<div class='header' style='clear:both;'>");
    buf.append("<div id='moneyLogo' style='float:left'>"); 
    buf.append("<img src='logo.jpg' alt='Some alt text' />");
    buf.append("</div>");
    buf.append("<div id='canLogo' style='float:right'>");
    buf.append("<img src='someImg.gif' alt='alt text' />");
    buf.append("</div>");
    buf.append("<h3 style='text-align:center; clear:both;'>alt text</h3>");
    buf.append("<div style='text-align:center;'>");
    buf.append("Some texy text");
    buf.append("<br />"););
    buf.append("</div>");
    buf.append("</div><br /><br />");
buf.append("<div id='footer'>  Page <span id='pagenumber'/> of <span id='pagecount'/> </div>");

    buf.append("</body>");
    buf.append("</html>");

我用pdf生成的,除了标题只出现在第一页和页脚只出现在最后一页的底部。当我将html通过w3c验证器时,结果很好,但是当我使用它们的css验证器时,它说它们是行中的解析错误。@page { size:8.5in 11in; padding:1em; @bottom-left { content: element(footer); } }

提问于
用户回答回答于

下面是一个有用的例子:

package com.sg2net.test;

import java.io.FileNotFoundException;
import java.io.FileOutputStream;

import org.xhtmlrenderer.pdf.ITextRenderer;

import com.lowagie.text.DocumentException;

public class XHTMLRenderer8 {

    /**
     * @author Giovanni Cuccu
     */
    public static void main(String[] args) throws FileNotFoundException, DocumentException {
        ITextRenderer renderer = new ITextRenderer();
        String content="<html><head><style>\n" +
          "div.header {\n" +
          "display: block; text-align: center;\n" + 
          "position: running(header);}\n" +
          "div.footer {\n" +
          "display: block; text-align: center;\n" + 
          "position: running(footer);}\n" +
          "div.content {page-break-after: always;}" +
          "@page { @top-center { content: element(header) }}\n " +
          "@page { @bottom-center { content: element(footer) }}\n" +
          "</style></head>\n" +
          "<body><div class='header'>Header</div><div class='footer'>Footer</div><div class='content'>Page1</div><div>Page2</div></body></html>";
        renderer.setDocumentFromString(content);
        renderer.layout();
        renderer.createPDF(new FileOutputStream("test.pdf"));

    }

}

这是使用以下XHTML文档

<html>
<head>
<style>
div.header {
    display: block; text-align: center; 
    position: running(header);
}
div.footer {
    display: block; text-align: center;
    position: running(footer);
}
div.content {page-break-after: always;}
@page {
     @top-center { content: element(header) }
}
@page { 
    @bottom-center { content: element(footer) }
}
</style>
</head>
<body>
    <div class='header'>Header</div>
    <div class='footer'>Footer</div>
    <div class='content'>Page1</div>
    <div>Page2</div>
</body>
</html>
用户回答回答于

你可以控制:

  • 页眉高度通过编辑边距-顶部;
  • 页脚高度通过编辑边距-底部;
  • 通过编辑div.content宽度来增加内容宽度。

页号显示在页脚处。

见以下代码:

<html>
<head>
<style>

@page{

    @bottom-left {                 
        content: element(footer);  
        vertical-align: top;
        padding-top: 10px;
/*      border: solid red;    */
    }

    @top-right {
        content: element(header); 
        vertical-align: bottom;
        padding-bottom: 10px;
/*          border: solid green;   */
    }

    size: A4 portrait;
    margin-top:5.5cm; 
    margin-left:3cm; 
    margin-right:2cm; 
    margin-bottom:3.3cm; 
}

div.header {
    display: block;                     
    position: running(header);
    border-bottom: 1px solid black;
}

div.footer {
    margin-top: 0.5cm;
    display: block;
    position: running(footer);
    border-top: 1px solid black; 
}

div.content {
/*  border: solid purple;  */
    display: block;
    width: 15.4cm; 
    text-align: justify;
}

#pagenumber:before {
    content: counter(page);
}

#pagecount:before {
    content: counter(pages);
}

</style>
</head>
<body>

    <div class="header">
        This is the header that will repeat on every page at top
    </div>

    <div class="footer" >
        <p>This is the footer that will repeat on every page at bottom</p>
        <p>Page <span id="pagenumber"></span> of <span id="pagecount"></span></p>/
    </div>

    <div class="content">
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
        <p>This is the content</p><p>This is the content</p><p>This is the content</p>
    </div>

</body>
</html>

扫码关注云+社区

领取腾讯云代金券