IM-BloomMaker for Accel Platform IM-BloomMaker ユーザ操作ガイド 第16版 2025-04-01

IM-BloomMaker for Accel Platform IM-BloomMaker ユーザ操作ガイド 第16版 2025-04-01

目次 ≪  12. 付録 12.2. 設計書出力のテンプレート  ≫

12.1. CookBook

本ドキュメントリリース時点の IM-BloomMakerに関するCookBook一覧です。
必要に応じてご活用ください。今後、記事は追加される予定です。

12.1.1. IM-BloomMaker のカスタムスクリプト内で ＄im.resolve を使った一覧画面の作成

このCookBookでは、IM-BloomMakerを用いてユーザ情報一覧画面から詳細情報を表示する方法について説明しています。ユーザは組織を選択し、選択した組織に所属するユーザの一覧を表示できます。その後、一覧のアイコンをクリックすることで、対象ユーザの詳細情報が表示される画面に遷移できる仕組みです。詳細情報はIM-LogicDesignerを通じて取得され、必要な引数や返却値を設定することが求められます。また、カスタムスクリプトを利用して特定の処理を実行する手順が含まれています。最終的に、動作確認を通して正しく遷移することを確認します。

12.1.2. IM-BloomMaker 繰り返しエレメントでの変数の使い方

IM-BloomMakerでは、繰り返しエレメントと変数を使用する方法を学ぶことができます。1次元、2次元、3次元配列の変数を作成し、これらを繰り返しエレメントに設定することで、動的なコンテンツを生成できます。具体的には、エレメントの配置、変数作成、プロパティ設定の3段階を経て、繰り返し表示が実現されます。また、サンプルファイルのダウンロードが可能で、スムーズな導入がサポートされています。最終的に、プレビュー機能を利用して結果を確認できるため、開発中の内容をリアルタイムでチェック可能です。

12.1.3. IM-BloomMaker のアクション「URL ○ にリクエストを送信する」の使い方

BloomMakerは、ローコードでアプリケーションを構築するためのツールです。ユーザは、「URL ○ にリクエストを送信する」アクションを使用してサンプル画面を作成し、APIからのデータを取得できます。まず、コンテンツカテゴリとコンテンツを登録し、デザイン編集を行います。その後、ルーティングカテゴリを設定し、ルーティング定義を作成します。画面作成が完了したら、動作確認を実施し、指定したURLで画面を表示することが可能です。また、IM-BloomMakerとIM-LogicDesignerのインポート機能を利用して、サンプルファイルを簡単に活用できることも特徴です。

12.1.4. IM-BloomMaker カスタムスクリプトの使い方と ＄variable からの取得・代入の方法

IM-BloomMakerのCookBookでは、カスタムスクリプトと$variableを使ってサンプル画面の作成方法を紹介しています。サンプルでは、チェックボックスと「Execute」ボタンを配置し、チェックボックスの選択状態に基づいてエラーメッセージや確認ダイアログを表示する仕組みを実装します。この過程で、変数の宣言やカスタムスクリプトの記述方法、アクションの作成について説明されています。また、動作確認では、作成したアクションやスクリプトが期待通りに動作するかを確認する手順が示されています。デザイン画面やサンプルファイルも用意されており、実際の使用例として役立つ内容です。

12.1.5. IM-BloomMaker のアクション「変数に一覧データから選択したものを代入する」の使い方

このCookBookでは、「変数に一覧データから選択したものを代入する」アクションの利用方法を紹介します。このアクションにより、一覧データをダイアログに表示し、選択したデータを変数に代入できる機能があります。サンプル画面を作成しながら、その具体的な手順を説明します。完成サンプルをダウンロードできるリンクも提供されており、ユーザはアプリケーション画面やルーティング定義の設定を行うことで、操作をスムーズに進めることができます。デザイン編集やアクションの作成に関する詳細も含まれており、最終的には選択したデータの表示確認が可能です。

12.1.6. IM-BloomMaker で作成した画面で、入力項目の値によってエレメントの表示・非表示を切り替える方法

IM-BloomMakerでは、入力系エレメントの値に基づき表示や非表示を操作する方法が紹介されています。サンプル画面として、チェックボックスやラジオボタンによって別途テキストボックスやテキストエリアの表示が制御される仕組みが実演されています。また、エレメントの表示/非表示を切り替えるための変数宣言や関連付け、アクション作成が解説されています。特に、カスタムスクリプトを使用してユーザの入力に応じた動的なインタフェースを構築する方法が強調されています。このCookBookを利用することで、簡単にエレメントの状態を制御できます。

12.1.7. BloomMakerとLogicDesignerでWorkflowコンテンツを作成する

このCookBookでは、BloomMakerとLogicDesignerを使用してWorkflowのコンテンツを作成する方法を紹介します。2019 Winter(Xanadu)で追加された機能により、Workflowの申請や承認の処理画面をBloomMakerで作成できるようになりました。2020 Spring(Yorkshire)では「コピー新規」アイコンが利用可能となり、LogicDesignerフローに関連ロジックが追加されました。また、2022 Spring(Eustoma)からは新たな参照権限判定が導入され、より細かい権限管理が可能です。サンプルデータを用いることで、環境において動作確認が行え、具体的な構成要素としてはBloomMakerコンテンツ、ルーティング定義、LogicDesignerフロー定義が含まれます。さらに、ルーティングやエラーハンドリングの設定も重要です。

12.1.8. IM-BloomMaker のアクション「複数選択組織検索ダイアログを表示する」の使い方

「複数選択組織検索ダイアログを表示する」アクションは、共通マスタから組織情報を取得し、ダイアログに表示して選択したデータを任意の変数に代入する機能です。このCookBookでは、サンプル画面を作成しながらこのアクションの使用方法を解説しています。具体的には、コンテンツやルーティングの登録、デザインの編集とアクションの設定、実行画面での確認までの手順が含まれます。この機能により、組織選択が効率化され、ユーザが必要な情報を簡単に操作できます。

12.1.9. IM-BloomMaker グラフエレメントの使い方（円グラフ編）

BloomMakerは、intra-mart Accel Platform2019 Winter(Xanadu)以降で利用可能なローコード開発ツールです。このツールを使うことで、円グラフを簡単に作成し、データの可視化が実現できます。円グラフエレメントには「selected」と「visible」といったプロパティがあり、これによりユーザはドリルダウン機能を活用できます。さらに、イベントの設定を通じて円グラフと他の要素との連動を図ることが可能です。このCookBookでは具体的なサンプルを通じて、円グラフのインタラクティブな機能を体験できます。データは実際の輸出入額から取得され、多様な操作が実現されています。サンプルファイルのインポートによって手軽に試すことができます。

12.1.10. IM-BloomMaker グラフエレメントの使い方（基本編）

この記事では、intra-mart Accel Platform2019 Winter(Xanadu)から利用できる IM-BloomMaker のグラフエレメントの使用方法について説明しています。グラフエレメントは Highcharts を利用してグラフを表示する機能を提供します。主な操作内容には、グラフに表示するデータの作成、折れ線グラフエレメントの配置とデータ設定、プロパティの編集によるグラフ見た目の整備が含まれます。完成サンプルをインポートして活用でき、グラフにマウスオーバーすることで詳細情報が表示され、凡例を利用してデータ要素の表示/非表示を切り替えることができます。Highcharts の詳細仕様は公式リファレンスを参照してください。

12.1.11. BloomMakerで動的承認ノードを利用したWorkflowコンテンツを作成する

BloomMakerは、動的承認ノードを活用してWorkflowコンテンツを作成できる製品です。この記事では、承認ノードを動的承認ノードに変更し、申請ノードに対象者選択用のセレクトボックスを配置する方法が紹介されています。2020 Winter(Azalea)以降、一覧表示パターンに「コピー新規」アイコンが追加され、関連するロジックも更新されています。完成サンプルは提供されており、必要なインポートファイルが用意されています。サンプルは、特定のバージョンのintra-mart Accel Platformにて動作確認が可能です。このCookBookを利用することで、ユーザは自分のニーズに合わせたWorkflowを簡単に作成できるです。

