開発ガイド(Ver.2)
2023/05/10
   19.2.2.履歴

1.概要

※「Buddy はじめに」を最初お読みください。

2.Buddy と Webアプリケーション

※ 将来、Web ブラウザ内にアプリケーションやデータを保存して、サーバーと通信できない環境でも使えるアプリを開発できるようにする予定ですが、現在はサーバーと通信できないと Buddy 自体も開発されたアプリも利用できません。

3.URL とログイン情報

4.ブラウザ

5.アプリ開発の概要

[設計]

[デバッグ用生成とテスト]

[本番用生成]

※生成の手順について

※フレームワークについて

※フレームワークのアップデートについて

5.1.フレームワーク2

フレームワーク2の改良点・特徴

6.データベースの基本

7.名前について

8. ユーザーと権限について

9.トップページ

(アプリ)
アプリ画面に切り替えます。その左のBuddyのロゴをクリックしても同じようにアプリ画面に切り替えます。ログイン後はアプリ画面になります。
アプリ画面ではアプリの一覧から選択してアプリを起動します。
(運用管理)
運用管理画面に切り替えます。
運用管理画面では、ユーザー管理、アプリ画面へのアプリ表示の調整、アプリの一時停止、ログの閲覧などを行います。ただし、運用管理機能を使用するには運用管理権限が必要です。
(開発)
開発画面に切り替えます。
開発画面ではアプリの開発を行います。ただし、開発機能を使用するには開発権限が必要です。
(ユーザー)
マウスカーソルを合わせると、現在ログイン中のユーザー名が表示されます。クリックすると「ユーザー設定」画面が開きます。(後述)
(Buddy1へ)
クリックすると画面をBuddy1に切り替えます。
(マニュアル)
クリックするとマニュアルと問い合わせの画面が開きます。

10.開発

(アプリの新規作成)
アプリを新規に作成します。
(リポジトリから作成)
リポジトリにあるアプリをコピーして作成します。
(Excelデータから作成)
Excelのシートにある表に基づいて、データベースと一覧・閲覧入力のスクリーンを持つアプリを自動的に作成します。

11.アプリ新規作成

(既存アプリのコピー)
このBuddyサーバー内の既存アプリから選んでコピーして新規アプリを作成します。
(設計情報をアップロード)
このBuddyサーバーまたは他のBuddyサーバーからダウンロードされたアプリの設計情報ファイルをアップロードして、新規アプリを作成します。
※設計情報をダウンロードする方法は後述
(白紙のアプリ)
中身のない新規アプリを作成します。一からアプリを作成するときに使用します。

既存アプリのコピー

<アプリ作成時の制限>

12.リポジトリからのアプリ作成

開発サンプル

13.Excelからのアプリ作成

14.アプリ開発画面

アプリ生成
アプリの生成に関連する機能がまとめられています。
アプリメニュー
アプリの状態を表示するとともに、アプリの管理機能がまとめられています。
アプリ文書
アプリについてのメモとマニュアルを編集できます。
スクリーンテーマ編集
スクリーンテーマ(画面デザインについての設定をまとめたもの)の編集ができます。
絞り込み検索
その下の、DBテーブル設計、DBビュー設計、スクリーン設計、レポート設計、サーバー機能設計、に表示される項目が、入力した文字列を含む名前のものに絞り込まれます。
DBテーブル設計
アプリのデータベースのテーブルを設計します。[新規作成]をクリックすると新規に作成し、既存のものの名前をクリックすると編集できます。
DBビュー設計
アプリのデータベースのビューを設計します。[新規作成]をクリックすると新規に作成し、既存のものの名前をクリックすると編集できます。
スクリーン設計
アプリのスクリーン(画面)を設計します。[新規作成]をクリックすると新規に作成し、既存のものの名前をクリックすると編集できます。
レポート設計
アプリのレポート(ExcelやPDFでの出力)を設計します。[新規作成]をクリックすると新規に作成し、既存のものの名前をクリックすると編集できます。
サーバー機能設計
アプリのサーバー機能(サーバー側で実行されるプログラム)を設計します。[新規作成]をクリックすると新規に作成し、既存のものの名前をクリックすると編集できます。

15.アプリ生成

Babelを使用
InternetExplorerなどの古いブラウザでも新しいJavascriptの機能が使えるようにプログラムの自動変換を行います。
使用すると、実行されるプログラムは設計画面で入力したままではなく変換後のものになるため、デバッグがしにくくなります。必要な場合にのみ使用してください。
キャッシュ
「保持する」では生成時のキャッシュを保持することで生成を速くします。「クリアする」ではキャッシュを使用せずに生成し直します。
通常は「保持する」で構いませんが、何らかの不具合がキャッシュに含まれてしまったような場合に「クリアする」を使用してください。

16.アプリメニュー

アプリ名
英数字によるアプリ名で、URLの一部となるものです。アプリ作成時に指定し、変更できません。
アプリ表示名
日本語を含めて自由に付けられるアプリの名前です。「表示設定」で変更できます。
作者
アプリを作成したユーザーのユーザーIDです。
作成日
アプリを作成した日時です。
バージョン
現在のアプリのバージョン番号です。バージョン番号はアプリの生成の時に増えていきます。
ログインの分離
アプリのログインをBuddy全体のユーザー管理から分離してアプリ独自のユーザー管理をおこなうかどうかを表示します。「権限管理」で変更できます。
フレームワークのバージョン
フレームワークとはボタンやテキストボックスといったスクリーンモジュールなど、アプリの構成要素としてBuddyで提供されているものです。
フレームワークのバージョンはアプリを作成するときに決まります。
アイコン
アプリのアイコンです。「アイコン変更」で変更できます。
デバッグ生成日時
アプリのデバッグ版を生成した日時です。
リリース生成日時
アプリのリリース版を生成した日時です。
ストレージ使用量(開発)、ストレージ使用量(デバッグ)、ストレージ使用量(リリース)
アプリがBuddyサーバーのディスク容量をどれだけ使用しているかを表示します。
Framework変更
アプリのフレームワークのバージョンを変更します。フレームワーク2の場合のみ変更可能です。
Plugin管理
リポジトリにあるプラグインから選んで、このアプリに追加します。
アイコン変更
アプリのアイコンを変更します。サンプルやリポジトリから選ぶほか、画像をアップロードしてアイコンとすることもできます。
表示設定
アプリの表示名、アプリを開いたときの最初のスクリーン、タグを設定します。
タグは、アプリを検索するときの手がかりとなるような何らかの分類名を任意に指定します。アプリの名称と紛らわしくないように、「#」などの記号を先頭につけておくと良いでしょう。
スクリーン設定
最初のスクリーンを「(スクリーン一覧)」にしたときには、タイル状にスクリーンの一覧が表示される画面が最初のスクリーンになります。そのスクリーン一覧にどのスクリーンをどういう順序で表示するかを設定します。
ダウンロード
アプリの設計情報をダウンロードします。アプリのデータを含めるかどうかを選択できます。
ファイル管理
アプリに付随するファイル群を管理します。(後述)
権限管理
アプリの開発と利用の権限を設定します。(後述)
外部Module管理
ファイルとして用意されたモジュールをアプリに組み込みます。スタイルシート(CSSファイル)とスクリプト(Javascriptのライブラリファイル)を組み込むことができます。(後述)
ログ閲覧
アプリのログを閲覧します。(後述)
インポート
アプリのデータを他のアプリからコピーします。データベースのテーブルごとに選択して行うことができます。(後述)
KVストア管理
キーバリューストアという簡易的なデータベースを管理します。(後述)
WebAPI設定
WebAPIは、外部のシステムからアプリのサーバー機能を呼び出してデータのやり取りなどをおこなう仕組みです。アプリでWebAPIの利用を許可するかなどの設定を行います。(後述)
リポジトリ登録
このアプリをリポジトリに登録します。(後述)
アプリ削除
アプリを削除します。削除すると復活はできないので、慎重におこなってください。

