掲載誌情報
掲載誌 日経Linux　2003/02〜
タイトル リッチインターネットアプリケーションを開発しよう！　第５回
サブタイトル ColdFusion MXとFlash MXで作るリッチインターネットアプリケーションをMVCモデルで学ぶ

3-2-3. Controller
    次に、前項までで作成したView, Modelを制御するためのControllerとして、「Controller」クラスを作成する。
「Controller」クラスでは次の機能を実装する。
　・ 画面切り替え制御
　・ Viewのイベントコントロール
　・ Modelのイベントコントロール

「Controller」クラス / 「Controller.as」ファイル
/*
　CLASS Controller class / Controller
*/

//Constractor
Controller = function() {
　//初期処理
　this.timeStampModel = new TimeStampModel();
};		 (1)

//画面切替え
Controller.prototype.windowChange = function(winSymbolName) {
　removeMovieClip(this.currentView);
　this.currentView = attachMovie(winSymbolName, winSymbolName, 1);
　this.currentView._x = 300;
　this.currentView._y = 85;
};		 (2)

//View イベントコントロール
Controller.prototype.sendViewMessage = function(message) {
　switch(message){
　　　//タイムカード出退社画面表示
　case "WIN_TIME_STAMP":
　　this.windowChange("timeStampSymbol");
　　break;
　　//タイムカード 出社打刻
　case "TIMECARD_COMMING":
　　var ret = this.currentView.getValue();
　　this.timeStampModel.stamp("C", ret.userID, ret.password);
　　break;
　　//タイムカード 退社打刻
　case "TIMECARD_QUITTING":
　　var ret = this.currentView.getValue();
　　this.timeStampModel.stamp("Q", ret.userID, ret.password);
　　break;
　}
};		 (3)

//Model イベントコントロール
Controller.prototype.sendModelMessage = function(message, data) {
　switch(message){
　　　//タイムカード 打刻終了
　　case "STAMP_END":
　　　this.windowChange("timeMessageSymbol");
　　　this.currentView.dspMsg(data);
　　　break;
　}
};		 (4)

ここでのポイントは次のとおりだ。ポイントの番号は、プログラムコード中に示した番号を指す。
(1) クラスの定義
まず、TimeStampModeのクラス定義を行っている。
ここでは、初期処理として、3-2-2で作成したModel「TimeStampModel」をインスタンス化している。
(2) 画面切替えメソッド定義
3-1で解説した図3-1のコンテンツエリアに、所定の画面（タイムカード打刻画面、メッセージ表示画面）を表示するためのメソッド「windowChange」を定義する。
このメソッドは、パラメータとしてMovieClipの識別子（あらかじめ「シンボルのプロパティ」画面で設定しておいた、MovieClipに一意につける名前）を受け取り、該当するMovieClipを画面上に動的に配置する。
なお、MovieClipが画面に配置された時点で、MovieClipに関連付けられたクラス（3-2-1(4)参照）がインスタンス化されるので、そのインスタンスを変数「this.currentView」に格納しておく（後述のメソッド(3)、(4)で使用するため）。
なお、MovieClipを画面上に動的に配置するには、Flash MXで標準で用意されている「attachMovie」メソッドを使用する。
(3) View イベントコントロールメソッド定義
3-2-1で作成したView（「TimeStampView」、「TimeMessageView」）の制御を行うためのメソッド「sendViewMessage」を定義する。
このメソッドでは、各Viewからパラメータとして、イベントメッセージ（出社打刻、退社打刻などの処理を認識するため、任意に命名した文字列）を受け取り、イベントメッセージの種類に応じて、必要な制御を行う。このメソッドは、各Viewから必要に応じて呼び出される。
例えば、「TimeStampView」が管理するタイムカード打刻画面で、出社ボタンがクリックされると、当「Controller」クラスの「sendViewMessage」が「TimeStampView」から呼び出され、その際パラメータとして「TIMECARD_COMMING」を受け取る。「sendViewMessage」メソッドでは、「TIMECARD_COMMING」を認識し、出社打刻に必要な下記制御を行う。
a) 入力されたUserID, Password情報の取得
入力されたUserID, Password情報を取得するために、「TimeStampView」クラスの入力値取得メソッド「getValue」を呼び出す。
なお、「this.currentView」変数には現在表示中のViewのインスタンスが格納されているので、「this.currentView.getValue();」と記述することで、「TimeStampView」クラスの「getValue」メソッドを呼び出すことになる。
b) タイムカード打刻処理
タイムカード出社打刻処理を行うために、「TimeStampModel」クラスの出退社打刻メソッド「stamp」を呼び出している。
なお、「this.timeStampModel 」変数には初期処理で、「TimeStampModel」クラスのインスタンスが格納されているので、「this.timeStampModel.stamp("C", ret.userID, ret.password);」と記述することで、「TimeStampModel」クラスの「stamp」メソッドを呼び出すことになる。
(4) Model イベントコントロールメソッド定義
3-2-2で作成したModel（「TimeStampModel」）の制御を行うためのメソッド「sendModelMessage」を定義する。
このメソッドでは、各Modelからパラメータとして、(3)と同様、イベントメッセージを受け取り、イベントメッセージの種類に応じて、必要な制御を行う。このメソッドは、Modelから必要に応じて呼び出される。
例えば、「TimeStampModel」でColdFusionコンポーネントの通信結果を受信すると、当「Controller」クラスの「sendModelMessage」が「TimeStampModel」から呼び出され、その際パラメータとして「STAMP_END」を受け取る。「sendModelMessage」メソッドでは、「STAMP_END」を認識し、打刻終了時に必要な下記制御を行う。
a) メッセージ表示画面の表示
「windowChange」メソッドを呼び出すことで、メッセージ表示画面を表示している。
b) ) メッセージの表示
「TimeMessageView」クラスの「dspMsg」メソッドを呼び出すことで、メッセージ表示画面のメッセージ表示エリアへ指定した文字列を表示している。
  3-2-4. 初期処理
    最後に、今まで作成してきたクラスを、3-2-1で解説したFlash MX ファイル上で動作させるためのプログラムコードを記述する。
