UnifinityでJSONファイル出力する

テックポエム

私の近況ですが、最新情報のお知らせなどでJSONファイルを更新する機会が増えてきました。

そのたびにJSON形式のファイルを手入力していたのですが、
手入力だとそれなりに入力の時間が嵩み、入力のミスが発生する可能性があるなど、あまりいいことはありません。
JSONを自動で出力するアプリを作れば、JSONの更新を簡単かつミスなくできるようになるので、今回はUnifinityでJSONを出力するアプリを作成したいと思います。

今回は以下の入れ子構造になったJSONファイルを出力するアプリを作成します。
入れ子の親要素のキーは日付のデータです。
入れ子の子要素のデータ数は5件で固定です。

adventcalender2_maeda_0.png

アプリ設計


出力するJSONデータは既に決まっているので、まずはそのJSONの形式に合わせてテーブルの設計をします。
テーブルを1つ作成して、入れ子の子要素のキーとなる値をフィールドとして設定します。
アプリの前回終了時のデータを保存したいので「起動時初期化」のチェックは付けないように気を付けます。

adventcalender2_maeda_1.png

JSONに格納するデータが既にあるなら、この時点で「格納データ」に入力して「Commit」しておきます。
データが無い場合でも今回のデータ数は5件で固定ですので適当に5行分のデータを入力します。

adventcalender2_maeda_2.png

入れ子の親要素のキーは日付によって毎回変化するので、今回のテーブル設計では特に何も設計しません。


次に画面の設計をします。
メインとなるフォーム(以下メインフォーム)にサブフォームコントロールを出来るだけ大きく配置し、
サブフォームコントロールの下部付近にボタンを1つ配置します。

adventcalender2_maeda_3.png

サブフォームの中に表示するフォームを作成します。
新規作成したフォームのサイズをメインフォームのサブフォームコントロールの幅と同じに設定して、
高さを先程作成したテーブルのフィールド数と同じ数のテキストボックスが入るぐらいに設定します。

adventcalender2_maeda_4.png

先程作成したテーブルをフォームに紐づけて、「新規行表示」のチェックを外します。
テキストボックスをフィールド数と同じ数だけ配置して、それぞれのテキストボックスに紐づけます。

サブフォームのヘッダーを作成します。
新規作成したフォームの幅を先程のサブフォームと同じに設定しますが、高さはテキストボックスが1つ入れば十分です。

adventcalender2_maeda_5.png

テキストボックスを1つだけ配置したら「入力内容」に「日付」を指定します。

adventcalender2_maeda_6.png

メインフォームの設計画面に戻り、
サブフォームコントロールの明細にテーブルと紐づけたフォームを設定して「リスト表示」にチェックを入れます。
次にサブフォームコントロールのヘッダーにテキストボックスを1つだけ配置したフォームを紐づけます。
これで画面の設計は一旦完了です。

最後にロジックの設計をします。
新規ロジックを作成して以下の処理を設計します。

adventcalender2_maeda_7.png

今回設計した処理の説明を行います。

#1:【ディクショナリー/データベース読込】

adventcalender2_maeda_8.png

テーブルの設計で作成したテーブルを読み込んで、入れ子の子要素とするディクショナリーを作成します。

#2:【コントロール/内容取得】

adventcalender2_maeda_9.png

サブフォームヘッダーのテキストボックスの内容を取得します。

#3:【文字列関数/フォーマット】

adventcalender2_maeda_10.png

テキストボックスから取得した日付型データは” YYYY/MM/DD hh:mm:ss”の形式となっていますので、今回作成するJSONの”YYYY-MM-DD”の形式に修正します。
フォーマットしたデータは入れ子の親要素のキーとなります。

#4:【ディクショナリー/作成】

adventcalender2_maeda_11.png

入れ子構造のディクショナリーを作成します。
「キー」にフォーマットした日付データを指定して、「値」に子要素のディクショナリーを指定します。

#5:【ディクショナリー/JSON書出】

adventcalender2_maeda_12.png

入れ子構造のディクショナリーをJSON形式のデータに変換します。

#6:【ファイル/書き込み】

adventcalender2_maeda_13.png

【ディクショナリー/JSON書出】ロジックで作成したデータをJSONファイルとして書き出します。
ファイル名の入力欄で拡張子を「.json」に指定します。
※ファイル名の入力欄でファイル名のみを入力した場合、ファイルはプロジェクトフォルダの中に保存されます。
 ファイルの保存する場所を指定する場合は、ファイル名の入力欄に保存先のフルパスを指定してください。

ロジックの設計はこれで完了です。
作成したロジックをメインフォームに配置したボタンの実行処理に設定します。

これでJSONファイルを出力するアプリの最低限の設計は完了しました。


アプリを実行する


完成したアプリ実行します。
アプリを起動したらそれぞれのテキストボックスの中にJSONデータの内容を入力します。

adventcalender2_maeda_14.png

入力が終わったら画面下部のボタンを押すとJSONファイルが出力されます。
エクスプローラーを開いてプロジェクトフォルダの中を確認すると・・・
adventcalender2_maeda_15.png
JSONファイルが出力されたことが確認できます。

出力されたJSONファイルの中身を確認すると、JSON形式のデータであることがわかります。

adventcalender2_maeda_16.png

JSONファイルを出力するアプリとして最低限の機能が実装できたところで、今回のアプリの作成は以上となります。


今回作成したアプリの紹介はこれで終わりですが、このアプリにはまだまだブラッシュアップの余地があります。
例えば、画面デザインを綺麗に整える、各テキストの自動入力機能の実装、JSONファイルの改行対応とインデント対応、etc…、改良案を考えると枚挙に遑がありません。
Unifinity Studioを使えば、作ったアプリを簡単に自分好みにアレンジできるので、皆様もちょっとした時間にオリジナルのアプリを作ってみてはいかがでしょうか。

adventcalender2_maeda_17.png
ブラッシュアップしたアプリの画面