IM-PDFDesigner for Accel Platform プログラミングガイド 第23版 2024-10-01

6.1.3.2.1. 帳票レイアウトファイルの作成

帳票デザインツール IODBDOC を使用し、PDFファイルの雛形を作成する作業です。

本項目では、未完成の帳票レイアウトファイルに外部変数、および、データ項目変数を設定後、帳票レイアウトファイルを作成します。

外部変数、および、データ項目変数とは、帳票レイアウトファイル上に、文字列や画像などのデータを埋め込むための項目です。

外部変数は、該当ページのタイトルやヘッダ部分に一度だけ出力する場合に使用します。

データ項目変数は、データを明細行として出力する場合に使用します。

PDFファイル作成時、外部変数、および、データ項目変数とデータを紐づけることで、帳票レイアウトファイル上に設定した各変数にデータが埋め込まれます。

帳票レイアウトファイル< layout/somu_kotsuhi.ddl >は未完成です。

本チュートリアルで、次の項目を設定していきます。

  • 外部変数
    • ユーザーID
    • 氏名
  • データ項目変数
    • 到着
    • 片/往
    • 金額

コラム

帳票デザインツール(連票形式 IODBDOC )の詳しい使用方法については、「 連票形式 IODBDOC 」を参照してください。

6.1.3.2.1.1. 帳票レイアウトファイルを開く

  1. 帳票デザインツール IOWebDOC をインストールしているPCに< layout/somu_kotsuhi.ddl >をコピーします。

  2. 「スタート」-「 YSS IOWebDOC 」-「 IODBDOC 」を選択します。

    ../../../../_images/iodbdoc_create_layout_open_1.png
  3. 起動した帳票デザインツール IODBDOC のメニューバーから「ファイル」-「開く」を選択し、< somu_kotsuhi.ddl >を選択します。

    ../../../../_images/iodbdoc_create_layout_open_2.png

    選択したファイルが開きます。

    ../../../../_images/iodbdoc_create_layout_open_3.png

6.1.3.2.1.2. 外部変数を設定する

6.1.3.2.1.2.1. 外部変数を追加する

  1. レイアウト内の項目「ユーザーID」の横を右クリックし、右クリックメニューから「追加(項目)」を選択します。

    ../../../../_images/iodbdoc_create_layout_global_add_1.png
  2. マウスカーソルに表示される四角いボックスを、「ユーザーID」の横に合わせ、クリックします。

    ../../../../_images/iodbdoc_create_layout_global_add_2.png

    クリックした箇所に項目が追加されます。

    ../../../../_images/iodbdoc_create_layout_global_add_3.png

6.1.3.2.1.2.2. 外部変数を編集する

  1. メニューバーから「設定」-「外部変数」を選択します。

    ../../../../_images/iodbdoc_create_layout_global_edit_1.png
  2. 「外部変数設定」画面の「追加」をクリックします。

    ../../../../_images/iodbdoc_create_layout_global_edit_2.png

    変数が追加されます。

    ../../../../_images/iodbdoc_create_layout_global_edit_3.png
  3. 追加された変数を選択後、画面下の入力欄に、次の値を設定し、「OK」をクリックします。

    項目
    変数名 user_id
    コメント ユーザーID
    ../../../../_images/iodbdoc_create_layout_global_edit_4.png
  4. 追加した項目のみを選択状態にします。

    ../../../../_images/iodbdoc_create_layout_global_edit_5.png
  5. 追加した項目を右クリックし、右クリックメニューから「編集(項目)」を選択します。

    ../../../../_images/iodbdoc_create_layout_global_edit_6.png
  6. 「項目属性編集」画面の「基本属性」タブを開き、次の値を設定します。

    項目
    基本属性 - 項目名 value
    基本属性 - データタイプ 外部変数
    基本属性 - データ user_id(ユーザーID)
    項目余白 - 左余白 1.8mm
    項目余白 - 右余白 1.8mm
    ../../../../_images/iodbdoc_create_layout_global_edit_7.png
  7. 「項目罫線/背景」タブを開き、次の値を設定します。

    項目
    描画設定 - 上 表示(ボタンが窪んでいる状態)
    描画設定 - 下 表示(ボタンが窪んでいる状態)
    背景設定 - パターン
    背景設定 - 背景色
    ../../../../_images/iodbdoc_create_layout_global_edit_8.png
  8. 「テキスト」タブを開き、次の値を設定し、「OK」をクリックします。

    項目
    書式 - 書式 X(20)
    ../../../../_images/iodbdoc_create_layout_global_edit_9.png

    設定が画面上に反映されます。

    ../../../../_images/iodbdoc_create_layout_global_edit_10.png

