4D Write Pro – データソース付き表組みの作成ウィザード

ここ最近のリリースで、4D Write Pro には多くの表組み関連の機能が追加されました。コンテキスト、データソース、フォーミュラを使って、データベースのデータに基づいた表組みを簡単に作成することができます。

これはとても簡単なので、エンドユーザーにこの機能をそのまま使ってもらいたいと思う方も多いでしょう。しかし、データソースやフォーミュラの扱いに詳しくないユーザーにとっては、ときに難しいことであるのも理解しています。4D v20 R2 では、これに対するソリューションとして開発された新しい表ウィザードを提供しています。

このウィザードは、エンドユーザーが利用できます。エンドユーザーは、開発者が提供する、用途や業務に合わせたテンプレートを利用することができます。テンプレートの設定には以下が含まれます:

データクラスとデータクラス属性の定義、
データクラス、データクラス属性、およびフォーミュラの翻訳名の設定、
業務に適合したフォーミュラの準備、
グラフィックスタイルのデザイン。

HDI のサンプルデータベースと、デモビデオもぜひご覧ください。

HDI：表ウィザード

WP表ウィザードのインターフェース

ユーザーは、ツールバーまたはサイドバーの “表を挿入” メニューからウィザードにアクセスできます。

インターフェースは非常にシンプルです。ユーザーはテンプレートまたはデータクラスを選択し、テーマを選びます。そして、列として表示するフィールドをチェックします。列の順番を変えることもできます。次に、ヘッダー行、繰り返し行の上下に配置されるブレーク行、追加の行の数を定義します。次に、ブレーク行または追加の行に表示するフォーミュラを選択します。最後に、”挿入” ボタンをクリックして、Write Pro ドキュメントに表を追加します。

表がドキュメントに挿入されると、ユーザーはそのスタイルを修正またはカスタマイズできます。ツールバーとサイドバーの書式設定ツールはそのまま使用できます。

デモビデオ:

HDI をダウンロードして、ビデオの例題を試すことができます。

設定方法

ウィザードは 3つの設定ファイルで構成されます。

テンプレートファイル

テンプレートファイルでは、以下を定義できます:

表のデータソースに使用するエンティティセレクションを返すフォーミュラ、
表の列として選択できるデータクラス属性、
ブレーク行のフォーミュラ、
ブレーク行のコンテキストメニューで選択できるフォーミュラ、
キャリーオーバー行のコンテキストメニューで選択できるフォーミュラ、
および追加行のコンテキストメニューで選択できるフォーミュラ。

テンプレートファイルは、プロジェクトの “Resources/4DWP_Wizard/Templates” フォルダーに保存します。

以下は、テンプレートファイルの一例です:

{
    "tableDataSource": "ds.People.all().orderBy(\"toCompany.name asc, continent asc, country asc, city asc\")",
    "columns": [{
            "check": true,
            "header": "Firstname",
            "source": "This.item.firstname"
        }, {
            "check": true,
            "header": "Lastname",
            "source": "This.item.lastname"
        }, {
            "check": true,
            "header": "Salary",
            "source": "String(This.item.salary;\"###,###.00\")"
        }
    ],
    "breaks": [{
            "label": "Company",
            "source": "This.item.toCompany.name"
        }
    ],
    "breakFormulas": [{
            "label": "Company",
            "source": "This.item.toCompany.name"
	}, {
            "label": "Sum of salaries",
            "source": "String(This.breakItems.sum(\"salary\"); \"###,###.00\")"
        }
    ],
    "bcorFormulas": [{
            "label": "Sum of salaries",
            "source": "String(This.tableData.sum(\"salary\"); \"###,###.00\")"
        }
    ],
    "extraFormulas": [{
            "label": "Sum of salaries",
            "source": "String(This.tableData.sum(\"salary\"); \"###,###.00\")"
        }
    ]
}

JSONフォーマットと属性名についての詳細は、オンラインドキュメントをご覧ください。

トランスレーションファイル

トランスレーションファイルは、テンプレート、テーマ、テーブル、フィールド、およびフォーミュラの翻訳名を表示するのに使用されます。このファイルは、プロジェクトの “Resources/4DWP_Wizard/Translations” フォルダーに追加します。

ユーザーがインターフェースでデータクラスを選択する場合、トランスレーションファイルには 2つ目の機能があります。それは、ユーザーに提案されるデータクラスとデータクラス属性をフィルターすることです。たとえば、テーブルの ID を非表示にできます。

注: この動作は、クラシック言語の、SET TABLE TITLES と SET FIELD TITLES コマンドに似ています。

以下は、トランスレーションファイルの一例です:

{
    "tables": [{
            "original": "People",
            "translation": "Personne"
        }
    ],
    "fields": [{
            "original": "lastname",
            "translation": "Nom"
        }, {
            "original": "firstname",
            "translation": "Prénom"
        }, {
            "original": "salary",
            "translation": "Salaire"
        }, {
            "original": "company",
            "translation": "Société"
        }
    ],
    "formulas": [{
            "original": "Sum of salary",
            "translation": "Somme des salaires"
        }
    ]
}

オンラインドキュメントでは、利用可能な属性の一覧と説明が提供されています。

テーマファイル

4D WritePro Interface コンポーネントでは、デフォルトテーマのリストが提供されています。しかし、独自のテーマを作成して、プロジェクトの “Resources/4DWP_Wizard/Themes” フォルダーに保存することができます。

テーマファイルでは、ヘッダー行、繰り返し行、キャリーオーバー行、ブレーク行、追加の行について、次のWP属性が定義できます:

textAlign
backgroundColor
borderColor
borderStyle
borderWidth
font
color
fontFamily
fontSize
padding

以下は、テーマファイルの一例です:

{
    "default": {
           "backgroundColor": "#F0F0F0",
           "borderColor": "#101010",
           "borderStyle": 1,
           "borderWidth": "0.5pt",
           "font": "Times New Roman",
           "color": "#101010",
           "fontFamily": "Times New Roman",
           "fontSize": "7pt",
           "padding": "2pt"
    },
    "table": {
           "backgroundColor": "#E1EAF3"
    },
    "header1": {
           "textAlign": 2,
           "borderColor": "#41548F",
           "borderWidth": "1.5pt",
           "backgroundColor": "#979BA9",
           "color": "#F4F4FF",
           "font": "Times New Roman Bold"
    },
    "data": {
           "fontSize": "13pt",
           "textAlign": 0
    },
    "break1": {
           "textAlign": 2,
           "fontSize": "15pt"
    }
}

JSON文法については、ドキュメントを参照ください。

次は…

WP表ウィザードは、4D WritePro Interface コンポーネントの一部です。ソースは Github にあります。
感想やフィードバックはフォーラムへお寄せください。

Discuss

Tags 21, 4D Write Pro, Table, UI, User Experience, v20 R2