12.1.12. IM-BloomMaker コンボボックスエレメントのサジェストにサーバから取得した値を表示する

BloomMakerは、サーバから取得した値を表示するコンボボックスエレメントのサジェスト機能を提供します。ユーザがコンボボックスに文字を入力すると、完全一致または部分一致でユーザコードが絞り込まれ、クリックによってサーバから取得したユーザコードの一覧が表示されます。また、「プラス」アイコンをクリックすることで、入力されたユーザコードに一致するユーザの詳細情報がテーブルに追加される機能もあります。これにより、簡単にデータの補完や追加が行えるため、使いやすいインタフェースが実現されます。

12.1.13. BloomMakerでワークフロー処理モーダルを利用してWorkflowコンテンツを作成する

BloomMakerは、Workflowのコンテンツを作成するための強力なローコードツールです。2020 Spring(Yorkshire)で新機能が追加され、IM-Workflowと連携した「ワークフロー処理モーダル」の表示が可能です。ユーザが直感的に操作できるインタフェースを提供し、各種画面を簡単に構築できます。また、LogicDesignerを使用したフロー定義が可能で、ユーザデータの取得や処理を効率的に行えます。完成したコンテンツは、さまざまな環境にインポートして利用でき、申請や承認といったWorkflowのプロセスをスムーズに実現できることが特徴です。サンプルインポートファイルも提供され、即座に活用可能です。

12.1.14. BloomMakerでワークフロー処理モーダルと動的処理対象者設定機能を利用してWorkflowコンテンツを作成する

BloomMakerは、ワークフロー処理モーダルと動的処理対象者設定機能を用いて、ユーザが柔軟なWorkflowコンテンツを作成できるツールです。このCookBookでは、動的承認ノードや処理対象者を選択するセレクトボックスを配置する方法が紹介されています。また、2020 Winter(Azalea)以降のバージョンでは「コピー新規」アイコンが利用可能となり、LogicDesignerに関連するロジックの追加や改良が行われています。BloomMakerを通じて動的承認ノードの処理対象者を設定することで、申請画面での操作が簡素化され、特定の条件下で効率的な承認プロセスを実現できます。サンプルファイルのインポート情報や、特定の処理に関する定義も提供されているため、利便性が高いです。

12.1.15. BloomMakerでワークフローの一括承認画面を作成する

BloomMakerを用いることで、ワークフローの一括承認画面を簡単に作成できます。このツールでは、ユーザが未処理タスクの一覧を表示し、各案件を承認したり差戻したりする機能が提供されています。サンプルでは、特定のノードに関連するユーザデータも確認でき、承認を効率化する構成です。IM-BloomMakerやIM-LogicDesignerのインポートファイルを利用して、スムーズに導入が可能です。サンプル動作には、intra-mart Accel Platformの2020 Spring(Yorkshire)以降に対応したテナント環境が必要です。詳細な設定項目は、添付のサンプルを参照してください。

12.1.16. IM-BloomMaker 「リッチテーブル」エレメントのサンプル集

BloomMakerは、intra-mart Accel Platformのリッチテーブルエレメントを活用するための便利なツールです。データエクスポート画面や円グラフを介して、データの選択や編集が可能です。リッチテーブルエレメントを使うことで、動的なデータ表示や簡易検索機能、データのソートが行え、ユーザビリティを向上させます。円グラフエレメントとの連携により、グラフとテーブルのデータが連動し、直感的にデータを操作できる環境を提供します。さらに、サンプルのインポート機能を利用することで、すぐに試用を開始できる仕組みが整っています。

12.1.17. IM-BloomMaker 「ファイルアップロード」エレメントの利用方法

このCookBookでは、2020 Spring(Yorkshire)にリリースされた「ファイルアップロード」エレメントの利用方法について説明しています。具体的には、登録画面からファイルをアップロードし、別画面でダウンロードできる機能を実装します。この機能は、2つの画面（登録画面と一覧画面）で構成され、データをデータベースに保存するためのDDL実行やREST APIのサーバロジック実装が含まれます。「ファイルアップロード」エレメントは、セッションスコープストレージに一時保存されたファイルをデータベースに永続化し、他の画面でアクセス可能にする仕組みです。最大10 MBのファイルサイズ制限があり、設定変更が可能です。詳細な手順やサンプルも提供されています。

12.1.18. IM-BloomMaker でリモートワークの報告メールを送信するアプリを作ってみた

IM-BloomMakerは、リモートワークの報告メールを簡単に作成できるアプリを提供します。このアプリは、特定のメールテンプレートを利用できることや、宛先やタイトルを自動で設定する機能があります。ユーザが必要な情報を入力するだけで、手間を省き、報告を効率化します。また、localStorageを利用したキャッシュ機能により、入力情報が自動的に保存され、次回の入力がスムーズです。IM-BloomMakerは、身近な改善を実現できることが特長です。

12.1.19. IM-BloomMaker サイドメニューの使い方

サイドメニューエレメントは、intra-mart Accel PlatformSlim Side Menu テーマを使用する際に、サイドメニューと同様の機能を提供します。コンテンツ種別「Bulma」で作成された画面にはテーマが適用されず、グローバルナビやマイメニュー機能は使用できないため、サイドメニューエレメントを利用することでこれらの機能が可能です。スマートフォンではマイメニュー機能が利用できず、他にも機能制限や挙動の違いがあります。サイドメニューエレメントはコンテンツ種別「imui」以外で使用可能で、簡単な操作で画面を作成できます。また、特定の条件下ではエレメントの配置に注意が必要です。

12.1.20. IM-BloomMaker フォーム部品(Bulma)を使用したバリデーション処理の作成

このCookBookでは、intra-mart Accel Platform2020 Summer(Zephirine)から導入されたコンテンツ種別「Bulma」の「フォーム部品（Bulma）」を用いたバリデーション処理を紹介します。サンプル画面を作成し、以下の機能を実装できます。テキストボックス「name」の必須チェックと、「email」のアドレス形式判定です。完成サンプルはダウンロード可能で、2022 Spring(Eustoma)版以降でインポートできます。IM-BloomMakerのインポート機能を使用し、認可URIの設定を行うことで表示させることができます。また、ドキュメントを参照しながらコンテンツや画面を作成し、アクションやエレメントのプロパティ設定を行います。作成したコンテンツはルーティング定義と連携して公開可能です。

12.1.21. IM-BloomMaker Bulma タイルの利用方法

このCookBookでは、2020 Summer(Zephirine)でリリースされたBulmaの「タイル」エレメントの利用方法について説明します。「タイル」エレメントは、自由にグリッドレイアウトを構築するためのエレメントです。基本的な使い方として、エレメントのネスト構造（祖先、親、子）を理解し、階層を適切に設定することが重要です。基礎編と応用編があり、さまざまなレイアウトを作成する方法を学ぶことで、効果的なデザインが可能です。また、エレメントのサイズや色の指定、上下の配置なども自由に設定できるため、カスタマイズ性に優れています。最終的に、ネストやプロパティの関係を理解することで、スムーズなレイアウト構築が実現できます。

12.1.22. IM-BloomMaker Bulma を使用した参照系画面の作成

BloomMakerは、intra-mart Accel Platform向けのローコード開発ツールです。このCookBookでは、2020 Summer(Zephirine)版のBulmaフレームワークを使用して、ユーザを一覧表示し、検索や登録ができる画面を作成します。具体的には、ユーザ一覧、参照画面、登録画面の3つの画面を構築します。ユーザ一覧では、APIと連携し、ページネーション機能も実装します。また、ユーザの絞り込み機能も搭載し、登録画面から新しいユーザを追加できます。全体として、データ管理を簡単に行えるインタフェースを提供します。

12.1.23. IM-BloomMaker Modifier の使い方

