画像の自由配置を実現！kintone帳票出力とPDF編集プラグインの組合せ例

kintoneで帳票出力プラグインを利用していると、現場やお客様から

• 「ここの画像をもう少し大きく出力したい」
• 「画像の場所をちょっと変えたい」

といった細かな要望が出てきたことはないでしょうか。そして、そのような要望に対して帳票フォーマットをその都度追加するのは現実的ではないため、「帳票出力プラグインの仕様や制約上それは難しいです」と回答されていることはないでしょうか。

帳票出力プラグインでは、事前設定された定義を元にベースにフィールドの値を載せて帳票を作成します。そのため、このような要望への対応を帳票出力プラグインのみで実現することは難しいですが、PDF編集プラグインと組み合わせれば実現可能です。

本記事では、画像の自由配置を実現するための具体的なアプリ構築方法と、実際の操作画面を解説します。最後まで読んでいただければ、PDF帳票に対する画像の挿入方法を理解し、すぐに自社環境で実現できるようになります。

帳票への画像の自由な位置・サイズでの追加はPDF編集プラグインと組み合わせる

帳票レイアウトにおける画像の自由配置は、標準的な帳票プラグインでは技術的なハードルが高い要件です。
しかし、この課題に対してはアプローチを変えて、既存の帳票出力プラグインに「PDF編集プラグイン」を組み合わせることで実現することができます。

帳票出力プラグインにおける画像の制約

帳票出力プラグインは定型フォーマットの生成に特化しています。あらかじめPDFのテンプレートを用意し、そこにkintoneのフィールド情報をマッピングする仕組みです。そのため、画像のサイズや挿入位置はあらかじめ定義した枠に依存して固定されます 。

例えば、現場で撮影した写真を帳票に載せる際、「この写真は縦長だから少し縮小して右に寄せたい」「この写真は横長だから大きく中央に配置したい」といった動的なレイアウト変更はできません。

また、kintoneの添付ファイルフィールドには複数画像を格納できますが、帳票出力時には複数枚を判別して自動的に並べることも難しいです（帳票プラグインの機能次第）。そのため、帳票内に配置したい画像の数だけkintoneアプリ側にも別々の添付ファイルフィールドを用意し、それを帳票テンプレートでは使用するような形になることが多いように思います。

出力した帳票に対してPDF編集プラグインで画像を後乗せする

これらの制約を解消する解決策の1つが、PDF編集プラグインによる画像の後乗せという方法です。

帳票出力プラグイン側でのみどうにかしようとするのではなく、まずは帳票プラグインで文字情報のみ あるいは ベースとなる枠組みのみのファイルを添付フィールドに出力し、その後にPDF編集プラグインを使用して、好きな位置に好きなサイズで画像を挿入（後乗せ）するという操作を行います。

この方法であれば、元の帳票テンプレートのレイアウトに依存しません 。kintoneのレコード詳細画面からPDFを開き、ドラッグ＆ドロップで直感的に画像を配置・リサイズすることが可能になります 。2つのプラグインを組み合わせることで、開発工数をかけずに顧客の細かな要望を叶えることができるようになります。

画像の自由配置・リサイズを実現する操作画面

「もう少し写真を大きく見せたい」「空いているスペースに複数の写真を並べたい」というの要望に対して、PDF編集プラグインを使えばどのように応えられるのか、実際の操作手順は次の通りです。

直感的なドラッグ＆ドロップで好きな場所・サイズで画像を配置

まず、帳票出力プラグインを使って、添付ファイルフィールドにベースとなるPDFを保存します。帳票出力ボタンクリック時に直接PDFを出力した場合は本事例のような処理ができないため、帳票出力先を添付フィールドにする必要があります。

次に、PDF編集プラグインで表示されるPDF編集ボタンをクリックします。

PDF編集画面が表示されるので、画像挿入オブジェクトを左のパネルからPDF上の好きな位置にドラッグ＆ドロップで追加します 。

画像アイコンをクリックするとファイル選択ダイアログが表示されますので、配置したい画像を選択します。

あとは、マウスでつかんで好きな位置へ移動させるだけです 。サイズ変更も、画像の端を引っ張って直感的に拡大・縮小できるほか、右側のプロパティパネルで数値を指定して整えることも可能です 。

たとえば、現場調査の報告書などで、特筆すべき破損箇所の写真だけを大きく引き伸ばし、その他の写真は小さく並べるといった柔軟なレイアウトができます。

最後に、保存ボタンをクリックすれば、編集後のPDFファイルがフィールドに保存されます。

「画像呼び出し機能」で別アプリの画像（印鑑やロゴなど）もワンクリック挿入

現場での入力作業をさらに効率化するのが、画像呼び出し機能です。

毎回同じ画像を挿入したいケース、例えば「現場責任者の確認印」や「社印」などをPDFに載せたい場合、あらかじめ別アプリに画像を登録しておきます。すると、PDF編集画面の右側パネルに専用のボタンが表示され、それをクリックするだけでPDF上にサッと画像が挿入されます。

毎回PC内から画像を選択する必要がなくなり、現場担当者の入力ストレスの軽減が見込めます。これらの機能を活用すれば、固定フォーマットの帳票では実現できなかった自由な画像レイアウトができる帳票を素早く提供できるようになります。

参考記事：kintone容量問題が起きる前に！PDF編集×クラウド連携プラグイン構成例

PDF編集プラグインの設定はシンプル

既存の帳票出力プラグイン側では画像を挿入しないような設定に変えれば、あとはPDF編集プラグインの設定を行うだけで実現ができます。詳しい設定手順については、実際の画面を交えた詳細なマニュアルをご用意していますので、以下のリンクからご確認ください。

プラグインの組み合わせに関するよくある質問（Q&A）

まとめ

今回は、帳票出力における画像のサイズ・位置が固定されるという制約を、PDF編集プラグインとの組み合わせで解決する方法をご紹介しました。

• 画像の配置は後乗せ：帳票出力プラグインで出力したPDFに対して、PDF編集プラグインで画像を自由に追加・リサイズする。
• 帳票出力プラグインは何でもOK：利用中の帳票プラグインはそのままで、機能だけを拡張できる。

プラグインを組み合わせることで、これまで難しいと諦めていた要望にも応えられるようになり、提案や活用の幅が大きく広がります。 PDF編集プラグインは30日間の無料トライアルをご用意しています。まずは実際の自社環境で、ぜひ試してみてください。