16.1.Framework変更

「変更後」のリストから使いたいバージョンを選んで、「OK」をクリックすると変更されます。

「安定版のみを表示」のチェックを外すと、安定版以外の実験的なバージョンもリストに表示されて選択できます。

16.2.Plugin管理

16.3.設計情報のダウンロード

16.4.ファイル管理

フォルダ名 説明
images スクリーンやレポートのモジュールで使用する画像を格納
import DBテーブルの作成やデータインポートに使用するCSVファイルを格納
javascripts アプリで利用するJavascriptのライブラリファイルを格納
outputs レポートの出力で作成されるファイルを格納
style sheets スタイルシート(CSS)ファイルを格納
templates XLSXレポートのExcelテンプレートファイルを格納
theme スクリーンテーマファイルを格納
users ユーザー毎にフォルダを用意する場合のためのフォルダ

16.5.権限管理

説明
許可ユーザー 指定されたユーザーは、その権限を許可される
拒否ユーザー 指定されたユーザーは、その権限を拒否される
許可グループ 指定されたグループに属するユーザーは、その権限を許可される
拒否グループ 指定されたグループに属するユーザーは、その権限を拒否される

ログインの分離

16.6.外部Module管理

16.7.ログ閲覧

16.8.インポート

16.9.KVストア管理

16.10.WebAPI設定

17.アプリ文書

18.スクリーンテーマ編集

変更を保存します。保存後に変更があると赤く表示されます。
操作を元に戻します。
元に戻した操作をやり直します。
補助メニューを開きます。
読込み
「ダウンロード」で保存しておいたスクリーンテーマを読み込む
ダウンロード
現在のスクリーンテーマをファイルとして保存する
リポジトリ登録
現在のスクリーンテーマをリポジトリに登録する
埋込CSS編集
CSSコードを記入してスクリーンテーマに埋め込むことができる(フレームワーク2の機能です。フレームワーク1では使用できません)
テーマ設定
クラス属性を優先するかどうかを指定します。ItemLabelなどのItemXXXクラスはモジュールの種類に応じて自動的に割り当てられます。アイテムのクラス属性で指定したクラスとItemXXXの両方を指定した場合、クラス属性の方を優先するかどうかの指定です。デフォルトは「しない」で、ItemXXXのほうが優先されます。
クラス名 説明
APP_で始まる名前 アプリ全体のパーツに対するクラス名(後述)
DATA_LABEL などの大文字の名前 登録・編集や検索などのテンプレートで作成したスクリーンで設定されているクラス名
Item で始まる名前 モジュールの種類に応じて内部的に付けられているクラス名
クラス名 説明
APP_BODY アプリのHTMLでのBODY
※デフォルトのカーキ色部分の色はこの背景色で指定可
APP_BACKGROUND 各スクリーンの背景
APP_HEDER ヘッダ全体
APP_HEDER_TITLE ヘッダのアプリアイコンとアプリ名部分
APP_HEDER_NAME ヘッダのアプリ名部分
APP_HEDER_MENU_BUTTONS ヘッダの右側のアイコン部分

18.1.主なスタイル属性

属性 説明
left 画面上での位置を指定する(自由配置の場合)
top 画面上での位置を指定する(自由配置の場合)
width 画面上での大きさを指定する
height 画面上での大きさを指定する
padding 内部の余白を指定する
margin 外部の余白を指定する
border 枠線を指定する
color 文字色を指定する
fontSize 文字サイズを指定する
textAlign そのモジュール内の横の配置
lignHeight 一行の高さ
boxSizing 「width」や「height」が「padding」と「margin」を含むかどうか(border-box=含む、content-box=含まない、無指定はborder-boxと同様)
backgroundColor 背景色を指定する
backgroundImage 背景を画像とする場合に指定する

19.DB テーブル設計

19.1.DB テーブル新規作成

19.1.1.既存ファイルから作成

19.2.DB テーブル設計

変更を保存します。保存後に変更があると赤く表示されます。
操作を元に戻します。
元に戻した操作をやり直します。
補助メニューを開きます。
削除
このテーブルを削除します。
履歴
このアプリのデータベースに対する操作の履歴を表示します。過去の状態に戻すこともできます。(後述)
権限設定
このテーブルに対する閲覧・編集の権限をどのユーザーやグループが持つかを設定します。(後述)
ルール設定
このテーブルのデータが常に満たすべきルールを設定します。ルールに反するデータをテーブルに入れようとするとエラーになります。(後述)
トリガー設定
「トリガー」は、このテーブルのデータが、挿入・変更・削除された時にイベントを発生させる仕組みです。スクリーンのスクリプトでイベントにもとづく処理を行うことができます。(後述)
インデックス設定
「インデックス」は、あらかじめデータに索引情報を作っておいて、データ件数が多いときにも高速に読み出せるようにする仕組みです。(後述)
テーブル設定
このテーブルの、テーブル名や表示名の変更、バージョン管理や履歴管理の有無の設定がおこなえます。(後述)
ビュー解析
「ビュー」はテーブルのデータを加工・集計したり、複数のテーブルを組み合わせたりする仮想的なテーブルです。ビュー解析ではどのテーブルがどのビューで使われているかの相関関係を見ることができます。(後述)
テストデータ作成
アプリをデバッグする時には、テーブルにテスト用のデータを入れたい場合があります。そのためのデータを自動生成することができます。(後述)

19.2.1.カラム編集

端の小さな枠
ピンアイコンがあるとプライマリキーであることを示す
「プライマリキー」は、そのテーブルのレコードを一意に識別するキーとなるもの
カラム名
カラムの名前(半角英数字と「_ 」でなければならない)
表示名
わかりやすい日本語表示の名前
「数値」「真偽値」「文字列」「日付・時間」「ファイル」から、どの型のデータを格納するかを選択する
型の詳細
それぞれの型に合わせて詳細を選択する(数値の場合は「自動連番」「整数」「小数点」…など)
詳細設定」ボタン
そのカラムの詳細を設定する(後述)
テンプレートから追加」ボタン
「氏名」「住所」など、良くあるカラムについてリストから選択することで、カラム名、表示名、型、型の詳細をまとめてセットすることができます。(後述)
既定値
レコードを追加する際に値を指定しなかった場合の値
値の範囲
値を「開始後」「終了値」「刻み値」で指定した値のどれかに限定する
選択肢
値をいくつかの選択肢のどれかに限定する
必須
省略できない項目を指定する
読み込み専用
レコードを追加する際に指定した値を後から変更できないようにする
配列
複数の値を格納する(「データ確認」で入力するときは、{値,…}と、カンマ区切りで値を並べ、「{」と「}」で囲む) (※後述)
複数選択
選択肢を指定した場合に、複数選択可を設定する
メモ
覚え書きに使用
削除」ボタン
このカラムを削除します