BloomMakerのCookBookでは、2020 Summer(Zephirine)から利用可能な環境変数「$env」内の「modifier」について説明しています。「modifier」はコンテンツ種別「Bulma」を使用している場合に参照でき、CSSフレームワーク「Bulma」が提供するCSSクラスを利用することで、簡単に文字や背景の色を変更したり、レスポンシブデザインを実現できます。具体的には、文字色を指定する「color」、背景色を指定する「backgroundColor」、エレメントを非表示にする「hide」という3つの情報が用意されています。これにより、言語に依存しないデザインが可能です。

12.1.24. IM-BloomMaker フォーム部品（Bulma）のグループ化と結合の使い方

このCookBookでは、intra-mart Accel Platform2020 Summer(Zephirine)で利用できる「Bulma」コンテンツの「フォーム部品（Bulma）」を使ったグループ化と結合の手法を紹介します。グループ化により、複数のフォーム部品を横並びに配置でき、ボタンの作成や単位の追加が簡単に行えます。結合機能を利用すると、フォーム部品を一つにまとめて配置できます。さらに、検索ボックス風のデザインも実現可能です。これらの機能を活用することで、さまざまなフィールドエレメントのグループ化や結合が体験でき、柔軟なUI構築が可能です。Bulmaの公式ドキュメントもぜひ参照してください。

12.1.25. IM-BloomMaker フォーム部品（Bulma）のフィールド、水平フィールドの利用方法

このCookBookでは、intra-mart Accel Platform2020 Summer(Zephirine)以降に利用可能なBulmaコンテンツのフォーム部品（Bulma）の「フィールド」と「水平フィールド」の使い方を紹介します。フィールドは初期状態でラベルが非表示で、上下配置が基本です。水平フィールドは初期状態でラベルが表示され、横並びに配置されます。画面幅に応じた表示の変化が異なり、フィールドは位置を保つ一方、水平フィールドはリサイズ時に上下に変わります。複数要素の配置やラベルの管理には水平フィールドが適しており、コンテンツ種別「Bulma」を選定することで活用可能です。フィールドや水平フィールドにエレメントを配置する具体的手順によって、効果的な入力フォームが作成できる仕組みです。

12.1.26. IM-BloomMaker 画面操作後に入力規則のチェックが行われるフォームの作成

BloomMakerは、ローコードで入力フォームを作成するためのプラットフォームです。主な機能として、ユーザが入力する際の規則を設定し、エラーの表示および非表示を制御できます。これにより、画面表示後に即座に入力規則のチェックを行い、エラーがある場合にはエラーメッセージを表示することが可能です。また、正しい入力が行われた際には、確認モーダルを表示して内容を確認できます。さらに、さまざまなアクションを作成し、フィールド単位でエラー管理やモーダルの開閉を行うこともできます。このCookBookでは、フォームの構成や各種設定の手順が詳しく説明されています。

12.1.27. IM-BloomMaker Bulma で IM-Knowledge のコンテンツ一覧画面を作ってみよう

IM-BloomMakerは、ローコードの開発環境で、特にコンテンツ作成に優れた機能を提供します。2020 Summer(Zephirine)から新たに「Bulma」コンテンツ種別が加わり、使いやすいエレメントを活用して、IM-Knowledgeのコンテンツ一覧画面の作成が可能です。このCookBookでは、「カラム」「カード」「水平フィールド」といったBulmaの元素を使用し、見た目の実装を紹介します。最終的な画面は、コンテンツの情報が一覧表示されるスタイルとなり、ユーザはカードのデザインを自由に設定できます。作成過程では、変数の設定からコンテンツのカード部分、検索タブ、ヘッダ部分、アクションの設定まで一貫した説明を提供します。このツールにより、効率良く魅力的な画面を制作できる仕組みが整っています。

12.1.28. IM-BloomMaker 画面構成タブでテーブルの行または列を入れ替える方法

BloomMakerは、intra-mart Accel Platformの画面構成タブでエレメントの並び替えが簡単にできる機能を提供します。2020 Winter(Azalea)以降、テーブルエレメント内の行や列をドラッグ＆ドロップ（D&D）でまとめて入れ替えることが可能です。これにより、従来の個別入れ替えよりも効率的に操作できます。さらに、テーブルの行挿入もスムーズに行える機能も搭載されており、作業が大幅に軽減されます。リストやコンテナ系エレメントも同様にD&Dで入れ替えができるので、活用の幅が広がります。

12.1.29. IM-BloomMaker 式表現で三項演算子が利用可能になりました。

BloomMakerのCookBookでは、intra-mart Accel Platformの式表現に導入された三項演算子について説明しています。この式表現は、エレメントのプロパティやアクションアイテムでの変数値設定に利用可能です。2020 Summer(Zephirine)以前は条件分岐ができず、アクション事前処理が必要でしたが、三項演算子によりプロパティエディタ内で直接判定処理が行えます。サンプル資材をインポートして実際の使用例を通じて、レコードの強調表示やアクションにおける値の切り替えなどが説明されています。これにより、ユーザは効率的なデザインを実現できます。

12.1.30. BloomMakerでワークフローの一括代理設定画面を作成する

BloomMakerは、ユーザが特定の要件に応じた画面を簡単に作成できるローコード製品です。この記事では、ワークフローの代理設定を一括で登録する画面の作成方法を紹介しています。完成イメージでは、複数の代理設定をテーブル形式で一括登録できます。インポート用のサンプルファイルを提供しており、これを使用して迅速に環境設定を行うことができます。BloomMakerを活用することで、効率的に業務プロセスを改善できる可能性があるため、ぜひ利用してみると良いです。

12.1.31. BloomMakerでワークフローの添付ファイルを直接編集する画面を作成する

このCookBookでは、BloomMakerを使用してワークフローに添付ファイルを追加・削除する画面を作成する方法を紹介しています。BloomMakerを利用することで、特定の要件に基づいた簡単な画面を作成できる機能があります。完成サンプルでは、フローIDで案件を検索し、添付ファイルの表示や操作が可能です。ユーザが未処理案件および処理済み案件を参照できる機能も実装されています。また、サンプルデータとAPIを活用して、基本的なファイル管理を行うことができます。この機会にBloomMakerを活用してみてください。

12.1.32. IM-BloomMaker グラフエレメントのツールチップのフォーマットを指定する方法

BloomMakerの「tooltipPointFormat」プロパティは、ツールチップの表示形式を設定するための機能です。このプロパティを利用すると、グラフの値と単位を表示したり、追加情報を表示できます。具体的には、Highchartsの「tooltip.pointFormat」と同等です。このCookBookでは、特定のサンプルを使用して「tooltipPointFormat」の設定方法を解説しています。ユーザは、グラフエレメントのプロパティタブでこの設定を行い、プレビューでの確認が可能です。また、グラフ以外の情報を表示したい場合は、変数を「series.data」に追加し、「tooltipPointFormat」で指定できます。特に円グラフや散布図には利用制限があり、特別な変数名が必要です。

12.1.33. IM-BloomMaker でページ切り替え時にアニメーションを付加する方法

BloomMakerは、ローコード開発環境で、エレメントの固有IDとCSSエディタを使用して、ページ切り替え時に横方向にスクロールするアニメーションを実装できます。ユーザは、一覧画面と詳細画面を作成し、必要な変数を管理することで、アイテム情報を表示できます。さらに、CSSを用いてページ切り替え時のアニメーションを設定し、アクションを追加することで、異なる画面間の遷移をスムーズに行える機能を備えています。このプロセスを通じて、動的で視覚的に魅力的なアプリケーションを構築できるとともに、ローカル環境での表示確認も可能です。

12.1.34. IM-BloomMaker IE で画面を開くと「Internet Explorer は対応していません。」と表示するアプリケーションの作成方法

このCookBookでは、「Internet Explorerは対応していません」と表示するアプリケーションを作成する方法を解説しています。対象はintra-mart Accel Platform2020 Summer(Zephirine)以降の環境です。環境変数を利用し、「ページ読み込み時」イベントにアクションを設定することがポイントです。メッセージ設定では、多言語対応のための変数を設定し、アクションではダイアログ表示の設定を行います。イベント設定後、ChromeとIEで動作確認をすると、Chromeではアラートが表示されず、IEではアラートが表示されます。完成サンプルのダウンロードも可能です。

