IBM i 開発者向け！ VSCode拡張機能

IBM i(旧AS/400)のDSPFを、VSCodeで視覚的に編集する拡張機能を作成(β版）

【前提条件】本機能は全てのキーワードに対応など、完全な動作を保証するものではありません。作成・変更した内容や 出力される DDS ソース・Excel などの成果物は、必ず内容をご確認のうえ、自己責任でご利用ください。出力内容に不備・不具合等があった場合でも、著作者は一切の責任を負いません。ライセンス形態は、作業中のこともあって、ひとまずのところプロプライエタリ・ライセンスです。

IBM iの画面ファイル（DSPF）を保守していると、
ソースだけを見ながら画面配置を把握するのが難しいと感じることはないでしょうか。

特に、次のような作業には時間がかかります。

• 行・桁位置を追いながら、実際の画面レイアウトを頭の中で組み立てる
• 標識による表示条件を確認する
• サブファイルとサブファイル制御レコードの関係を確認する
• REF / REFFLD の参照先まで追いかけて、フィールドの桁数や型を確認する
• 画面仕様をExcelなどの資料へ転記する

5250画面でDSPFのレイアウト確認の強い味方のSDAも廃止され、
RDiに移行すべきかとお考えの方も多いと思います。
しかし、更新の若手の育成の為にも、出来れば開発ツールはよりモダンなVSCodeを使いたい…。

そこで、DSPFをVSCode上で視覚的に確認・編集できる拡張機能
「IBM i DSPF Screen Designer」 のベータ版を作成致しました。

本拡張機能は、現時点では一般的なOSSとして公開する段階ではないと判断しており、
限定的な配布を想定しています。

![IBM i DSPF Screen Designerの画面]

IBM i DSPF Screen Designerとは

IBM i DSPF Screen Designer は、IBM i のディスプレイファイルをVSCode上で画面イメージとして表示し、そのまま編集できるVSCode拡張機能です。

.dspf ファイルをデザイナーで開くと、24×80または27×132の画面として描画されます。画面上のテキストや入出力フィールドを選択し、位置や属性を編集できます。

編集した内容はDDSソースへ反映され、VSCode標準の Ctrl + S で保存できます。

この拡張機能でできること

1. DSPFを画面イメージとして表示

DSPFソースを、IBM i の画面に近いグリッド形式で表示できます。

ソースの行・桁位置を一つずつ確認しなくても、レコードフォーマットの配置を視覚的に把握できます。

対応する画面サイズは次のとおりです。

• DS3：24行 × 80桁
• DS4：27行 × 132桁

レコードフォーマットごとの表示だけでなく、複数レコードフォーマットを重ねる合成表示にも対応しています。

![レコードフォーマットの合成表示]

2. テキストやフィールドを画面上で編集

画面イメージ上で、次の操作を行えます。

• テキストの追加、変更、移動、削除
• 入力フィールド、出力フィールド、入出力フィールドの追加と編集
• DATE、TIMEなどの定数フィールドの追加
• レコードフォーマットの追加
• 要素のドラッグ移動
• Undo / Redo

レコードフォーマットは、DSP、SFL、CTL、WINDOW、GRDなどを追加できます。

3. DDS属性をプロパティパネルから設定

画面右側のプロパティパネルから、DDSの各種属性を設定できます。

主な対応項目は次のとおりです。

• フィールド名、長さ、データ型、小数桁
• 使用目的（入力、出力、入出力、非表示）
• DSPATR
• COLOR
• EDTCDE
• EDTWRD
• EDTMSK
• VALUES
• DFT / DFTVAL
• CHECK
• CHANGE
• REF / REFFLD

DDSに詳しくない担当者でも、ソースのカラム位置を意識せず設定内容を確認できます。

![プロパティパネル]

4. 標識のON/OFFによる表示確認

標識のON/OFFをデザイナー上で切り替え、条件付きで表示される項目の状態を確認できます。

複数条件、否定条件、表示属性、色指定なども、条件ルールとして管理できます。

ファンクションキーに割り当てられた標識も一覧で確認・編集できます。

5. サブファイル関連キーワードに対応

IBM i の画面開発で使用頻度の高いサブファイルについても、主要なキーワードを確認・設定できます。

主な対応項目は次のとおりです。

• SFLPAG
• SFLSIZ
• SFLLIN
• SFLINZ
• SFLCLR
• SFLDLT
• SFLEND
• SFLDROP
• SFLFOLD
• SFLMSGRCD
• SFLMSGKEY
• SFLPGMQ

SFLDROP / SFLFOLD については、画面イメージ上で折りたたみ表示と切り捨て表示を切り替えて確認できます。

6. 罫線レコードを画面上で編集

グリッドレコードの罫線キーワードを解釈し、画面イメージ上へ描画できます。

対応する主なキーワードは次のとおりです。

• GRDATR
• GRDBOX
• GRDLIN
• GRDCLR

罫線は、ドラッグによる新規描画、移動、リサイズに対応しています。

別のレコードフォーマットを半透明の下地として表示し、項目位置に合わせて罫線を引くこともできます。

![罫線編集]

7. REF / REFFLDを解決

REFFLD を使用したフィールドは、参照元の物理ファイルを確認しなければ、桁数、型、小数桁などが分かりません。

本拡張機能では、次の2つの方法で参照フィールドを解決できます。

PFのDDSソースを指定する

参照先PFのDDSファイルをローカルから選択し、次の情報を取得します。

※当拡張機能のダウンロード機能、もしくはCode For IBM i拡張機能、IBM i Access Client Solutions（ACS）を利用してダウンロードしたソースメンバーのテキストファイルを利用します。

• 桁数
• データ型
• 小数桁
• TEXT
• 列見出し
• 編集コード

参照先PFがさらに別のPFを参照している、多段参照にも対応しています。

IBM iへ接続して取得する

SSHと db2util を使用してIBM iへ接続し、QSYS2.SYSCOLUMNS から参照先属性を取得できます。

Code for IBM iに依存せず、本拡張機能の接続設定だけでも利用できます。

DSPF
  └─ REFFLD
       └─ IBM iへSSH接続
            └─ QSYS2.SYSCOLUMNSを照会
                 └─ 桁数・型・小数桁などを画面へ反映

IBM i接続機能を使うための前提

IBM iから参照フィールド情報を取得する機能と、後述するオブジェクトブラウザーは、IBM iのPASE環境にある db2util を使用します。

IBM i側では、次の準備が必要です。

• SSH（OpenSSH）が利用できること
• PASE環境に db2util が導入されていること
• 接続ユーザーに、対象ライブラリーやソースファイルを参照する権限があること

db2util が利用できるかどうかは、コマンドパレットから次のコマンドを実行して確認できます。

IBM i DSPF: 接続テスト

この接続テストでは、IBM iへのSSH接続に加えて、db2util が応答するかどうかも確認します。

SSHから直接確認する場合は、次のコマンドを実行します。

ls /QOpenSys/pkgs/bin/db2util

db2utilのインストール

IBM iのオープンソース環境にyumが導入されている場合は、次のコマンドでインストールできます。

yum install db2util

IBM i Access Client Solutions（ACS）の Open Source Package Management 画面からインストールすることもできます。

既定のインストール先は次のパスです。

/QOpenSys/pkgs/bin/db2util

異なる場所へインストールされている場合は、VSCodeの設定で実行ファイルのパスを指定します。

{
  "ibmi-dspf.connection.db2utilPath": "/任意のパス/db2util"
}

yum自体が未導入のIBM iでは、先にIBM iのオープンソース環境（RPM／yum）をセットアップする必要があります。

8. IBM iのソースメンバーを直接開く

拡張機能独自のオブジェクトブラウザーを用意しています。

この機能も、IBM i側のSSHとPASEの db2util を使用します。事前準備と確認方法は、前項の「IBM i接続機能を使うための前提」を参照してください。

VSCodeのアクティビティバーからIBM iへ接続し、次の階層をツリー表示できます。

接続プロファイル
  └─ ライブラリー
       └─ ソースファイル
            └─ DSPFメンバー

DSPFメンバーをクリックすると、IBM i上のソースを直接デザイナーで開けます。

主な操作は次のとおりです。

• デザイナーで開く
• DDSソースとして開く
• ローカルへ保存する
• PCへダウンロードする
• サーバーから最新内容を再取得する
• IBM iのメンバーへ書き戻す

安全のため、IBM i上のメンバーは既定では読取専用です。設定を有効にした場合だけ、Ctrl + S で直接書き戻せます。

接続パスワードはVSCodeのSecretStorageへ保存し、通常の設定ファイルには保存しません。

9. Code for IBM iとの連携

Code for IBM iがインストールされている環境では、設定を有効にすることで、Code for IBM iのObject Browserに専用の右クリックメニューを追加できます。

IBM i DSPF: デザイナーで開く

既存のCode for IBM i利用者も、普段の操作フローを大きく変えずにデザイナーを利用できます。

10. 画面イメージをExcelへ出力

デザイナーに表示している画面をExcelファイルへ出力できます。

出力時には、次の状態が反映されます。

• 選択中のレコードフォーマット
• 合成表示の対象
• 標識のON/OFF状態
• 罫線

画面設計書、レビュー資料、利用部門への説明資料などを作成する際の転記作業を減らせます。

![Excel出力結果]

元のDDSソースをできるだけ保持

既存資産へ適用するツールでは、保存しただけでソース全体が整形されてしまうと、差分確認が難しくなります。

そのため本拡張機能では、元ソースの次の情報をできるだけ保持するようにしています。

• 元の書式
• コメント
• 行の順序
• カラム1～5の順序番号
• 編集していない行
• 未対応キーワードを含む原文

基本的には、実際に編集した箇所だけを変更する方針です。

デザイナーとテキストエディタを同時に開けば、画面上の編集がDDSソースへ反映される様子も確認できます。

閲覧専用モード

DSPFを変更せず、画面の確認だけに利用したい場合は、次の設定を有効にします。

{
  "ibmi-dspf.readOnly": true
}

閲覧専用モードでも、次の機能は利用できます。

• レコードフォーマットの切り替え
• 合成表示
• 標識のON/OFF
• REF / REFFLDの解決
• Excel出力

既存資産をまず安全に可視化したい場合にも利用できます。

インストール方法

配布されたVSIXファイルをインストールします。

VSCodeの画面からインストール

1. VSCodeの拡張機能ビューを開く
2. 右上の「…」をクリックする
3. 「VSIXからのインストール…」を選択する
4. 配布された .vsix ファイルを選択する
5. VSCodeを再読み込みする

コマンドからインストール

code --install-extension ibmi-dspf-designer-io-<version>.vsix

DSPFをデザイナーで開く方法

通常どおり .dspf ファイルをクリックした場合は、DDSソースとして開きます。

デザイナーで開く場合は、次のいずれかを使用します。

• エクスプローラーで .dspf を右クリックする
• エディタタブを右クリックする
• エディタ右上の専用ボタンを押す
• コマンドパレットから実行する
• 本拡張機能のオブジェクトブラウザーからDSPFメンバーを選ぶ
• Code for IBM iのObject Browserから開く

実行するコマンドは次のとおりです。

IBM i DSPF: デザイナーで開く

デザイナーからDDSソースへ戻すこともできます。

IBM i DSPF: テキストエディタで開く

キーボード操作

キー	動作
Ctrl + S	DDSソースまたはIBM iメンバーを保存
Ctrl + Z	Undo
Ctrl + Y	Redo
Delete / Backspace	選択中の要素を削除
Esc	選択解除、ダイアログを閉じる

想定している利用場面

この拡張機能は、次のような場面での利用を想定しています。

既存DSPFの保守

長年使用されているDSPFを、画面イメージとソースの両方で確認しながら修正できます。

若手担当者への教育

DDSソースと実際の画面配置の関係を視覚的に確認できるため、IBM i画面開発の学習にも利用できます。

画面レビュー

レコードフォーマットの合成表示や標識切り替えを使い、画面の状態を確認できます。

設計書の作成

画面イメージをExcelへ出力し、設計書や説明資料のベースとして利用できます。

モダナイゼーション前の資産調査

既存画面の構造、項目、条件、サブファイル、参照フィールドなどを確認し、再構築対象の調査に利用できます。

現時点での制限事項

本拡張機能は、IBM iの実機や端末エミュレーターを完全に再現するものではありません。DSPFのレイアウト確認と設計支援を目的としています。

また、次の制限があります。

• 一部のDSPF属性・キーワードは未対応
• PRINT、CSRLOC、SFLRCDNBR などは現時点で未対応
• CHECK の一部コードは編集対象外
• オブジェクトブラウザーからの書き戻しではメンバーロックを取得しない
• IBM iへ書き戻す場合、順序番号が振り直される場合がある
• デザイナー内のUndo後も、VSCodeの未保存表示が残る場合がある

未対応キーワードを含む行については、可能な限り元のDDSソースを保持します。

DBCSの隣接SO/SIについて

次のように、一つの定数内で全角文字のSO/SIペアが隣接するデータには注意が必要です。

0E № 0F 0E 商品 0F

この形式を含むメンバーを本拡張機能から書き戻すと、内側のSO/SIが統合され、IBM i上で表示されていた空白が失われる可能性があります。

該当するメンバーでは、デザイナーからの書き戻しを避け、閲覧、ダウンロード、ローカル保存のみで使用してください。

オブジェクトブラウザーから該当メンバーを開いた場合は、警告を表示します。

安全に試すための推奨手順

既存の本番ソースへ適用する前に、次の手順で確認することを推奨します。

1. 閲覧専用モードでDSPFを開く
2. 画面イメージとDDSソースを比較する
3. ローカルへコピーしたDSPFで編集を試す
4. 保存前後のDDS差分を確認する
5. テスト用ライブラリーでコンパイルする
6. 5250エミュレーターで実際の表示と動作を確認する
7. 問題がないことを確認してから対象資産へ適用する

今後追加したい機能

今後は、次のような改善を検討しています。

• 未対応DDSキーワードの追加
• DDSソース差分のプレビュー
• フィールド配置時の整列支援
• 画面部品のコピー・貼り付け強化
• より安全なIBM iメンバー更新方式

実際のIBM i開発・保守現場で必要とされる機能を優先して改善していく予定です。

まとめ

IBM i DSPF Screen Designer は、DSPFをVSCode上で視覚的に表示・編集するための拡張機能です。

特に、次の点を重視して開発しています。

• DSPFを画面イメージとして分かりやすく表示する
• DDSソースと視覚編集を往復できる
• 既存ソースの書式や未編集部分をできるだけ保持する
• 標識、サブファイル、罫線、REF / REFFLDにも対応する
• IBM i上のDSPFメンバーを直接確認できる
• Excel出力により設計・レビュー作業を効率化する

IBM iの既存資産を活用しながら、VSCodeを中心とした開発環境へ少しずつ移行するための選択肢の一つになればと考えています。

興味を持っていただいた方、試用を希望される方、改善要望をお持ちの方は、以下からご連絡ください。

• 配布・試用案内：検討中
• 問い合わせ・フィードバック：[[e-mail]]