web-dev-qa-db-ja.com

Flying Saucerを使用して、フッターのすべてのページにページ番号とページ合計を含むPDFを生成するにはどうすればよいですか?

自分で考え出すよりも少し多くの調査が必要だったので、ここで包括的な答えを投稿します。これを行うための情報は多くの異なるWebサイトに広がっているようで、1か所にまとめたいと思います。 この答えmayは同じことですが、Java文字列に含まれているため、目が眩んでしまいますhtmlテンプレートではありません。ここに質問があります:

私はPDFをレンダリングしていて、ページの下部に "Page n of m"というフッターが必要です。ここで、 "n"は表示しているページ番号、 "m"はドキュメントの合計ページ。それ、どうやったら出来るの?

27
Daniel Kaplan

もう少し簡潔な方法を試すこともできます。

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

これをcss/styleに入れる必要があり、フッターHTML要素を追加する必要はありません。

24
John Mark

あなたのhtmlでは、これをbodyタグのどこかに置く必要があります:

<div id="footer">
    page <span id="pagenumber"></span> of <span id="pagecount"></span>
</div>

そして、これはあなたのCSS /スタイルでなければなりません:

    #footer {
        position: running(footer);
        text-align: right;
    }

    @page {
        @bottom-right {
            content: element(footer);
        }
    }

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

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

あなたはそれについてもっと学ぶことができます@bottom-rightオプション ここ

33
Daniel Kaplan

@John Markの解決策は私にとってうまくいきました。私のアプリケーションでは、HTMLにスタイル情報を埋め込む必要があったので、これを<style>タグで囲み、<head>の前の<title>の前に配置しました。多分その情報は他の誰かに役立つでしょう。

2
Matt Morgan

重要なエラーと解決策!

初心者にとって、以下のJohn Markのソリューションを使用することは、それを機能させる正しい方法です。

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

ただし、多くの人が次の問題に遭遇した可能性があります=PDFの生成が停止しました!

これは[〜#〜] version [〜#〜] of FLYING SAUCER。を更新することで解決します

私が実行していた9.1.4ときPDF @ page&@ bottom-right cssコードが原因で生成が停止しました。

これはFlying Saucerの不具合でしたが、バージョン9.1.5で修正されました!

必ず9.1.5に更新し、John Markの回答を使用してください。

2
Adrian Higgins