12.1.35. IM-BloomMaker リッチテーブルの行の詳細画面を別タブで開く方法

BloomMakerでは、リッチテーブルの行をクリックすることで、別タブで詳細画面を開く方法を提供しています。リッチテーブルは、選択した行の詳細情報を表示するために、行のインデックスを特定のプロパティに格納します。詳細画面は、フォームエレメントを使い、パラメータを渡すことで自動的に生成されます。このクックブックでは具体的なサンプルを通じて設定手順を紹介していますが、他のタブで開くアクションアイテムの作成方法についても学べます。詳細なガイドは、「intra-mart Accel Platform」のプログラミングガイドで確認可能です。

12.1.36. IM-BloomMaker スプレッドシート 特定のセルを編集できないようにするには？

このCookBookでは、intra-mart Accel Platform2020 Winter(Azalea)から利用可能な「スプレッドシート」エレメントの特定セルを編集できないようにする方法を紹介します。「スプレッドシート」エレメントにはIM-Spreadsheet for Accel Platformのライセンスが必要です。サンプル資材を使用し、合計金額を計算するテーブルを作成できます。また「行挿入」ボタンをクリックすることで行を追加できます。シート全体を保護しつつ、特定のセルの編集を可能にするためには、セル保護解除の設定が必要です。設定により、ユーザは商品、数量、価格のセルのみに入力でき、他のセルは編集不可として管理できます。

12.1.37. IM-BloomMaker TreeViewの作成方法

BloomMakerは、intra-mart Accel Platform2020 Summer(Zephirine)以降で利用可能なコンテンツ種別「Bulma」を使用して、TreeViewの動きを持つサンプルを作成するためのツールです。ユーザは、ノードをクリックすることでツリーを開閉可能で、ノードの情報やツリー構造を変数として管理できます。アクションを設定することで、子ノードの情報をツリーに追加したり、ツリーの表示を切り替えたりできます。デザインのカスタマイズも簡単に行え、特定のスタイルやレイアウトを適用できるため、柔軟な使い方が可能です。学習した内容を元に、さまざまなデータ構造を試してみることがすすめられています。

12.1.38. IM-BloomMaker ページネーションの利用方法

このCookBookでは、2020 Summer(Zephirine)でリリースされたコンテンツ種別「Bulma」の「ページネーション」エレメントについて説明しています。「ページネーション」エレメントは、表示データをページごとに分割して表示するための機能です。完成サンプルはダウンロード可能で、異なる定義が含まれています。IM-BloomMakerのインポート機能を使用して必要な設定を行った後、一覧画面を作成し、アプリケーション画面を公開するための手順が詳述されています。このエレメントの活用方法については、公式サイトも参照できます。

12.1.39. IM-BloomMaker スプレッドシートのシート全体を DB に保存する

このCookBookでは、intra-mart Accel Platform2020 Winter(Azalea)以降に利用できるスプレッドシートの全体をDBに保存する方法を紹介します。シート全体の保存方法は、Excelで回覧されていた情報を扱う際に便利です。スプレッドシートを使うためには、Jugglingプロジェクト作成時に「IM-Spreadsheet for Accel Platform」を選択する必要があります。作成した画面ではデータの登録・更新、そしてその情報を抽出することが可能です。データは「ID」を基に保存し、必要な際には「Save」ボタンや「Reflect」ボタンを使用します。サンプル画面のデザインやアクションの設定も用意されており、動作確認も簡単に行える仕組みです。

12.1.40. IM-BloomMaker スプレッドシートの入力内容を DB に保存する

このCookBookでは、intra-mart Accel Platform2020 Winter(Azalea)以降のスプレッドシート機能を利用して、セルに入力した値をデータベースに保存する方法を紹介します。経費精算書画面を作成し、行の追加や削除、DBへの登録が可能です。自動計算機能を使用し、「参照」タブでは登録データを一覧表示、詳細モーダルで各行のデータを確認できます。具体的な手順にはDDLの実行、インポートファイルの利用、デザイン編集が含まれます。これにより、簡易な経費精算アプリケーションの構築が実現することです。

12.1.41. IM-BloomMaker と IM-LogicDesigner を組み合わせて、請求書を Excel でダウンロードする方法

BloomMakerは、IM-LogicDesignerを利用してデータをExcelに出力し、ダウンロードする機能を提供するローコードツールです。ユーザは請求書作成画面を実装でき、IM-BloomMakerでデータを入力すると、その内容がExcelに反映されます。具体的には、請求書の詳細情報（顧客名、住所、日付など）を入力し、IM-LogicDesignerによってExcelファイルが生成されます。システムはモジュールのインストールが必要で、ユーザ定義、フロー定義、ルーティング定義の作成を行います。操作には、入力フォームの作成やアクションの設定が含まれ、インタフェースは視覚的に分かりやすい設計です。最終的に、生成された請求書は、ユーザが簡単にダウンロードできます。

12.1.42. BloomMaker 入力規則エラーメッセージエレメントの使い方

BloomMakerでは「入力規則エラーメッセージ」というエレメントを利用することで、指定した変数の値が入力規則に従っていない場合に自動的にエラーメッセージを表示できます。このエレメントは、標準版とBulma版の2種類が用意されており、ユーザがメッセージを定義する必要はありません。標準版はどのコンテンツ種別でも使用可能で、Bulma版は「フィールド」エレメント内で利用できます。CookBookでは、双方の使い方が紹介されており、ユーザコードの入力規則エラーに関するメッセージ表示の実装方法が具体的に説明されています。この機能を活用することで、ユーザは入力内容の問題点を把握できます。

12.1.43. BloomMaker 独自の入力チェックでエラーとなった時に入力部品にエラーのハイライトを表示する方法

このCookBookでは、BloomMakerの「入力規則エラーハイライト」プロパティについて説明しています。このプロパティは、入力された値が入力規則に従っていても、エレメントにエラーのハイライトを表示するかどうかを設定できます。「テキスト入力」や「ボタン」などで利用可能です。この機能を使用することで、独自の入力チェックでエラーが発生した際にエラーハイライトを表示できます。具体的な例として、スケジュール登録画面でのエラーハイライトの適用方法を紹介しています。また、入力必須の変数設定や、エラーハイライトの条件設定についても触れています。

12.1.44. Adobe Acrobat Sign連携を利用する

BloomMakerは、IM-Signを利用してAdobe Acrobat Signと連携し、契約書の作成と署名依頼を行うことができます。署名が完了すると、関連するWorkflow/BIS案件が自動的に完了します。このプロセスでは、ユーザが契約名、PDFファイル、署名依頼先のメールアドレスを入力する画面がIM-BloomMakerで提供されます。また、LogicDesignerを使用して、契約書の作成や署名完了後の処理を管理します。サンプルにはIM-Workflow、IM-BIS、IM-LogicDesigner、IM-BloomMaker、IM-Signのモジュールが必要です。環境設定や各モジュールのインポートが確認されている場合、契約書の管理とワークフローの最適化が可能です。

12.1.45. IM-BloomMaker 設計書出力機能の使用方法

このCookBookでは、intra-mart Accel Platform2021 Spring(Bergamot)からの設計書出力機能について紹介します。この機能では、コンテンツの情報をバージョンごとに設計書として作成できます。設計書はExcelファイルに出力され、表紙、コンテンツ概要、コンテナ、画面デザイン、変数値、多言語、アクション、ルーティング、改版情報の各シートに分かれています。バージョン間の比較を行わない場合や、比較を行う場合それぞれの流れに沿って設計書を作成できます。設計書には変版情報のシートが追加され、変更点を明示的に確認できるのが特徴です。

12.1.46. IM-BloomMaker 「マルチファイルアップロード」エレメントの利用方法