19.2.2.履歴

19.2.3.権限設定

19.2.4.ルール設定

19.2.5.トリガー設定

DB操作
「INSERT(挿入)」、「UPDATE(更新)」、「DELETE(削除)」、「TRUCATE(空にする)」を指定し、「実行前」「実行後」で、内容の変化が実行される前か後かを指定します。
カラム
指定のカラムの内容変化をトリガとしたい場合に、そのカラムを指定します。
レベル
「文単位」…一度のDB操作に対して一度、「行単位」…変化のあった各レコード毎に、を指定します。
条件式
トリガの起動条件を式で指定します。
式の中では「OLD.カラム名」で変更前の値、「NEW.カラム名」で変更後の値が参照できます。

19.2.6.インデックス設定

19.2.7.テーブル設定

テーブル名
作成時に付けた半角英数字の名前
表示名
わかりやすい日本語表示の名前
バージョン管理
コード化データの履歴問題(※)に対応するためのバージョン管理をおこなうかどうか
履歴管理
データの変更履歴保存をおこなうかどうか
メモ
覚え書きに使用
タイプ
「FLOW」…追加されていくタイプ、「STOCK」…書き換えていくタイプ (今のところ機能上の違いはありません)

19.2.8.ビュー解析

19.2.9.テストデータ作成

19.2.10.データ確認

インポート
デバッグ版やリリース版のデータベースの当該テーブルにCSVデータやエクセルデータを投入する(後述)
エクスポート
デバッグ版やリリース版のデータベースの当該テーブルの内容をファイルに出力する(後述)
データ履歴
履歴管理しているテーブルでデータ変更の履歴を確認できる(後述)
バージョン
バージョン管理しているテーブルでデータのバージョンを閲覧できる(後述)
自動連番設定
自動連番カラムについて番号を設定する(後述)
全選択
全レコードを選択状態にする
選択反転
全レコードの選択状態を反転する
選択解除
全レコードを非選択状態にする
CBにコピー
選択されているレコードをクリップボードにコピーする。一行に一レコードで、カラム間はタブ区切りとなる
データ削除
選択したレコードを削除する

19.3.データインポート

項目 説明
データ行として扱う CSVが1行目からデータ行である場合に指定する。
ヘッダ行として扱う CSVの1行目が項目を表すヘッダ行である場合に指定する。
カラム名やカラムの表示名と一致していれば自動的にそのカラムと対応づけられる。
無視する CSVの1行目が項目を表すヘッダ行である場合に指定するが、カラムとの対応づけを自動で行わず手動で行う時に指定する。

19.4.データエクスポート

19.5.データ履歴

19.6.バージョン情報

19.7.自動連番設定

20.DB ビュー設計

     

20.1.DB ビュー新規作成

一覧ビュー
DBテーブルや他のDBビューを元に、カラムを選ぶ、カラムの順序を指定する、カラムの値から計算した値を得る、条件に合致するレコードに絞り込む、などの加工を施したり、他のDBテーブルやDBビューと結合したりして、得られたレコードの一覧を表示するビューを作成します。
集計ビュー
DBテーブルや他のDBビューを元に、指定したカラムの値によってレコードをグループ化し、グループ毎に指定したカラムの値を集計(合計、カウント、平均など)するビューを作成します。
リンクビュー
他のアプリのDBテーブルを閲覧するビューを作成します。

20.1.1.一覧ビュー

20.1.2.集計ビュー

20.1.3.リンクビュー

20.2.一覧ビューの設計

変更を保存します。保存後に変更があると赤く表示されます。
操作を元に戻します。
元に戻した操作をやり直します。
補助メニューを開きます。
削除
このテーブルを削除します。
履歴
このアプリのデータベースに対する操作の履歴を表示します。過去の状態に戻すこともできます。DBテーブル設計の補助メニューの「履歴」と同じです。(前述)
権限設定
このビューに対する閲覧の権限をどのユーザーやグループが持つかを設定します。(後述)
抽出条件設定
ビューでは元となったテーブルやビューのレコードすべてではなく、条件に合致したものだけを抽出することができます。その条件を設定します。(後述)
ビュー設定
ビュー名、表示名、種類、メモを設定することができます。(後述)
ビュー解析
ビュー解析ではどのテーブルがどのビューで使われているかの相関関係を見ることができます。DBテーブルの補助メニューの「ビュー解析」と同じです。(前述)

20.2.1.カラム編集

20.2.2.テーブルリンク編集

20.2.3.権限設定

20.2.4.ビュー設定

20.2.5.抽出条件設定

20.3.集計ビューの設計

グループ項目
そのカラムの値でグループ化し、元のテーブル・ビューで同じ値のレコードを、ビューの一レコードにまとめます。
合計、カウント、最大、最小、平均
それぞれの方法で、まとめられたレコードのこのカラムの値を集計します。
集計と無関係の式
カラムの値を用いない式、あるいは合計、カウント、最大、最小、平均以外の集計関数を用いた式を指定することができます。

20.4.リンクビューの設計

21.スクリーン設計

  1. アプリの各画面として使われる。これが基本的な使われ方です。それぞれURLを持ち、相互に遷移できます。

  2. ダイアログの内容として使われる。

  3. スクリーンコンテナという仕組みによって他のスクリーンに埋め込んで表示するものとして使われる。

21.1.スクリーン新規作成

白紙の画面
中身のない画面を作成します。
閲覧画面
DBテーブルやDBビューの内容を一レコードずつ表示する画面を作成します。メインのテーブル・ビューと一対多の関係になる明細テーブル・ビューを指定することもできます。
入力画面
DBテーブルのレコードを追加・編集する画面を作成します。メインのテーブルと一対多の関係になる明細テーブルを指定することもできます。
検索画面
検索条件を入力して、それに該当するDBテーブルやDBビューの内容を一覧表形式で表示する画面を作成します。
一覧画面
(フレームワーク2の場合のみ)検索条件での絞り込み、データの追加・閲覧・編集(次の閲覧・入力画面をダイアログで使用)、インポート、エクスポートの機能を持った一覧画面を作成します。
閲覧・入力画面
(フレームワーク2の場合のみ)閲覧・入力をおこなう画面を作成します。上記の一覧画面と組み合わせて使います。
メニュー画面
いくつかの画面へのメニューとなる画面を作成します。
既存の画面をコピー
既存のスクリーンをコピーして新規作成します。

21.1.1.白紙の画面

21.1.2.閲覧画面

21.1.3.入力画面

テキストボックス
テキストボックスに文字入力します。
データインプット
対象のカラムの型に応じた入力方法となります。
文字列
入力せず表示するだけの場合。
プルダウンリスト
選択肢から選んで入力します。
コンボボックス
選択肢から選ぶほか、文字入力もできます。
文字入力
テキストボックスに文字入力します。
TEXTAREA
複数行のテキストボックスに文字入力します。
プルダウン
選択肢から選んで入力します。
チェックBOX
チェックボックスで入力します。
ラジオ
ラジオボタンで入力します。
日時入力
日時入力のダイアログで入力します。
リスト
選択肢の表から選んで入力します。
ファイル選択
ファイルを選択します。
文字列
入力せず表示するだけの場合。
画像
画像を表示します。

