前回は，新規エントリー入力フローの画面設計とバリデーション定義を行いました。今回は，新規エントリー入力フローと同様に，残りのふたつのフロー，エントリー一覧フローとエントリー編集フローの画面設計とバリデーション定義を行います。
表示項目の検討とアプリケーションへの反映－エントリー一覧画面
エントリー一覧フローが持つ唯一の画面であるエントリー一覧画面は，既存のエントリー一覧の参照や，任意のエントリーに対するエントリー編集フローへの遷移に使われる画面です。この画面の表示項目は，新規エントリー入力画面で準備した項目のひとつである「タイトル」のみとします。また，この画面に表示される各エントリーからは，エントリー編集フローに遷移できる必要がありますので，そのためのリンクも用意しなければいけません。以上を考慮し変更を加えたHTMLテンプレートと，変更後の画面を下記に示します。
/path/to/pieceblog/web/webapp/templates/Entry/List.html
<h4 class="date-header">List</h4>
<table border="1">
<tr flexy:foreach="entries,entry">
<td><a href="{__appRootPath}/edit.php?id={entry.id}">{entry.title}</a></td>
</tr>
</table>
エントリー一覧画面
画面を見て頂くとわかるように，表示される内容が変更前と何も変わっていません。このままではエントリー一覧表示，エントリー編集フローへの遷移ともに確認することができません。また，現段階ではアプリケーションとデータベースが連携していないため，本物のレコードを使った確認を行うこともできません。では，どうすればこの状況を打開できるのでしょうか？
モックオブジェクトの作成－エントリー一覧フロー
このような場合は，本物のオブジェクトのメソッドやプロパティを模倣したオブジェクト，モックオブジェクトの出番です。今回必要なモックオブジェクトは，上記のHTMLテンプレートから割り出すことができます。まず，エントリー一覧は，entriesビューエレメントとして設定されている配列であることがわかります。次に，entries配列の要素は，HTMLテンプレート内で変数entryとして設定されているオブジェクトであることがわかります。このオブジェクトには少なくともidとtitleのふたつのプロパティが必要です。ここまでわかれば，あとは適当なタイミングでいくつかのオブジェクトを作成し，それらを配列に追加し，その配列をentriesという名称のビューエレメントとして設定するだけです。モックオブジェクトの作成及び設定のコードは下記のようになります。ビューエレメントの設定をアクティビティで行うため，フロー定義ファイルにも変更が必要なことに注意してください。
/path/to/pieceblog/web/webapp/config/flows/Entry/List.yaml
firstState: DisplayList
viewState:
- name: DisplayList
view: List
activity:
class: Entry_ListAction
method: doActivityOnDisplayList
/path/to/pieceblog/web/webapp/actions/Entry/ListAction.php
<?php
require_once 'Piece/Unity/Service/FlowAction.php';
require_once 'Piece/Unity/Service/FlexyElement.php';
class Entry_ListAction extends Piece_Unity_Service_FlowAction
{
var $_entries = array();
function Entry_ListAction()
{
$entry = &new stdClass();
$entry->id = 1;
$entry->title = 'Foo';
$this->_entries[] = &$entry;
$entry = &new stdClass();
$entry->id = 2;
$entry->title = 'Bar';
$this->_entries[] = &$entry;
$entry = &new stdClass();
$entry->id = 3;
$entry->title = 'Baz';
$this->_entries[] = &$entry;
}
function doActivityOnDisplayList()
{
$viewElement = &$this->_context->getViewElement();
$viewElement->setElementByRef('entries', $this->_entries);
}
}
?>
変更が完了したら，ブラウザから画面を確認しましょう。
エントリー一覧画面
今度は，きちんと一覧が表示されました。これで，エントリー一覧フローの画面設計は完了です。なお，このフローには検証すべき入力項目が存在しないため，バリデーション定義は必要ありません。