BloomMakerは「マルチファイルアップロード」エレメントを使用して、登録画面でのファイルアップロードと別画面でのダウンロードができるアプリケーションを構築するためのツールです。このCookBookでは、アプリケーションが2つの画面（登録画面と一覧画面）から成り立っており、ファイル情報をデータベースに保存する方法を説明しています。また、REST APIを利用してファイル情報を取得し、利用する方法も含まれます。ファイルアップロードの際には、サイズ制限があり、初期値は10 MBです。この制限は設定ファイルで変更が可能です。設定ファイルの位置や変更方法についての情報も提供されています。

12.1.47. IM-BloomMaker トグルスイッチの使い方

このCookBookでは、BloomMakerの「トグルスイッチ」エレメントの利用方法と見た目の変更方法について紹介しています。「トグルスイッチ」は機能のON・OFFを制御するために使用され、ユーザが直感的に操作できるインタフェースを提供します。このエレメントを用いることで、workflowページのアクセス可否を簡単に制御するBloomMakerコンテンツを構築できます。トグルスイッチの状態は常にONまたはOFFとして設定され、切り替え時には画面上に何らかの変化を表示することが推奨されています。また、CSSエディタを利用して背景色の変更も可能です。最終的に、トグルスイッチを活用してワークフロー画面のアクセス制御を行うことができます。

12.1.48. 複数の種類のグラフを組み合わせて表示したり、自由にオプションを指定してグラフを表示したりできるエレメントのサンプル

IM-BloomMakerは、複数の種類のグラフを組み合わせて表示したり、自由にオプションを指定して表示できるアプリケーション画面を作成するためのローコード製品です。特に、グラフエレメントを利用することで、制限なくグラフを表示可能です。このサンプルエレメントではHighchartsを使用しており、グラフのカスタマイズやプロパティ指定も簡単に行えるのが特徴です。また、グラフに関するオプションを指定する際には、IM-BloomMakerの変数を利用し、Highchartsのサポートがあるバージョン内での利用のみ可能です。サンプルエレメントを通じて、グラフの追加、プロパティ設定、カスタマイズが簡単にできる環境を提供しています。

12.1.49. BloomMaker CSS エディタでコンテナ内だけに CSS を適用する方法

BloomMakerに関するCookBookでは、CSSエディタを利用して、特定のコンテナ内や異なるモードにスタイルを適用する方法を紹介しています。ユーザは、デザイナのコンテナ内だけにCSSを適用できるほか、プレビューやアプリケーション画面でのみスタイルを設定可能です。また、デザイナ画面と他の画面を区別する方法も説明されています。これにより、より柔軟で効果的なデザインが実現します。各機能は特定のクラス名を用いることで簡単に適用でき、デザインや表示の調整が可能です。

12.1.50. IM-BloomMaker カスタムスクリプトの小数の計算で誤差を出さない方法

このCookBookでは、IM-BloomMakerにおけるカスタムスクリプトの利用方法を解説しています。特に、小数の計算における誤差を抑える手法として、Fractionクラスを使うことを提案しています。Fractionは、IM-BloomMaker独自の高精度小数を扱うクラスで、数値や文字列を引数に取り扱うことができます。また、Fractionクラスでは、基本的な算術演算や値の比較、絶対値や四捨五入といった多くの便利な関数が利用可能です。このドキュメントは、正確な数値処理を求めるユーザに特に役立つものです。

12.1.51. IM-BloomMaker 「外部リソース埋め込みコンテナ」エレメントを使用してパブリックストレージ上のファイルを閲覧する画面を作成する方法

このCookBookでは、2021 Spring(Bergamot)でリリースされた「外部リソース埋め込みコンテナ」エレメントの利用方法を説明します。「外部リソース埋め込みコンテナ」エレメントは、ファイルのドラッグ＆ドロップや「外部リソース埋め込み」エレメントの data プロパティにパスを指定することでファイルを表示できる機能です。具体的には、パブリックストレージ上のファイルを閲覧する画面の作成方法が紹介されます。この機能により、PDFファイルの表示や、サーバロジックと連携してファイルを簡単に表示できる環境を整えることが可能です。完成イメージやサンプルファイルも提供されており、手順に沿って設定することで、ユーザは手軽に目的の画面を作成できます。

12.1.52. IM-BloomMaker Bulmaエレメントに使用するアイコンの探し方

このCookBookでは、intra-mart Accel Platform2020 Summer(Zephirine)から利用できる「Bulma」コンテンツ種別のアイコンについて説明しています。IM-BloomMakerのアイコンエレメントに使用するのは、Font Awesomeに定義されたうちの無料アイコンです。Font AwesomeはWebサイトやアプリ用のアイコンライブラリで、多くのアイコンが提供されています。アイコンエレメントはドラッグ＆ドロップで配置し、Font Awesomeから探した利用目的に合ったアイコンを設定します。Bulmaのアイコンエレメントに加え、他のフォーム部品やコンポーネントでもFont Awesomeのアイコンが使用可能です。以上が概要です。

12.1.53. IM-BloomMaker Bulma Theme Colored について

このCookBookでは、intra-mart Accel Platform2021 Summer(Cattleya)から利用可能なコンテンツ種別「Bulma Theme Colored」を紹介します。

「Bulma Theme Colored」は、intra-mart Accel Platformのデザインに調和した配色で、コンテンツ種別「imui」との統合が可能です。

このコンテンツ種別は、intra-mart Accel Platformのテーマ色に基づく配色変更、一部独自カラーの適用、intra-mart Accel Platform向けのフォントが特徴です。 設定は新規作成時に「Bulma Theme Colored」を選ぶだけで行え、作成後も「Bulma」との相互変更が可能です。