21.1.4.検索画面

 
テキストボックス
テキストボックスに文字入力します。
データインプット
対象のカラムの型に応じた入力方法となります。
プルダウンリスト
選択肢から選んで入力します。
コンボボックス
選択肢から選ぶほか、文字入力もできます。

21.1.5.一覧画面

21.1.6.閲覧・入力画面

文字入力
テキストボックスに文字入力します。
TEXTAREA
複数行のテキストボックスに文字入力します。
プルダウン
選択肢から選んで入力します。
チェックBOX
チェックボックスで入力します。
ラジオ
ラジオボタンで入力します。
日時入力
日時入力のダイアログで入力します。
リスト
選択肢の表から選んで入力します。
ファイル選択
ファイルを選択します。
文字列
入力せず表示するだけの場合。
画像
画像を表示します。

21.1.7.メニュー画面

21.1.8.既存の画面をコピー

21.2.スクリーン設計

※フレームワーク1のアプリの場合

 

※フレームワーク2のアプリの場合

変更を保存します。保存後に変更があると赤く表示されます。
操作を元に戻します。
元に戻した操作をやり直します。
補助メニューを開きます。
削除
このスクリーンを削除します。
履歴
保存の履歴を表示します。指定した履歴の状態に戻すことができます。(後述)
全画面表示
大きなダイアログでスクリーン全体のイメージを表示します。
スタイルコピー
アイテム(画面に配置したモジュール)のスタイルを、他のスクリーンのアイテムからコピーします。(後述)
作り直す
フレームワーク1のアプリのみ)このスクリーンを作成した時のテンプレートに戻って、テンプレートの設定を調整して再度スクリーンを作成します。(後述)
権限設定
このスクリーンを閲覧する権限を設定します。(後述)
スクリーン設定
このスクリーン全体についての設定を行います。(後述)
グリッド設定
グリッドレイアウトのスクリーンの場合に、グリッドを追加・削除したり順序を入れ替えたりします。(後述)

21.2.1.BOXレイアウトとモジュール配置

BOX 配置方法
横配置BOX 右へ右へと配置されていき、領域の幅に納まらない場合は折り返される
縦配置BOX 下へ下へと配置されていく
自由配置BOX 自由な位置に配置できる
(太い枠線)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムに太い枠線が付くようにスタイルがセットされます。
(細い枠線)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムに細い枠線が付くようにスタイルがセットされます。
(外枠)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムに細い枠線が付くようにスタイルがセットされます。ただし、グリッドスクリーンで複数のグリッドやアイテムを選択している時にはそれらを囲むように細い枠線がつきます。
(枠線なし)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムの枠線が取り除かれます。
(枠線の色)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると色選択ダイアログが開き、選択中のアイテムの枠線に選択した色が付くようにスタイルがセットされます。
(背景の色)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると色選択ダイアログが開き、選択中のアイテムの背景に選択した色が付くようにスタイルがセットされます。
(アイテムを前へ移動)
選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムの位置が一つ前に移動します。
(アイテムを後ろへ移動)
選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムの位置が一つ後ろに移動します。
(削除)
選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムを削除できます。
(アイテムを複製)
選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムが複製されます。BOXを選択中の場合は、BOX内のアイテムも複製されます。複製によって作られたアイテムのアイテム名は「_1」のような枝番が付いたものになります。
(スタイル編集)
選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムのスタイルを編集するダイアログが開きます。(アイテム属性の「スタイル」の「編集」ボタンをクリックするのと同じです。)
(枠線を表示)
各アイテムの占める領域を点線で囲んで示します。アイコンが緑になっているとこの機能がオンです。
(機能編集モード)
アイテムの機能を編集するモードにします。アイコンが緑になっているとこの機能がオンです。

21.2.2.BOXの機能(フレームワーク2)

繰り返し機能

アイテムセット

ボタンメニュー作成
ボタンが並んだメニューを作成します。指定の名前でボタンを作るほか、スクリーンの一覧から選択してスクリーンの名前のボタンを作ることもできます。
テーブル入力作成
データベースの入力・表示用アイテムを配置できます。対象のDBテーブルやDBビューを選び、カラムと使用するモジュールの種類を選択すれば作成されます。
中央寄せフレーム作成
BOXを画面幅いっぱいにするとともに、その中に画面の左右中央に配置されるBOXを作成します。

21.2.3.グリッドレイアウトとモジュール配置

 
(太い枠線)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムに太い枠線が付くようにスタイルがセットされます。
(細い枠線)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムに細い枠線が付くようにスタイルがセットされます。
(外枠)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムに細い枠線が付くようにスタイルがセットされます。ただし、グリッドスクリーンで複数のグリッドやアイテムを選択している時にはそれらを囲むように細い枠線がつきます。
(枠線なし)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムの枠線が取り除かれます。
(枠線の色)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると色選択ダイアログが開き、選択中のアイテムの枠線に選択した色が付くようにスタイルがセットされます。
(背景の色)
フレームワーク2)選択中のアイテムがあるときに表示されます。クリックすると色選択ダイアログが開き、選択中のアイテムの背景に選択した色が付くようにスタイルがセットされます。
(行を追加する)
選択中に表示されます。クリックすると選択中のセルの下に一行追加します。
(列を追加する)
選択中に表示されます。クリックすると選択中のセルの右に一列追加します。
(行を削除する)
選択中に表示されます。クリックすると選択中のセルを含む行を削除します。
(列を削除する)
選択中に表示されます。クリックすると選択中のセルを含む列を削除します。
(選択したセルを結合する)
複数のセルが選択されている時に表示されます。クリックすると選択されているセルを含む矩形領域を一つのセルに結合します。
(セルの結合を解除する)
結合されたセルを選択中に表示されます。クリックすると結合を解除します。
(削除)
選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムを削除できます。
(スタイル編集)
選択中のアイテムがあるときに表示されます。クリックすると選択中のアイテムのスタイルを編集するダイアログが開きます。(アイテム属性の「スタイル」の「編集」ボタンをクリックするのと同じです。)
(枠線を表示)
セルを区切る線を表示します。アイコンがオレンジになっているとこの機能がオンです。
(機能編集モード)
アイテムの機能を編集するモードにします。アイコンがオレンジになっているとこの機能がオンです。

21.2.4.モジュールの概要

