[salesforce]VisualforceでPDF生成時の縦横サイズ設定

By |11月 19, 2009|salesforce, |


Visualforceの<apex:page renderas=”pdf”>を使ってPDF出力をする場合には色々と制約があるようですが、その中のPDFの縦横サイズ設定方法のご紹介。

通常PDFはこんな感じで出力されます。
ws000109

このVisualforceページのCSS設定を活用することで、縦横サイズを変更したり印刷方向を縦から横に変更することができます。

このへんが参考になります。
とほほのスタイルシート入門
VF RenderAs PDF page size as A4

[css]
@page {
size:landscape;
}
[/css]

こんなCSSの内容を適用すれば
ws000110
こんな風に横長にしたり印刷時の設定を横方向印字にすることができます。

また、直接数値でサイズ指定することもできます。

[css]
@page {
size: 8.27in 11.69in;  /* A4 width and height */
}
[/css]

こんな感じ。

注意点として、この@pageのCSS内容はVisualforceソース内に<style>タグを使って記述すると認識がされないようです。

[html]
<style type="text/css">
@page {
size:landscape;
}
</style>
[/html]

これだとNGです。

たぶんVisualforce内で@をうまく処理できてないんじゃないかと思いますが、これを回避するために@pageのCSS内容は静的リソースに配置してそれをVisualforce内で読み込むようにするとうまくいきます。

[html]
<apex:stylesheet value="{!$Resource.myCSS}"/>
[/html]

これで大丈夫。

更にここで注意点として、なんでもかんでも静的リソースに配置したCSSが有効になるかというとそうでもなく、例えばフォント設定は静的リソースのCSSファイルに記述しても有効にならず、以下のようにVisualforceソース内に記述する必要があるようです。

[html]
<head>
<style> body { font-family: Arial Unicode MS; } </style>
</head>
[/html]

こんな感じ。

うーん、ややこしい。