「Bulma」との違いは配色、プロパティ設定、フォントに見られ、全体的にintra-mart Accel Platformに適したデザインが採用されています。 特にフォント変更により折り返し位置が変わる場合があるため、注意が必要です。 ```

12.1.54. IM-BloomMaker imui の「ボタン」エレメントの背景色を css エディタで適用する方法

このCookBookでは、BloomMakerの「ボタン」エレメントの背景色をCSSエディタで設定する方法を説明しています。完成サンプルをダウンロードし、簡単に利用できる方法を提供しています。最初に、imuiの「ボタン」エレメントの背景色をカスタマイズする手順を説明し、その後、標準テーマ利用時にうまく適用するためのCSS調整方法を紹介しています。具体的には、CSSセレクタを利用して背景色を変更し、異なるテーマの影響を受けずにスタイルを設定する方法について触れています。最終的に、背景色を赤に変更することで見た目の調整ができることを示しています。

12.1.55. IM-BloomMaker 異なるコンテンツ間でアクションをコピーする方法

BloomMakerは、アクションの複製機能を提供するローコード製品です。この機能により、異なるコンテンツ間でアクションの切り取り・コピー・貼り付けが可能です。2021 Winter(Dandelion)以降、ユーザは別タブにまたがってアクションを扱えますが、アクション内の変数やコンテナページはコピーされないため、事前準備が必要です。具体的には、コピー先で必要な変数やコンテナページ・アクションを作成する必要があります。アクションをコピーするためには、デザイナを用いてコピーと貼り付けを行い、その後に各アクションアイテムのパラメータ設定を確認する必要があります。これにより、コピーされたアクションが正常に動作するか検証できます。

12.1.56. IM-BloomMaker リッチテーブルのセルにボタンや画像を表示する方法

BloomMakerは、リッチテーブルエレメントに「columnSettings」プロパティを利用することで、さまざまなコンテンツ（リンク、ボタン、画像、セレクトボックス、テキストエリアなど）を表示できる機能を提供します。この機能を使用すると、リッチテーブルのセルにインタラクティブな要素を組み込むことができます。また、サンプルデータのセットアップやルーティングの定義により、簡単に動作を確認できます。具体的な設定例として、URL、ボタンの配置、画像リンクをカスタマイズする方法が示されており、ユーザは目的に応じてテーブルの列を柔軟に設定できるのが特徴です。

12.1.57. IM-BloomMaker レイアウトの作り方（縦に並べる編）

CookBookでは、コンテンツ種別がBulmaのエレメントを使用して縦に並べる方法について説明しています。HTMLには、ブロックレベル要素とインライン要素があり、特にブロックレベル要素は縦に配置可能です。IM-BloomMakerでは、ボックスやフレックスコンテナ、テーブルなどのエレメントを使って縦向きのレイアウトを簡単に作成できます。各エレメントは様々なデザイン用途に合わせてカスタマイズ可能で、使いやすく、視覚的に整理されたインタフェースを提供します。さまざまな部品やフォーム部品もあり、直感的な操作でレイアウト設計が行えます。

12.1.58. IM-BloomMaker レイアウトの作り方（横に並べる編）

BloomMakerでは、横向きにエレメントを配置するための各種レイアウト手法を提供しています。主に「フレックスコンテナ」や「テーブル」などの標準レイアウト機能があり、Bulmaを利用したレスポンシブデザインも可能です。「水平コンテナ」や「カラム」を使用することで、エレメントを均等に配置したり、シンプルな横並びレイアウトを実現できます。また、「タイル」などを活用することにより、自由なグリッドレイアウトもサポートされています。レイアウトの作成にあたり、詳細な方法は公式ドキュメントを参照することが推奨されます。

12.1.59. IM-BloomMakerでテーブルに行追加・行削除を行う方法

IM-BloomMakerは、テーブルに行の追加や削除を行うための機能を提供します。カスタムスクリプトを使用して、配列変数を操作し、動的に行を管理できます。ユーザは、ボタンをクリックすることで行の追加や削除を実施でき、これによりインタラクティブなデータ管理が可能です。完成例としては、Bulmaやimuiのスタイルを用いた繰り返しテーブルが示されています。これらの機能は、intra-mart Accel Platform2021 Winter(Dandelion)以降のバージョンで利用可能です。リッチテーブルを使用する場合は、削除のロジックが異なる点に注意が必要です。ユーザはサンプル資材をダウンロードし、具体的な実装方法を確認できます。

12.1.60. IM-BloomMaker ストレージ上のファイルをダウンロードする方法

BloomMakerは、ユーザがファイルをダウンロードするためのローコードプラットフォームです。まず、パブリックストレージにダウンロード対象のファイルを配置し、IM-LogicDesignerでそのファイルをダウンロードするためのロジックを作成します。次に、IM-BloomMakerを使用して、ダウンロード機能を持つ画面を作成します。主なアクションには、IM-LogicDesignerフロールーティングにリクエストを送信する方法やURLへのリクエスト送信があります。ファイルのダウンロードを可能にするためには、正しいレスポンス設定やURIの認証が必要です。これらの手順を通じて、ユーザがファイルを簡単にダウンロードできる環境を構築します。

12.1.61. IM-BloomMaker 複数のプルダウンを連携させる方法

BloomMakerは、複数のプルダウンを連携させる機能を提供します。このCookBookでは、都道府県を選択後、その中の市区町村が選べるように設定する手順が説明されています。具体的には、フォーム部品を用いてプルダウンを配置し、選択された都道府県に基づいて市区町村の情報を取得します。最初に必要な定義を設定し、アクションを作成して動作を確認することが可能です。サンプルデータも提供されており、新しい機能の開発に役立ちます。また、補足情報としてプルダウンの制御についても言及されています。

12.1.62. IM-BloomMaker リッチテーブルのデータ部分を横スクロールさせる方法

BloomMakerでは、リッチテーブルのデータ部分を横スクロールさせる機能が提供されています。intra-mart Accel Platform2018 Summer(Tiffany)以降のバージョンで利用可能です。サンプルのインポートファイルを使用して、リッチテーブルの横幅やセルの横幅を設定することで、データ部分のスクロール設定が行えます。また、リッチテーブルの縦幅を指定することで、縦スクロールも実現できます。これにより、データ表示の見やすさが向上します。

12.1.63. IM-BloomMaker 排他制御エレメントの使い方

このCookBookでは、2021 Winter(Dandelion)でリリースされた「排他制御」エレメントの使用方法を説明しています。「排他制御」エレメントは、特定の業務画面や業務データを排他的に制御するための機能で、データの同時編集を防止します。サンプルでは、複数のユーザが異なるブラウザで同じデータを編集し、編集時の排他制御の様子を示しています。ユーザは、エレメントのプロパティを設定することで、業務画面やデータを特定し、ロック状態を管理できます。特に「unlockOnLeave」や「onUnlockedEvent」といったプロパティについても言及されており、正しく設定することで期待される動作を実現できます。

12.1.64. IM-BloomMaker エレメントを狙った位置に配置する方法

BloomMakerでは、エレメントを狙った位置に配置する方法が豊富です。新規にエレメントを配置する際は、エレメントパレットをダブルクリックし、選択したエレメント内に配置します。既存のエレメントを移動させる場合は、画面構成からエレメントツリーをドラッグ＆ドロップすることで実現できます。この操作により、配置先の狭さに関係なく、思い通りの位置にエレメントを配置可能です。動的なレイアウト変更が容易に行えるため、ユーザは効率的に画面設計ができるのが特徴です。

12.1.65. IM-BloomMaker リッチテーブルのセルにアイコンを表示する方法

このCookBookは、リッチテーブルのセルにアイコンを表示する方法を解説しています。アイコンとしては、Font Awesome 5やCSS Sprite Image Listが利用でき、特にコンテンツ種別「imui」および「Bulma」に対応しています。アイコンの表示方法には、一括指定および個別指定があり、各方法により設定が可能です。また、アイコンをクリックした際のアクション設定もできるため、ユーザの操作性を向上させることが可能です。サンプルファイルのインポートも紹介されており、操作手順に従うことで簡単にアイコン表示を実現できます。

12.1.66. IM-BloomMaker アイコンのハイパーリンクを作成する方法

BloomMakerを使用すると、「ハイパーリンク」エレメントを通じてアイコンを組み込んだリンクを作成できます。具体的には、「ハイパーリンク」エレメントの中に「アイコン」エレメントを配置することで、文字とアイコンの両方を含むリンクが完成します。ユーザは、アイコンのクラスを指定することで多様なアイコンを使用でき、アイコンのみのハイパーリンクも作成可能です。また、「画像埋め込み」を用いた画像のハイパーリンクの作成もサポートされています。詳細は、関連の開発動画にて視覚的な説明を参照してください。

12.1.67. IM-BloomMaker セルが結合されたテーブルの作成方法

このCookBookでは、セルが結合されたテーブルの見た目を「Bulma」の「カラム」を使用して作成する方法を紹介しています。完成サンプルはダウンロード可能で、2018 Summer(Tiffany)版以降でインポートできます。カラムの設定、見た目作成、CSSの設定、およびモバイルサイズの調整を行うことで、レスポンシブなデザインのテーブルが実現できます。最終的に、ユーザはさまざまなサイズのセルを持つテーブルを作成できます。

12.1.68. IM-BloomMaker ボタンに効果音を付ける方法

このCookBookでは、2022 Spring(Eustoma)でリリースされた「音声または動画〇を再生する」アクションアイテムの使い方を紹介します。「音声または動画〇を再生する」アクションアイテムを使用することで、音声や動画の再生制御が可能です。また、「音声または動画〇を一時停止する」や「音声または動画〇を再生・一時停止する」アクションアイテムを用いて、停止制御も行えます。この機能を活用して、画面上のボタンに効果音を付加したり、インタラクティブな体験を作成したりできます。さらに、サンプルをダウンロードでき、具体的な実装手順も提示されています。

12.1.69. IM-BloomMaker 時刻入力のisErrorプロパティを利用して最大値・最小値を分かりやすくする方法

BloomMakerの「時刻入力」エレメントでは、maxおよびminプロパティを使用して、入力可能な時刻の範囲を設定できます。指定した範囲を超える時刻が入力された場合、「isError」プロパティを利用して、エラーの発生を確認できます。このプロパティは、範囲外の時刻が入力されると「true」を返し、そうでない場合は「false」です。エラー時には赤い枠でハイライト表示され、エラーメッセージも表示されます。サンプルのダウンロードも可能で、具体的な実装手順が示されています。

12.1.70. IM-BloomMaker Bulma のタブを使用したページ切り替え処理の作り方

このCookBookでは、Bulmaのタブコンポーネントを使ったページ切り替え処理について紹介しています。初期表示時や各タブ選択時の完成イメージを示し、2022 Spring(Eustoma)版以降で利用可能な完成サンプルのダウンロード情報も提供しています。IM-BloomMakerのインポート機能を利用してコンテンツを作成し、タブを通じて表示切替を行えるように設定します。また、エレメントのプロパティに応じた表示や非表示の設定方法についても詳しい手順が記載されています。ルーティング定義を設定することで、アプリケーションとして公開することが可能です。

12.1.71. IM-BloomMaker 排他制御エレメントでロックを取得したユーザのみが編集できる画面の作成方法

CookBookでは、「排他制御」エレメントを活用して、ロックを取得したユーザのみが編集できる画面の作成方法を紹介します。このエレメントは2021 Winter(Dandelion)でリリースされた共通エレメントです。サンプルでは、ロックされた状態での値の編集が可能な画面のイメージが提供されています。また、サンプルはintra-mart Accel Platform2022 Winter(Freesia)以降のバージョンで利用可能です。手順としては、変数作成、アクション設定、「排他制御」エレメント配置、そして動作確認の流れがあります。最終的には、設定されたプロパティに基づいてエレメントが制御される仕組みです。

12.1.72. IM-BloomMaker 日付入力の preserveTime プロパティを利用して時刻入力に同一の変数を指定する方法

このCookBookでは、日付入力エレメントと時刻入力エレメントを同じ変数に利用する方法を解説しています。日付入力エレメントのpreserveTimeプロパティを有効にすることで、日付入力時に時刻情報を保持できます。ユーザは日付入力エレメントと時刻入力エレメントの両方から入力したデータを同一の変数に反映させることが可能です。エレメントのプロパティ設定により、変数に格納されるデータが意図通りに表示されます。動作確認では、各エレメントからの入力が適切に反映されることを確認できます。また、時刻入力エレメントのshowSecondsプロパティを有効にすると、時・分・秒までの入力が可能です。

12.1.73. IM-BloomMaker 複数行明細テーブルのような見た目を実現する方法

BloomMakerでは「ボックス（繰り返し）」と「フレックスコンテナ」を利用して、複数行明細テーブルのような見た目を実現できます。テーブルプロパティの直接的な制御はできないため、インタフェースの工夫が必要です。利用者は完成サンプルをダウンロードし、インポート機能を通じて実環境に導入できます。前提条件として、コンテンツ種別「Bulma」の作成が求められます。具体的には、データをマップ型の配列として設定し、CSSやレイアウトを整えることで、最終的に視覚的に整ったテーブルを作成します。このプロセスを通じて、ユーザ自身のニーズに合わせたカスタマイズが可能です。

12.1.74. IM-BloomMaker 変数セレクタを表示中でも変数を編集できます

IM-BloomMakerでは、変数セレクタを開いたままで新しい変数を作成できます。エレメントのプロパティやアクションで変数を指定する際、変数セレクタを利用すると簡単です。ダイアログが表示されているときでも、変数タブは操作可能で、変数の新規作成、編集、削除ができます。変数を作成すると、その変数が自動的に選択されます。また、内容が大きく変わる操作（例：コピーや一括置換）を行う場合は、変数セレクタを閉じる必要があります。スムーズな変数操作が可能です。

12.1.75. 面グラフの作り方とスプレッドシートとのデータ連携のやり方

BloomMakerは、アプリケーションで面グラフを作成し、グラフエレメントとスプレッドシートのデータ連携を行える製品です。ユーザは、グラフエレメントを利用して視覚的なデータ表現を行い、スプレッドシートを介してデータの管理や操作を実施できます。このCookBookでは、グラフ作成の手順やカスタマイズ方法、スプレッドシートとの連携手法を紹介しています。また、IM-BloomMakerの変数を用いた動的なデータ処理が可能で、高度な設定や操作が実現できることがポイントです。注意が必要な点として、特定のコンテンツ種別でのグラフの表示制約や、指定できるオプションの制限があります。これらを踏まえて、ユーザは良好な動作を確認しながら利用することが重要です。

12.1.76. リッチテーブルの任意の列を非表示にする方法

このCookBookでは、BloomMakerにおけるリッチテーブルの任意の列を非表示にする方法を紹介しています。列の非表示機能は、intra-mart Accel Platform2022 Spring(Eustoma)から利用可能です。サンプルファイルをダウンロードし、IM-BloomMakerのインポート画面からインポートすることで、実際の設定手順を体験できます。リッチテーブルのプロパティ設定を通じて、列の表示・非表示を切り替えることが可能です。特定のバージョンに応じて、動的に列の表示・非表示を行う方法も異なるため、注意が必要です。これにより、ユーザが必要に応じて情報を整理して表示できる柔軟性が得られます。

12.1.77. IM-BloomMaker Chrome 拡張機能のデバッグツールの使い方

このCookBookでは、2022 Winter(Freesia)でリリースされたChrome拡張機能のデバッグツールを使ったデバッグの手順を紹介します。主に、不具合のあるIM-BloomMakerのコンテンツをデバッグし、正しい計算結果を表示させる方法に焦点を当てています。デバッグツールはプレビュー画面やアプリケーション画面で利用可能で、インストールや権限設定が必要です。ツールを利用することで、変数やアクションの状態を確認し、バグの原因を特定して修正できます。ブレークポイントを活用し、変数の値を監視しながらデバッグを行い、最終的に正しい結果が得られることを確認します。このツールを用いることで、より効率的にデバッグ作業が進められます。

12.1.78. IM-BloomMaker 時刻入力に設定した日付・時刻型変数の日付やタイムゾーンはどうなっているの？

「時刻入力」エレメントは、ユーザが時刻を入力するためのフォームです。このエレメントの value プロパティには、ISO 8601形式の日付・時刻型変数を指定できますが、表示されるのは「時・分」または「時・分・秒」のみです。タイムゾーンは個人設定に基づいて適用され、appliedTimeZone プロパティで保存するタイムゾーンを設定できます。appliedTimeZoneには「variable」と「account-context」が選択でき、この設定により入力時間のタイムゾーンが変わります。異なるタイムゾーンでの時刻入力を統一するための運用が可能です。多様な利用シーンに応じた設定が重要です。

12.1.79. IM-BloomMaker 数値入力（フォーマット）の独自のプロパティの紹介

BloomMakerの「数値入力（フォーマット）」エレメントは、数値ボックスを表示する機能を提供します。主なプロパティには、3桁区切りの形式を設定する「decimalFormat」、小数点以下の桁数を指定する「fractionalPartLength」、端数処理方法を選択できる「round」および処理した値を保存するかどうかを設定する「saveRoundedValue」があります。これらのプロパティを用いることで、ユーザは数値の表示形式や処理方式を柔軟にカスタマイズできます。今回の情報を活用し、必要に応じてエレメントを設定してください。

12.1.80. IM-BloomMaker 実行画面のURLの一部を入力値に割り当てる方法

IM-BloomMakerでは、コンテンツ定義をルーティング定義に関連付けることにより、特定のURLにアクセスしてコンテンツを実行できます。入力値は、前処理プログラムを使わずにURLのクエリやパス変数を通じて設定可能です。具体的には、URLの末尾にクエリを追加したり、一部を入力値として使用したりします。この方法により、同じコンテンツ定義とルーティング定義を用いて、初期表示内容を変えることができます。利用者は、変数を初期値としつつ、画面上で変更も可能にする設定も行えます。具体的なサンプルや設定手順については、IM-BloomMakerのドキュメントを参照してください。

12.1.81. IM-BloomMaker ページのトップに戻るボタンの作り方

このCookBookでは、IM-BloomMakerを使用してページのトップに戻るボタンを作成する方法を紹介しています。ボタンは画面の右下に表示され、クリックするとページの上部にスクロールします。サンプルファイルをダウンロードし、IM-BloomMakerのインポート画面からインポートすることで環境が整います。また、ボタンのCSSを設定することで、表示位置やデザインをカスタマイズできます。さらに、アイコンを追加することで視覚的なインパクトを強めることも可能です。注意点として、使用するバージョンについての制限があるため、事前に確認が必要です。

12.1.82. IM-BloomMaker で ページアイコン（favicon） を設置する方法

IM-BloomMakerを使用すると、ページアイコン（favicon）を簡単に設定できます。まず、アイコンの画像をWeb Serverに配置し、次にコンテナ設定で「ページアイコン」のパスを指定します。設定が完了したら、プレビューでページアイコンの表示を確認できます。この機能は、intra-mart Accel Platform2023 Spring(Gerbera)以降のバージョンに対応しています。特定のサンプルデータをインポートして活用することも可能です。ブラウザのタブに反映されたアイコンを確認するためには、キャッシュクリアも検討してください。

12.1.83. IM-BloomMaker リッチテーブルで大量のデータを扱う時に読み込みを速くする方法

このCookBookでは、intra-mart Accel Platform2023 Autumn(Hollyhock)でリッチテーブルエレメントを使用した大量データの高速読み込み方法を紹介しています。新たに追加された「pagingType」プロパティを利用することで、必要なデータのみを実行時に取得し、パフォーマンスの悪化を防げます。この方法はintra-mart Accel Platform2023 Spring(Gerbera)以前のバージョンでは実現できず、全データを初回に一括取得する必要がありました。「pagingType」を「manual」に設定することで、ユーザは簡易検索、ページ移動、およびソート機能の実装が必要です。また、指定したバージョン以降のサンプルファイルを使用して、リッチテーブルの設定を行うことができます。

12.1.84. IM-BloomMaker リッチテーブルの特定の行の背景色を変更する方法

このCookBookでは、リッチテーブルの特定の行の背景色を変更する方法を紹介しています。行を指定するためには固定値を使用する必要があり、動的な変更はできません。完成サンプルをダウンロードして活用でき、2023 Autumn(Hollyhock)版以降でインポート可能です。手順としては、コンテナページにリッチテーブルエレメントを配置し、CSSエディタを編集し、プレビューで確認します。背景色は指定した行に対してのみ適用され、カーソルを当てることで背景色が変わる仕組みです。

12.1.85. 【IM-BloomMaker】レイアウトモードで上下左右キーを使って部品の余白を調整してみる

BloomMakerは、レイアウトモードで部品の余白を効率的に調整できる機能を提供します。このCookBookでは、上下左右キーを用いて部品の配置を簡単に操作する方法を解説しています。ユーザが作成するコンテンツは、特定のテンプレートとコンテンツ種別を使用し、インポート機能を活用して利用可能です。また、サンプルデータも提供されており、今後の開発に役立ちます。部品の余白調整が確実にできることから、使い勝手の向上が期待できます。

12.1.86. IM-BloomMaker 変数の代入値が変更された時にアクションを実行するサンプル

この CookBook では、BloomMakerを用いて変数の代入値が変更された際にアクションを実行する方法を紹介しています。具体的には、以下の2つの手法が提案されています。1つ目は「タイマー」エレメントを使用し、定期的に変数の値を確認する方法です。2つ目は、intra-mart Accel Platform2021 Winter(Dandelion)以降に利用できる「変数の変更を監視するエレメント」を作成し、値の変更時に自動的にアクションを実行する方法です。これにより、非同期処理から受け取った情報を一覧画面に反映させる柔軟なシステムの構築が可能です。注意点として、サンプルエレメントの動作確認が求められます。条件に応じた適切な方法を選択してください。

12.1.87. IM-BloomMaker 入力規則エラーメッセージをカスタマイズする方法

このCookBookでは、「入力規則エラーメッセージ」エレメントのカスタマイズ方法を解説しています。intra-mart Accel Platform2024 Autumn(Jasmine) から、任意のエラーメッセージを指定できるようになりました。「入力規則エラーメッセージ」エレメントには、選択した入力規則（正規表現パターンやユーザコード形式など）に基づいて指定したエラーメッセージが表示されます。利用者は、エラーメッセージに入力項目名を埋め込むことや、多言語化することもでき、求める言語に合ったメッセージを表示できます。特定のバージョン以前では、この機能は利用できないため注意が必要です。

12.1.88. 【IM-BloomMaker】マークダウンエレメントに任意のデザインを追加する方法

BloomMakerは、マークダウンエレメントに任意のデザインを追加できる機能を提供しています。このCookBookでは、デザイナのタイプを「デベロップモード」とし、特定のCSSスタイルを指定する方法を説明しています。ユーザは、マークダウンエレメントに必要な要素を配置し、カスタムCSSを設定することで、独自のデザインを適用できます。また、サンプルファイルをインポートすることで、具体的なデザイン例を参照することも可能です。最終的に、CSSの設定を確認し、デザインが反映されているかを確認します。

12.1.89. ページ読み込み時にアクションを実行する方法

BloomMakerは、ユーザがページ読み込み時やページ離脱時にアクションを実行する方法を提供します。デザイン編集画面には、コンテナと呼ばれる要素があり、そこから特定のアクションを設定できます。コンテナはコンテナページの下に位置し、クリックやツールバーのアイコンで選択可能です。「ページ読み込み時」や「ページ離脱時」で設定したアクションは、プロパティタブ内の「イベント」から行えます。この機能を活用すれば、ユーザの動きに応じたインタラクションを実現できます。各アクションの利用例は、関連するCookBookで参照できます。

12.1.90. 配置可能なエレメントを簡単に判断する方法

BloomMakerでは、エレメントの配置ルールを簡単に判断できます。特定のエレメントは、他のエレメントの配下に配置する必要があり、「フィールド」エレメントのように直接配置できるエレメントがない場合は点線が表示されません。コンテンツ一覧から「Bulma」種別で新規コンテンツを作成し、デザイン編集画面で左ペインのエレメントパレットを開くことで、どのエレメントが配置可能かを視覚的に確認できます。点線の有無で配置の可否が示され、配置できないエレメントを選択しても反映されない仕組みです。これにより、エレメントの配置を効率的に行えます。

12.1.91. IM-BloomMaker アクション「エレメントの位置へ遷移する」の使い方

このCookBookでは、intra-mart Accel Platform2024 Autumn(Jasmine)でのアクション「エレメントの位置へ遷移する」について解説しています。本製品では、特定のエレメントに簡単に遷移するボタンを作成できる機能を提供します。ユーザは、ボタンの位置やスタイルを自由に設定し、クリックイベントにアクションを割り当てることで、スムーズなナビゲーションを実現できます。サンプルファイルをインポートすることで、具体的な実装例を活用できる点も特徴です。これにより、ユーザは簡潔かつ直感的な操作によってインタフェースをより使いやすくできます。

12.1.92. 最初に表示するページを指定する方法

BloomMakerを使用すると、コンテナページを追加してカスタマイズできます。デザイン編集画面から新しいコンテンツを作成し、コンテナページを追加して、各ページに見出しを配置可能です。最初に表示するページを指定する方法は、コンテナのプロパティまたはタブから行えます。プロパティで「メインページ」を設定すると、指定したページがプレビュー画面に表示されます。また、各ページのタブをダブルクリックすることで、最初に表示するページを変更できます。これにより、ユーザは任意のコンテナページを表示させることができます。

12.1.93. 「ラベル〇にジャンプする」と「ラベル〇」の利用方法

BloomMakerでは、アクションアイテム「ラベル○にジャンプする」と「ラベル〇」を使用して、アクション内でアイテムのスキップができます。この2つはセットで利用し、実行条件をタグ付けする際に役立ちます。特に、ユーザが特定の部署、例えて「サンプル課」等に所属する場合に、条件に応じてアクションをスキップしたり実行させたりできます。これにより、複雑な条件設定が簡素化され、効率的なアクション管理が可能です。

目次 ≪  12. 付録 12.2. 設計書出力のテンプレート  ≫

Copyright © 2019 NTT DATA INTRAMART CORPORATION

⇄ Sidebar ↑Top