レイアウト用
横配置BOX
その内部が横配置になる
縦配置BOX
その内部が縦配置になる
自由配置BOX(フレームワーク1のみ)
その内部が自由配置になる
水平区切り線(フレームワーク2では区切り線)
水平の区切り線
垂直区切り線(フレームワーク1のみ)
垂直の区切り線
入力・選択用
ボタン
クリックすることで何らかの操作をさせる。
データインプット(フレームワーク1のみ)
DBテーブルのカラムを指定して、そのカラムの属性に適した入力をおこなう。
テキストBOX(フレームワーク1)
テキストを入力する(単行または複数行)。
文字入力(フレームワーク2)
テキストを入力する(単行)
TEXTAREA(フレームワーク2)
テキストを入力する(複数行)
チェックBOX
オン/オフを切り替える。
ラジオボタン
いくつかの中のひとつだけをオンにする。
(選択グループ名が同じラジオボタンはその中のひとつしかオンにならない)
プルダウンリスト
選択肢(リスト)の中から選ぶ。
コンボBOX
テキストBOXとプルダウンリストを兼ねたもの。
トグルスイッチ(フレームワーク1のみ)
オン/オフを切り替える。
スライダー
左右にスライドすることで最小値から最大値の間を指定する。
日付選択
日付または日時を選択する。
色選択
色を選択する。
DBレコードセレクタ
DBテーブルのレコードを選択する。
タブ
タブ形式のメニューから選択する。(スクリーンコンテナで入れ子にした画面を切り替える時などに使用する)
メニュー
メニューから選択する。(BOXレイアウトでは第一階層のメニュー項目が横に表示されるが、グリッドレイアウトではクリックすると第一階層のメニュー項目が縦に開く動作となる)
ファイル選択
パソコンの中のファイルを選択し、内容を取得したり、サーバーにアップロードしたりする。
表示用
画像
画像を表示する。
文字列
文字列を表示する。
リスト
一行ずつの文字列をリストとして表示する。また表示方法を切り替えると、ラジオボタンやチェックボックスの並びとして表示することもできます。
箇条書き(フレームワーク1のみ)
先頭にマークがついたリスト。
テーブル
文字列を表形式で表示する。
DBテーブル(フレームワーク1のみ)
DBテーブル・ビューの内容を一覧表の形で表示する。
スピン(フレームワーク1のみ)
動作中であることを回転で示す。
プログレスバー(フレームワーク1のみ)
進行状況を表示する。
カレンダー
カレンダーを表示する。
タイムテーブル
タイムテーブル(ガントチャート的なもの)を表示する。
クロス集計
DBテーブル・ビューに対してクロス集計をおこなう。
地図
地図を表示する。
グラフ
グラフを表示する。
キャンバス
HTML5のCANVAS要素を埋め込む。(スクリプトによって図形の描画が可能)
埋め込み・連携
スクリーンコンテナ
他のスクリーンを埋め込む。繰り返すこともできる。
IFrame
他のWEBページを埋め込む。

21.2.5.プラグインの利用(フレームワーク2)

プラグインの一覧

※スクリーンモジュールのプラグイン

Canvas
Canvasを表示するモジュール。スクリプトで図形、文字、画像を表示することができる。
iframe
HTML文書や他のサイトをその中に表示する、iframeを表示するモジュール。
PDF閲覧
PDFを表示するモジュール。また、PDFから内容の文字列を取得したり、PDFを画像化したりする機能もbuddy.lib.PDF()で得られるオブジェクトを通じて提供されます。
QRコード
指定した文字列のQRコードを表示するモジュール。また、QRコードを読み取るライブラリ機能も提供。
カレンダー
カレンダーを表示するモジュール。スクリプトでクリックされた日付を得たり、日付欄に文字を表示したりできる。
クロス集計
クロス集計設定モジュールとクロス集計表モジュール。クロス集計設定では列ラベル、行ラベル、集計値をドラッグアンドドロップで設定できる。
設定した内容は専用のクロス集計表モジュールで表示できる他、グラフプラグインを使ってグラフ化することも可能。
グラフ
グラフを表示するモジュール。折れ線、棒、円などのグラフを表示できる。
コメント
コメントを表示・入力するモジュール。データのIDなどごとに分けてコメントを管理できる。
コンボBOX
キーボード入力と選択肢からの選択を併用できる、コンボボックスのモジュール。
スタンプ
承認欄のようなスタンプを表示・入力するモジュール。「承認」「保留」のようなスタンプの種類は自由に指定できる。また、スタンプを押すことができるアカウントを設定できる。
スライダー
マウスでドラッグして値を調整できるスライダーのモジュール。
タブ
横並びの選択ボタンから一つを選ぶタブのモジュール。
ダイアログ入力
表示上はテキストボックスだが、クリックするとダイアログが開いて入力するモジュール。テキスト入力とリストからの選択が可能。
ファイルプレビュー
ファイルを選択した際に内容を表示するモジュール。対象は、画像ファイル(jpg、pngなど)、テキストファイル(txt、csvなど)。
ファイルリスト
ファイルの一覧を表示するモジュール。スクリプトでアプリのfiles領域内の指定のディレクトリ内のファイル一覧を得てセットすることで表示する。
リンク
文字列をリンクとして表示するモジュール。
動作ボタンセット
クリックしたときの動作があらかじめ組み込まれたボタンモジュール。画面移動、レポート出力、データインポート、データエクスポート、通知の5種類がある。よくある動作をスクリプトを書かずに実現できる。
区切り線
区切り線を表示するモジュール。
地図
地図を表示するモジュール。緯度、経度、倍率を指定できる。スクリプトでクリックされた位置の緯度・経度を得たり、指定の位置にマーカーを表示したりできる。
多段選択
複数のプルダウンリストで、上位の選択によって下位の選択肢が変化するモジュール。
履歴操作ダイアログ
履歴管理を「完全」と設定したDBテーブルについて、履歴を表示するモジュール。操作したアカウント、操作内容、日時がわかるほか、削除や更新について処理前の状態を復元することも可能。
手書入力
手書きで文字や図形を入力できるモジュール。入力内容は画像として保存できる。
既読
その画面を開いたアカウントと日時が記録され、その一覧を表示できるモジュール。
画像付リスト
各選択肢に画像も表示されるリストモジュール。
色選択
色を選択するモジュール。クリックで色選択ダイアログが開き、選択した色が表示される。

※buddy.libに機能を追加するもの

CSVサポート
CSVを読み取る機能が、buddy.lib.CSV.parse() として追加されます。
OCRサポート
OCR(Optical Character Recognition/光学的文字認識)とは、印刷されたドキュメントを写真やスキャンで取り込んで文字を認識する技術です。画像を解析して画像の中にある文字列を抽出する機能が、buddy.lib.OCR.recognize()として追加されます。
XMLサポート
XMLを読み取る機能が、buddy.lib.XML.parse() として追加されます。
docxサポート
Microsoft Wordのdocxファイルから、ファイル内の文字列を読み取る機能が、buddy.lib.MSDOC()として追加されます。
markdownサポート
markdown形式のテキストをHTMLに変換する機能が、buddy.lib.Markdown.parse() として追加されます。また、buddy.lib.Markdown.styles で表示に必要なCSSも提供されます。

※その他のプラグイン

レイアウト画面テンプレートセット
スクリーンを新規作成するときのテンプレートを追加します。今のところ次の二つがあります。
画面切り替えメニュー … 左側に画面名のメニューがあり、選択したものが右側のスクリーンコンテナ内に表示されるスクリーン。
中央寄せ画面 … ブラウザの幅が指定の幅を超えると内容が中央寄せで表示されるスクリーン。
拡張フィルタ
フィルタ(文字列や文字入力モジュールなどで指定して表示文字列を加工するもの)を追加します。

21.2.6.アイテム属性