6.1.3.2.1.2.3. 外部変数の位置を調整する

  1. 「ユーザーID」の外部変数と、「記入日」の外部変数をクリックします。

    ../../../../_images/iodbdoc_create_layout_global_adjust_1.png
  2. 「記入日」の外部変数を右クリックし、右クリックメニューから「配置等」-「幅を変更して左揃え」を選択します。

    ../../../../_images/iodbdoc_create_layout_global_adjust_2.png

    「ユーザーID」の外部変数の左幅が、「記入日」の外部変数の左幅に合わせて変更されます。

    ../../../../_images/iodbdoc_create_layout_global_adjust_3.png
  3. 「記入日」の外部変数を右クリックし、右クリックメニューから「配置等」-「幅を変更して右揃え」を選択します。

    ../../../../_images/iodbdoc_create_layout_global_adjust_4.png

    「ユーザーID」の外部変数の右幅が、「記入日」の外部変数の右幅に合わせて変更されます。

    ../../../../_images/iodbdoc_create_layout_global_adjust_5.png
  4. 「記入日」の外部変数を右クリックし、右クリックメニューから「配置等」-「高さを変更して上揃え」を選択します。

    ../../../../_images/iodbdoc_create_layout_global_adjust_6.png

    「ユーザーID」の外部変数の上の高さが、「記入日」の外部変数の上の高さに合わせて変更されます。

    ../../../../_images/iodbdoc_create_layout_global_adjust_7.png
  5. 「記入日」の外部変数を右クリックし、右クリックメニューから「配置等」-「高さを変更して下揃え」を選択します。

    ../../../../_images/iodbdoc_create_layout_global_adjust_8.png

    「ユーザーID」の外部変数の下の高さが、「記入日」の外部変数の下の高さに合わせて変更されます。

    ../../../../_images/iodbdoc_create_layout_global_adjust_9.png

6.1.3.2.1.2.4. 残りの外部変数を全て設定する

上記の手順、および、< layout/somu_kotsuhi_sample.ddl >を参考に、次の外部変数を全て設定します。

  • 氏名

    画面 項目
    外部変数設定 変数名 user_name
      コメント 氏名
    項目属性編集 - 基本属性タブ 基本属性 - データ user_name(氏名)

6.1.3.2.1.3. データ項目変数を設定する

6.1.3.2.1.3.1. データ項目変数を追加する

  1. 外部変数を追加する 」を参考に、「到着」の下に項目を追加します。

    ../../../../_images/iodbdoc_create_layout_col_add_1.png

6.1.3.2.1.3.2. データ項目変数を編集する

  1. メニューバーから「設定」-「データ設定」を選択します。

    ../../../../_images/iodbdoc_create_layout_col_edit_1.png
  2. 「データ設定」画面の「データ数」に「5」と入力します。

    入力したタイミングで一覧にデータが追加されます。

    ../../../../_images/iodbdoc_create_layout_col_edit_2.png
  3. 追加されたデータを選択後、画面下の入力欄に次の値を設定し、「OK」をクリックします。

    項目
    コメント 到着
    ../../../../_images/iodbdoc_create_layout_col_edit_3.png
  4. 追加した項目のみを選択状態にします。

    ../../../../_images/iodbdoc_create_layout_col_edit_4.png
  5. 追加した項目を右クリックし、右クリックメニューから「編集(項目)」を選択します。

    ../../../../_images/iodbdoc_create_layout_col_edit_5.png
  6. 「項目属性編集」画面の「基本属性」タブを開き、次の値を設定します。

    項目
    基本属性 - 項目名 label
    基本属性 - データタイプ データ項目変数
    基本属性 - データ $5(到着)
    項目余白 - 左余白 1.8mm
    項目余白 - 右余白 1.8mm
    ../../../../_images/iodbdoc_create_layout_col_edit_6.png
  7. 「項目罫線/背景」タブを開き、次の値を設定します。

    項目
    描画設定 - 上 表示(ボタンが窪んでいる状態)
    描画設定 - 下 表示(ボタンが窪んでいる状態)
    背景設定 - パターン
    背景設定 - 背景色
    ../../../../_images/iodbdoc_create_layout_col_edit_7.png
  8. 「テキスト」タブを開き、次の値を設定し、「OK」をクリックします。

    項目
    位置 - 出力制御 文字サイズ縮小
    書式 - 書式 X(20)
    ../../../../_images/iodbdoc_create_layout_col_edit_8.png

    設定が画面上に反映されます。

    ../../../../_images/iodbdoc_create_layout_col_edit_9.png

6.1.3.2.1.3.3. データ項目変数の位置を調整する

  1. 外部変数の位置を調整する 」を参考に、「到着」の固定文字の位置に合わせるよう、「到着」のデータ項目変数を調整します。

    ../../../../_images/iodbdoc_create_layout_col_adjust_1.png

6.1.3.2.1.3.4. 残りのデータ項目変数を全て設定する

上記の手順、および、< layout/somu_kotsuhi_sample.ddl >を参考に、次のデータ項目変数を全て設定します。

  • 片/往

    画面 項目
    データ設定 - 番号6 コメント 片/往
    項目属性編集 - 基本属性タブ 基本属性 - データ $6(片/往)
  • 金額

    画面 項目
    データ設定 - 番号7 コメント 金額
    項目属性編集 - 基本属性タブ 基本属性 - データ $7(金額)
    項目属性編集 - テキストタブ 書式 - 書式 \\\,\\\,\\9

6.1.3.2.1.4. 名前を付けて保存する

  1. メニューバーから「ファイル」-「上書き保存」を選択します。

    < somu_kotsuhi.ddl >が上書き保存されます。

    ../../../../_images/iodbdoc_create_layout_save_1.png

    コラム

    Ctrl + S でも保存可能です。

6.1.3.2.1.5. 作成した帳票レイアウトファイルを設置する

  1. < %PUBLIC_STORAGE_PATH% /pdfd/tutorial/basic >ディレクトリを作成します。
  2. < somu_kotsuhi.ddl >を< %PUBLIC_STORAGE_PATH% /pdfd/tutorial/basic >配下に設置します。