まず、次の図のように、タイムラインの1フレーム目に、プログラムコードを記述する。
（図3-5）

1フレーム目のプログラムコード
//Flash Remoting
#include "NetServices.as"
#include "NetDebug.as"		 (1)

//Controller
#include "Classes/Controller/Controller.as"

//View
#include "Classes/View/TimeStampView.as"
#include "Classes/View/TimeMessageView.as"

//Model
#include "Classes/Model/TimeStampModel.as";		 (2)

ここでのポイントは次のとおりだ。ポイントの番号は、プログラムコード中に示した番号を指す。
(1) FlashRemotingのライブラリのインクルード
サーバとの連携に必要となる、Flash MXに標準のActionScript ライブラリをインクルードする。
(2) 各クラスのインクルード
外部テキストファイルとして作成した、View, Model, Controllerの各クラスをインクルードする。
インクルードすることで、各クラスが使用可能となる。
外部ファイルとして、作成したクラスを使用するには、まず、このようにMovieClipを配置する前のフレームにて必要なファイルを全てインクルードしておく。

次に、先程と同様に、タイムラインの2フレーム目に、プログラムコードを記述する。
2フレーム目のプログラムコード
//アプリケーション初期処理
_global.Controller = new Controller(); (1)
_global.Controller.sendViewMessage("WIN_TIME_STAMP"); (2)
stop();

ここでのポイントは次のとおりだ。ポイントの番号は、プログラムコード中に示した番号を指す。
(1) Controllerクラスのインスタンス化
3-2-3で作成した「Controller」クラスをインスタンス化し、インスタンスを変数「_global.Controller」に格納している。変数名の前に「_global」をつけて宣言することで、Flash MX内のどこからでも参照可能な変数となる。
(2) タイムカード打刻画面表示
イベントメッセージ「WIN_TIME_STAMP」をパラメータに指定して、「Controller」クラスの「sendViewMessage」メソッドを呼び出すことで、タイムカード打刻画面を表示している。

後は、タイムカード打刻画面をユーザーが操作することで、必要に応じてView, Model, Controllerが動作し、タイムカード打刻機能が機能する。
以上で、タイムカード打刻機能の実装は完了だ。その他の機能についても、今まで解説してきた手法を応用することで容易に実装可能となる。
今回解説した、タイムカード打刻機能のサンプルを付録CD-ROMに収めているので、そちらも参照していただきたい。

BACK １・２・３  
PAGETOP
CLOSE