アイテム名
アイテムの名称で、半角英数字と「_」で記述します。スクリーン内で重複しないようにしなければなりません。
アイテムの種類
どのモジュールかを示します。変更できません。
アイテムのクラス
スクリーンテーマによるスタイル指定をおこなう場合に指定します。手入力することも、既存のものから選択することもできます。「編集」ボタンをクリックすると、指定したクラス名に対応するスタイルを編集することができます。
部分クラス
複合的なモジュールの場合に、部分ごとにクラス名を指定したい場合に利用します。利用できる場合は「編集」ボタンが表示されるので、クリックすると編集できます。
スタイル
このアイテムに対して個別的にスタイルを指定したい場合に利用します。「編集」ボタンをクリックすると編集することができます。
表示
ボタン、テキストボックスなど、何らかの文字列を表示するモジュールで、その表示する文字列を指定します。
選択肢
フレームワーク2ではリスト)
プルダウンリスト、箇条書きなど、選択肢をともなうものでは選択肢属性があります。「編集」ボタンをクリックすると編集できます。(後述)
使用不可
「はい」にすると、使用できない状態になります。例えばボタンであればクリックしてもイベントが発生しなくなります。
読み取り専用
入力用のモジュールの場合に、「はい」にすると入力ができなくなります。例えばテキストボックスであれば表示専用となります。
改行
「はい」にすると、横配置BOX内に配置したとき、そのアイテムの右で改行して次のアイテムは次の行に表示されるようになります。
数式
フレームワーク2では自動計算)
テキストボックスやデータインプットで、他のアイテムの値にもとづいて計算した結果を表示したいときに利用します。「編集」ボタンをクリックすると編集できます。(後述)
テーブル名
カラム名
フレームワーク2ではデータリンク)
DBテーブル・ビューの名前とそのカラム名を指定します。スクリーンのスクリプトで、この指定にもとづいてアイテムの値とデータベースの値をやり取りします。アイテム属性でテーブル名・カラム名を指定しただけではダメで、スクリプトの記述が必要であることに注意してください。(後述)

21.2.7.モジュールの主なアイテム属性

入力・選択用
データインプット
テーブル名、カラム名…対象のテーブル・カラムを指定。
サムネイル表示…画像型のカラムの場合に「はい」にすると画像のサムネイル表示。
ダイアログ使用…
複数行…「はい」にすると複数行入力可。
プレースホルダ・・・入力欄が空の場合に表示される説明文を指定する。あらかじめ入力内容をセットするには「表示」属性で指定する。
テキストBOX
フレームワーク2では文字入力)
プレースホルダ・・・入力欄が空の場合に表示される説明文を指定する。あらかじめ入力内容をセットするには「表示」属性で指定する。
チェックBOX
表示・・・チェックBOXの横に表示される文字列
ラジオボタン
表示  ・・・ラジオボタンの横に表示される文字列。
選択グループ名・・・ラジオボタンをグループ化する名前(この名前が同じラジオボタンはその中のひとつしかオンにならない)。
プルダウンリスト
選択肢(フレームワーク2ではリスト) ・・・「編集」をクリックすると設定用ダイアログが開く
選択肢の自動読込(フレームワーク2) ・・・「はい」にすると、「データリンク」でセットしたカラムから選択肢を読み込みます。
コンボBOX
選択肢(フレームワーク2ではリスト)・・・「編集」をクリックすると設定用ダイアログが開く
スライダー
最小値 ・・・最小値
最大値 ・・・最大値
ステップ ・・・刻み値
日付選択
範囲先頭日 ・・・選択範囲の先頭日
範囲末尾日 ・・・選択範囲の末尾日
時刻使用 ・・・「時分秒」または「時分」で時刻も選択
時選択肢 ・・・時の選択肢をカンマ区切りで
分選択肢 ・・・分の選択肢をカンマ区切りで
タブ
タブ ・・・タブの項目を指定する。クリックすると項目編集用ダイアログが開く
メニュー
メニュー・・・メニューの項目を指定する。クリックすると項目編集用ダイアログが開く
ファイル選択
ファイルタイプ・・・選択できるファイルの種類
※ファイルタイプを画像にすると、スマホなどではファイル選択時にカメラを起動して撮影した画像を使うことができる
表示用
画像
ソース ・・・表示する画像ファイルを指定する
画像の伸縮 ・・・「伸縮なし」では画像ファイルのもとのサイズのままで画像モジュールの大きさを左上隅にあわせて表示する。「横幅にあわせる」では画像の横幅をモジュールの横幅にあわせるように伸縮。「高さにあわせる」では画像の高さをモジュールの高さに合わせるように伸縮。「両方にあわせる」では横幅と高さの両方をあわせるように伸縮。「縦横比保持で納める」では画像ファイルのもとの縦横比を保持してモジュールの大きさに納まるように伸縮。
文字列
リンク表示 ・・・(フレームワーク1のみ)「はい」にするとURLなどと扱ってリンク表示する(クリックすると開く)。(フレームワーク2では、プラグインとしてリンクモジュールが用意されている。)
フィルタ・・・適用するフィルタ名をカンマ区切りで指定。(リンク表示と両方指定した場合、フィルタは表示する文字列に適用され、リンク先のURLなどはフィルタ適用前のものとなる。)
リスト
複数選択・・・「はい」にすると複数の項目が選択できる。
リストの種類・・・リスト、ラジオボタン/チェックボックス(縦並び、横並び)を選択。複数選択だとチェックボックスになる。
選択肢(フレームワーク2ではリスト) ・・・「編集」ボタンをクリックすると設定用ダイアログが開く。
箇条書き
フレームワーク1のみ)
選択肢 ・・・「編集」ボタンをクリックすると設定用ダイアログが開く。
カレンダー
年、月・・・カレンダーの年月。省略すると当月のカレンダーが表示される
タイムテーブル
開始時・・・左端時刻を時の数値で指定。
終了時・・・右端時刻を時の数値で指定。
開始日・・・表示の開始日。
日数・・・何日分表示するか。
地図
緯度 ・・・地図の中心の緯度。
経度 ・・・地図の中心の経度。
ズーム・・・地図の倍率。
埋め込み・連携
スクリーンコンテナ
スクリーン名 ・・・その中に表示するスクリーンを指定する。
IFrame
ソース ・・・その中に表示するWEBページのURL。

21.2.8.クラスとスタイル

クラス
スタイル

21.2.9.選択肢(フレームワーク1)

21.2.10.リスト(フレームワーク2)

21.2.11.数式(フレームワーク1)

21.2.12.自動計算(フレームワーク2)

21.2.13.履歴

21.2.14.スタイルコピー

21.2.15.作り直す(フレームワーク1)

21.2.16.権限設定

21.2.17.スクリーン設定

属性 説明
スクリーン名 新規作成時に指定したスクリーン名
表示名 自由に名前をつけることができる
タイプ 「ページ」と「コンテナ」から選択する
※ページ ・・・独立した画面として表示されるもの
※コンテナ・・・スクリーンコンテナモジュール(後述)の中に配置することで他のスクリーンの中に入れ子にして表示するためのもの。あるいはダイアログとして表示するためのもの。コンテナタイプのスクリーンは、アプリの最初のスクリーンをスクリーン一覧にした場合に一覧には表示されない。
スクリーンのクラス クラス名を指定する (※この設定はまだ機能しません)
編集領域の幅 編集領域の画面幅(ピクセル)を指定する。レイアウト編集の表示はこの幅に合わせたものになる
編集領域の高さ <BOXレイアウトの場合>編集領域の画面高さ(ピクセル)を指定する
表示領域幅上限 <グリッドレイアウト>グリッドの表示領域の幅(ピクセル)の上限(画面幅がこれより大きくなると、両側に余白が取られる)
モバイル対応幅 アプリ実行時の画面幅がこれより小さくなると次のようになる
<BOXレイアウト>「モバイル用画面」が指定されていればそのスクリーンが代わりに表示される
<グリッドレイアウト>「モバイル用画面」が指定されていればそのスクリーンが代わりに表示される。「モバイル用画面が指定されていない場合、各グリッドの幅指定はすべて100%とみなされて縦に並ぶようになる。また、「モバイル対応」が「する」のグリッドでは行のセルが横でなく縦に並ぶようになる
モバイル用画面 アプリ実行時の画面幅が「モバイル対応幅」未満の場合、代わりに表示するスクリーン名を指定する
メモ 開発上で記録しておくためのメモ

