簡単! @関数だけで、一次承認ワークフロー ～おまけ その2

みなさま、こんにちは!
第三回大阪研究会、いよいよ今週末に迫りました。
今からチャンピオンの方のお話しが聞けるのが楽しみでなりません。
小耳に挟んだ情報では、Notesユーザーが知っておくべき事例などもお話し頂けるとか。
興味津々です。
もちろんご参加はまだまだ間に合いますので、ぜひお時間作ってご参加ください!
お申し込み、お問い合わせは事務局まで。

さて前回よりモバイルコントロールを使用したスマホ向け画面を作成しております。
今回はビューに続き、フォームページを追加してみますので、前回作成したXPage「m_mobile」を開いてください。

通常のWEBページと違い、モバイル用のページは「単一ページアプリケーション」内に複数の「アプリケーションページ」を追加します。
なおチュートリアルでは新規作成等も可能な手順が記載されておりますが、本掲載ではできるだけ簡素化するため、新規作成の機能は省いております。

前回作成したビューのアプリケーションページの右側へ、あらたな「アプリケーションページ」を配置します。

必ずアウトラインで、viewpageと同じ階層にあるか、確認しておいてください。

続いて配置アプリケーションページの「すべてのプロパティ」にて以下を設定します。

id : documentpage pageName : documentpage resetContent : true (Open時にページを更新)

続いて前回作成したビューから今回のアプリケーションページを開く設定を行います。
「データビュー」コントロールの「すべてのプロパティ」を開き、基本内下記設定を行います。

pageName : documentpage

次に、新たに追加したアプリケーションページのファセットに「ページ見出し」を追加し、「すべてのプロパティ」の基本内にて以下設定を行います。

back : 戻る label : ワークフロー moveTo : viewpage transition : slide

以上でプリビューすると、下記のように表示されます。
ビューページには各行の右端に>、
行をタップすると、フォームページが開き、上部の「戻る」ボタンでビューページに戻ります。

　

続いてフォームページの内容を追加して参ります。

アプリケーションページ(documentpage)のページ見出しの右横に「コンテナコントロール」から「パネル」を配置します。

追加したパネルにフォームをバインドします。
「パネル」のプロパティにて、「データ」を選択し、データソースの追加をクリックし、「Domino文書」を選択します。

データソースに「document1」が追加されますので、下記設定を行います。

フォーム : フロー - Flow デフォルトアクション : 文書を開く フォーム検証の実行 : 文書ロード時 (デフォルト値等を有効にする)

続いてパネル内に「拡張ライブラリ」から「フォームテーブル」を配置します。
またフォームテーブル内のファセットに、「フォームレイアウト行」を配置します。

フォームレイアウト行の「すべてのプロパティ」を開き、下記設定を行います。

label : ステータス

次に「コアコントロール」より「編集ボックス」をフォームレイアウト行のファセットに配置します。

計算結果フィールドの「値」プロパティを開き、バインド先を「Status」に変更します。
フォントタブにて表示が変更可能です。
※私の例では、フォント : メイリオ、サイズ : 14、色 : オレンジとしました。

プリビューすると、以下のようになります。

次に、届出内容を追加します。
先に配置したフォームレイアウト行の右に、さらに「フォームレイアウト行」を配置し、label を「内容」とします。
アウトラインは下記のようになります。

「コアコントロール」から「編集ボックス」をファセットに配置し、データを「Title」にバインドします。

さらに「フォームレイアウト行」を追加し、label を「申請者」とします。

「コアコントロール」より「編集ボックス」をファセットに配置し、データを「Dsp_Applier」にバインドします。

同様に「フォームレイアウト行」を追加し、label を「承認者」とします。

「コアコントロール」より「編集ボックス」をファセットに配置し、データを「Sendto」にバインドします。

引き続き「フォームレイアウト行」を3行追加し、それぞれlabel を「開始日」「終了日」「事由」とします。

それぞれのファセットに「編集ボックス」を配置し、「Start」「End」「Reason」をバインドします。

以上でプリビューすると、以下のように表示されます。

いかがでしたか?

それほど難しい作業をすることなく、スマホ用の画面が出来ました。

先にも書きましたが、今回の一連の記事はできるだけ簡単な作業でアプリケーションをスマホで表示できることを紹介することを主眼におきましたので、一旦こちらで完了致します。

できましたら皆様には先にご紹介したチュートリアルに従い、サンプルワークフローを完成してみることを強くお勧め致します。