7.4. タブ切替を利用する¶
画面遷移設定から複数の画面を作成し、「タブ切替」を設定すると、1つのタスク(ノード)の画面に複数の画面をタブで表示することができます。
Contents
7.4.1. タブ切替とは¶
タブ切替は、1つのタスク(ノード)に対する複数の画面をタブで表示するための機能です。タブ切替では、タブのみの構成と、タブの上に別の画面を「ヘッダーフォーム」として組み合わせる構成の2パターンから選んで設定することができます。注意
- 1つのタスク(ノード)に対して「 画面遷移 」と同時に利用することはできません。
- 「タブ切替」は、「スマートフォン表示」で利用できません。
コラム
タブ切替では、ヘッダーフォーム、タブフォームともに、フッターの設定に関わらずフッターは表示されません。
コラム
タブ切替時のタブインデックスの指定
タブ切替を利用する場合、タブインデックスはヘッダフォームとタブフォーム間でタブインデックスが重複しないようにしてください。ヘッダフォームとタブフォームに重複した値が設定されている場合、タブインデックスに同じ値を設定されたヘッダフォームの項目、タブフォームの項目の順にフォーカスが移動します。注意
1つのフロー内で複数のフォームを持つ場合の「参照」画面の表示
本項で扱っている「コピー」や「画面遷移」を利用して、1つのフロー内で複数のフォームを登録している場合、以下のリンク先に基づいて「参照」画面に対する画面遷移を設定してください。なお、本件については、以下のリリースノートでも「制限事項」に記載がありますので、併せて参照してください。
「 IM-BIS リリースノート 」-「 制限事項 」- IM-BIS で作成したフローの一部の画面は、レイアウトが崩れて表示される場合があります。設定を行っていない場合、 IM-BIS がシステム用として定義している「メインフォーム」が表示されます。IM-BIS におけるメインフォームは、あくまでシステムでの管理上の目的で利用するため、変更せずに参照画面を表示すると、以下の問題が発生します。
- 参照画面上に複数の同じボタンが重なって配置される。
- 「メインフォーム」を直接更新した場合であっても、「定義の反映」を実行すると更新内容が取り消される。
7.4.4. タブ切替を設定する(ヘッダーフォームなし)¶
7.4.4.1. 1つめのタブに表示する画面を作成する¶
「 IM-BIS の基本的な設定 」を参考に、BIS定義の登録から1つめの画面を作成する作業までを行います。(タブ切替の設定を行う前には、必ず対象のタスク(ノード)に1つ以上画面を設定しておく必要があります。)
7.4.4.2. 画面遷移設定を表示し、タブ切替を設定する¶
7.4.4.3. タブの画面を追加する¶
画面遷移設定で他のタブに表示する画面を追加します。
遷移方法を「タブ切替」に変更します。
最初に作成した画面は「タブフォーム」の一覧に表示されていますので、他のタブに表示する画面を追加するために「追加」をクリックします。
「フォーム-登録」画面が表示されますので、必要な情報を入力し、「登録」をクリックします。
「フォーム・デザイナ」画面が表示されたら、最初に設定した画面と同様にアイテムを配置し、画面を作成します。タブの表示名を設定するために「ヘッダーとフッター」をクリックします。
ヘッダー設定のチェックをオンにし、タイトル名にタブの表示名を入力してから「設定」をクリックします。
画面が作成できたら「更新」をクリックし、画面を保存します。
同様の手順で、タブに表示する画面の作成を繰り返し行い、タブに表示するすべての画面が設定できたら「更新」をクリックして保存します。
以上で、1つのタスク(ノード)に対するタブで表示する画面(ヘッダーフォームなし)が設定できました。この後は、フローの実行に必要な設定を行ってください。
7.4.5. タブ切替を設定する(ヘッダーフォームあり)¶
7.4.5.1. 1つめのタブに表示する画面を作成する¶
「 IM-BIS の基本的な設定 」を参考に、BIS定義の登録から1つめの画面を作成する作業までを行います。(タブ切替の設定を行う前には、必ず対象のタスク(ノード)に1つ以上画面を設定しておく必要があります。)
7.4.5.2. 画面遷移設定を表示し、タブ切替を設定する¶
7.4.5.3. タブの画面を追加する¶
画面遷移設定で他のタブに表示する画面を追加します。
遷移方法を「タブ切替」に変更します。
最初に作成した画面は「タブフォーム」の一覧に表示されていますので、他のタブに表示する画面を追加するために「追加」をクリックします。
「フォーム-登録」画面が表示されますので、必要な情報を入力し、「登録」をクリックします。
「フォーム・デザイナ」画面が表示されたら、最初に設定した画面と同様にアイテムを配置し、画面を作成します。タブの表示名を設定するために「ヘッダーとフッター」をクリックします。
ヘッダー設定のチェックをオンにし、タイトル名にタブの表示名を入力してから「設定」をクリックします。
画面が作成できたら「更新」をクリックし、画面を保存します。
同様の手順で、タブに表示する画面の作成を繰り返し行い、タブに表示するすべての画面を追加します。
7.4.5.4. ヘッダーフォームを作成する¶
最後にヘッダーフォームを追加して、タブ切替の画面を完成させます。
すべてのタブフォームの設定後に、「画面遷移設定」で「ヘッダーフォーム」の「追加」をクリックします。
「フォーム-登録」画面が表示されますので、ヘッダーフォームに必要な情報を入力し、「登録」をクリックします。
ヘッダーとして表示するフォームを作成したら、「更新」をクリックして画面(フォーム)を保存します。
最後に「画面遷移設定」の「更新」をクリックして、タブ切替の設定内容を保存します。
以上で、1つのタスク(ノード)に対するヘッダーとタブを組み合わせて表示する画面が設定できました。この後は、フローの実行に必要な設定を行ってください。
7.4.6. タブ切替で入力チェックを設定する¶
タブ切替を利用する場合、タブで表示する画面に設定した入力チェックは、対象のタブに配置した「ボタン(次へ)」や「ボタン(登録)」、タブのクリックによる遷移時に行われます。ただし、タブやヘッダーフォームに配置されている「ボタン(登録)」をクリックしたタイミングで入力チェックが行われた場合には、表示されなかったタブに配置されているアイテムに設定された入力チェックが行われません。そのため、タブに配置したアイテムの入力チェックをもれなく行うためには、タブ自体を表示必須とするチェックを合わせて設定する必要があります。ここでは、アイテムの入力チェックと、タブの表示必須チェックの設定の手順を説明します。
7.4.6.1. タブで表示する画面を作成する¶
上の「タブ切替を設定する」を参考に、タブで表示する画面を作成します。