21.2.18.グリッド設定

21.2.19.ファイル型カラムでのデータインプット(フレームワーク1)

21.3.スクリプト

21.3.1.スクリプト編集とイベントハンドラ一覧

「コード挿入」ボタン
よくあるプログラムコードを、ダイアログで選択することで入力することができます。(後述)
「名前挿入」ボタン
スクリプト中で記述が必要となる、DBテーブル・ビュー名やカラム名、スクリーン名、レポート名、サーバー機能名について、ダイアログで選択することで入力することができます。(後述)
検索テキストボックスと
テキストボックスに入力してをクリックすると、スクリプトから入力文字列を検索できます。
(詳細検索)
詳細検索モードにして、正規表現による検索や置換などを行えるようにします。再度クリックすると詳細検索モードを解除します。(後述)
(スクリプト編集設定)
スクリプト編集領域のテーマ(色合い)とフォントサイズについての設定をおこないます。

フレームワーク1でのスクリプト

フレームワーク1では、空のスクリーンでは次のスクリプトがあらかじめセットされています。

module.exports = function(api){
	var actions = {
		
	};
	var events = {
		onLoad: function(){
        
		},
		onUnload: function(){

		},
	};
	var formulas = {
		
	};

	return {
		"actions": actions,
		"events": events,
		"formulas": formulas,
	};
};
var actions = {
	foo: function(){
		…
	},
var events = {
	BUTTON1_onClick: function(){
		…
	},

フレームワーク2でのスクリプト

buddyscreen.on("load", async(evt)=>{
    //初期化処理
})

buddyscreen.on("unload", async(evt)=>{
	
})

buddyscreen.on("receive", async(evt)=>{
	
})
buddyscreen.items.BUTTON1.on('click', async(evt)=>{
	// イベント発生時に実行する処理を記述する
})
function foo() {
    …
}

buddyscreen.on("load", async(evt)=>{
    foo();
})
//ログインユーザー(自分自身)の情報を得る
const userInfo = await buddy.api.getUserInfo();
// userInfo.user_id //ユーザーID
// userInfo.name //表示名
// userInfo.guset //ゲストアカウントかどうか(true/false)

21.3.2.繰り返しBOXの操作(フレームワーク2)

    buddyscreen.items.HORIZONTAL1.repeat = 3;
    value = buddyscreen.items.TEXTBOX1[0].value;
    buddyscreen.items.TEXTBOX1[1].value = "foo";
    buddyscreen.items.BUTTON1.on('click', async(evt)=>{
        // evt.index で繰り返しの何番目かがわかる
        …
    });
    buddyscreen.items.TEXTBOX1.on('change', async(evt)=>{
        buddyscreen.items.TEXTBOX2[evt.index].value = evt.value * 10;
    }

21.3.3.コード挿入と名前挿入

※フレームワーク1

※フレームワーク2

21.3.4.formulasと数式(フレームワーク1)

21.3.5.自動計算と数式(フレームワーク2)

22.レポート設計

22.1.レポート新規作成

22.2.レポート新規作成 ~ PDF

22.3.PDFレポート設計

変更を保存します。保存後に変更があると赤く表示されます。
操作を元に戻します。
元に戻した操作をやり直します。
補助メニューを開きます。
削除
このレポートを削除します。
レポート設定
このレポートについての設定を行います。(後述)
テスト出力
実際に出力したPDFを表示できます。データベースのデータから指定した件数が出力に使われます。(後述)

レイアウト編集

(削除)
選択中のアイテムを削除します。
(ガイドを表示)
アイテムの位置や大きさを、ガイドの格子に沿った位置に限定します。アイコンが青色だとこの機能がオンです。ガイド格子のサイズを選択して変更できます。この機能がオフだと自由な位置とサイズに配置できます。
レイアウト編集領域の表示倍率を変更します。倍率を低くするとページ全体など広い範囲を表示でき、倍率を高くすると細かな位置調整などがやりやすくなります。

モジュール

モジュール 説明
文字列 文字列を表示
データ 指定したデータソース(DBテーブルやDBビュー)の指定のカラムの値を表示
真偽値 指定した条件式の値が真か偽かによって表示を切り替える
画像 画像を表示(JPEGまたはPNG)
Javascriptの式の値を表示し、式の中でカラムの値を参照できる
領域 領域を入れ子にする
タイプ 説明
自由配置 領域内の自由な位置にモジュールを配置できる
横配置 右へ右へとモジュールが配置される
縦配置 下へ下へとモジュールが配置される
テーブル 項目名などを示すためのヘッダ行と繰り返されるデータ行からなり、行内は横配置

データソースにはDBテーブル・ビュー、CSVファイル、JSDATA(Javascriptのデータ)を指定することができます。ダイアログ上部の「データベース」「CSV」「JSDATA」で切り替えます。

アイテム属性

属性 説明
アイテム名 半角英数と「_ 」による名前
アイテムの種類 モジュールのタイプ
左位置 アイテムの領域左端からの位置
上位置 アイテムの領域上端からの位置
横幅 アイテムの幅
高さ アイテムの高さ
重なり順 領域内でのアイテムの重なりの前後関係を決める数値を指定(数値が大きいほど手前に表示、省略すると0)
内容 表示する内容(データの場合はカラム名、式の場合は式、画像の場合は画像ファイルパス名
フィルタ 適用するフィルタ名をカンマ区切りで指定
文字揃え 表示する文字列の配置を選択。省略すると両端寄せ(末尾行は左寄せ、それ以外は両端寄せ)
フォント フォントを選択
フォントサイズ フォントのサイズ(ポイント)フォント
文字色 文字色
余白 周囲の余白
枠線表示 枠表示指定(上下左右の表示したいものにチェック)
枠線の種類 実線または破線1~4(破線は1が細かく、2、3、4と粗くなる)
枠線の太さ 枠線幅
枠線の色 枠線色
枠線の高さ 「内容にあわせる」「アイテムにあわせる」から選択(デフォルトは内容に合わせる)
画像表示 データモジュールでカラムが画像の場合に画像として表示するか
画像伸縮 画像の場合に、widthとheightに画像をどうあわせるかを指定
テストのみ使用 「はい」にすると、設計画面のテスト出力では表示されるが、アプリでの出力では表示されない
領域 説明
条件式 真偽を判定する条件式を指定します(式の中では this.data.カラム名 でカラム値が指定できます)
表示方法 「チェックボックス」「○で囲む」「文字列」から選択します。チェックボックスは真の場合チェックが入ります。「○で囲む」は真の場合に楕円で囲みます。「文字列」は次の真文字列または偽文字列を表示します。
真文字列 真の場合に表示する文字列
偽文字列 偽の場合に表示する文字列
領域 説明
領域名 半角英数と「_ 」による名前
領域の種類 タイプを選択
データソース データソース
左位置 親領域左端からの位置
上位置 親領域上端からの位置
領域の横幅 領域の幅
領域の高さ 領域の幅(高さ)
枠線表示 枠表示指定(上下左右の表示したいものにチェック)
枠線の種類 実線または破線1~4(破線は1が細かく、2、3、4と粗くなる)
枠線の太さ 枠線幅
枠線の色 枠線色
繰返し方向 データソースを指定した場合の繰り返し方向(現在は DOWN のみ)
繰返回数/1頁 繰り返しを何件ずつで区切るか

レポート設定

項目 説明
タイプ 今のところ PAGE に固定
メモ 開発上のメモ
フォント デフォルトのフォント
フォントサイズ デフォルトのフォントサイズ(ポイント)
フォント色 デフォルトの文字色(#RRGGBB)
余白 用紙周囲の余白

テスト出力

位置ガイドとしての背景画像

22.4.レポート新規作成 ~ Excel

22.5.Excelレポート設計

変更を保存します。保存後に変更があると赤く表示されます。
操作を元に戻します。
元に戻した操作をやり直します。
補助メニューを開きます。
削除
このレポートを削除します。
レポート設定
このレポートについての設定を行います。(後述)
テスト出力
実際に出力したExcelを表示できます。デバッグ用データベースのデータから指定した件数が出力に使われます。(後述)

レポート設定

テスト出力

22.6.Excel テンプレートファイルの編集

入れ子のrepeat ①~group による方法
入れ子のrepeat ②~ srcによる方法
Excelの数式の扱い

22.7.レポートの使用

説明
where 絞り込み条件
order 並べ替え指定
offset 何件目から出力するか(先頭が0)
num 何件出力するか

22.8.スクリプトで与えたデータの出力

jsdata: {
    shain: [
        { namae: ‘田中’, nenrei: 34, … },
        { namae: ‘鈴木’, nenrei: 45, … },
        …
    ],
    kokyaku: [
        …
    ]
}

23.フィルタ

<一般>

フィルタ 説明
TRIM 前後の半角スペースやタブを取り除く。オプションパラメータで数字を指定するとその文字数で切る。

<数値>

フィルタ 説明
COMMA 桁区切りのカンマを挿入する。
YEN ¥表記する(桁区切りのカンマ挿入もおこなう)。

<日時関係>

フィルタ 説明
YMD 日付(Date型またはDate型に変換できる文字列)をyyyy/mm/ddにする。オプションパラメータ「h」を付けると区切りが「/」でなく「-」になる。オプションパラメータ「1」を付けると0を付けない。
JYMD 日付(Date型またはDate型に変換できる文字列)を yyyy年mm月dd日 にする。オプションパラメータ「1」を付けると0を付けない。
GYMD 日付(Date型またはDate型に変換できる文字列)を 元号y年m月d日 にする。
YMDHMS 日時(Date型またはDate型に変換できる文字列)をyyyy/mm/ddhh:mm:ssにする。オプションパラメータ「h」を付けると区切りが「/」でなく「-」になる。オプションパラメータ「1」を付けると0を付けない。オプションパラメータ「s」を付けると秒を省略。
JYMDHMS 日時(Date型またはDate型に変換できる文字列)を yyyy年mm月dd日 hh時mm分ss秒にする。オプションパラメータ「1」を付けると0を付けない。
HMS 時刻(Date型または文字列)を hh:mm:ss にする。オプションパラメータ「1」を付けると0を付けない。オプションパラメータ「s」を付けると秒を省略。
AGE 日付(Date型またはDate型に変換できる文字列)を誕生日として現在の満年齢にする。オプションパラメータ「d」を付けると日単位計算(誕生日前日に年を取る)となる。

※ 日付関係のフィルタでは、「元号y年m月d日」の形式の文字列も受け付けるようになっていますので、元号表記と西暦表記の相互変換に使用することができます。

※ 日付関係のフィルタでは、ISO8601の「2016-06-01T10:20:30.456Z」の形式(タイムゾーンはZの他「+0900」「+09:00」もOK)にも対応しています。

<文字種変換>

フィルタ 説明
HIRA2KATA ひらがなをカタカナにする
KATA2HIRA カタカナをひらがなにする
ZEN2HAN 全角英数記号を半角にする
HAN2ZEN 半角英数記号を全角にする
ZEN2HANKATA 全角カナを半角カナにする
HAN2ZENKATA 半角カナを全角カナにする

24.サーバー機能設計

24.1.サーバー機能新規作成

白紙のサーバー機能
空の状態のサーバー機能を作成します。一から作成するときに使用します。
データインポート
DBテーブルにCSVファイルからデータを入力する内容のサーバー機能を作成します。
データエクスポート
DBテーブル・ビューのデータをCSVファイルに書き出す内容のサーバー機能を作成します。

24.2.サーバー機能設計

変更を保存します。保存後に変更があると赤く表示されます。
操作を元に戻します。
元に戻した操作をやり直します。
補助メニューを開きます。
削除
このサーバー機能を削除します。
権限設定
このサーバー機能を実行できる権限を設定します。(後述)
サーバー機能設定
このサーバー機能についての設定を行います。(後述)

権限設定

サーバー機能設定

属性 説明
名前 サーバー機能名(半角英数字と「_」)
表示名 日本語での名前
実行ユーザー サーバー機能を実行するユーザーを「system」「ユーザー」から選択します。「system」の場合は「.system」という特殊なユーザーで実行され、「ユーザー」の場合は実行時のログインユーザーとして実行されます。
タイムアウト タイムアウトまでの時間をミリ秒で指定します。指定した時間内に結果が返されないと、タイムアウトのエラーとなります。
実行形式 「同期実行」と「非同期実行」から選択します。
「同期実行」の時は、スクリプトの実行が終わるまで待って、その時点の変数resultの内容が下記のコールバック関数を通して返されます。
「非同期実行」の時は、スクリプトの中であらかじめ用意されている callback という関数を呼び出すとサーバー機能の実行は終わり、その引数(第一引数がエラー、第二引数が結果)によって結果が返ります。
いずれの場合もタイムアウトで指定した時間内に結果が返らないとエラーになります。
フレームワーク2では「同期実行」を選択してください。
メモ 開発上のメモ
テスト実行オプション テスト実行時にoptionsとしてスクリプトに渡されるオプションを指定します。(後述)

スクリプト編集

「コード挿入」ボタン
よくあるコードを選択して挿入できます。
「名前挿入」ボタン
DBテーブル・ビューやそのカラム、スクリーン、レポート、サーバー機能の名前を選択して挿入できます。
「検索」テキストボックスと
「検索」テキストボックスに入力してをクリックすると、スクリプト中から該当文字列を検索できます。
(テスト実行)
テスト実行を行います。(後述)
(ファイル管理)
ファイル管理を行います。(「アプリメニュー」の「ファイル管理」と同じ機能です。)
(詳細検索)
検索機能を拡張し、詳細検索や置換が行えるモードにします。(後述)
(APIリファレンス)
APIリファレンスを開きます。
(スクリプト編集設定)
スクリプト編集についての、テーマとフォントサイズを設定します。

テスト実行