プログラミング工房
TOP
Flex基本
開発環境 JavaScript連携 PHP連携1 PHP連携2(AMFPHP) ウィンドウ ボタンスキン 矩形スキン ローカルファイル(テキスト) F5等の対策 ローカルファイル(イメージ) ダウンロード、アップロード 1枚の画像のカラーを変更 時間のかかる計算処理 外部SWFの読込み
Flexで3D
Flexだけで3D Papervision3Dを使ってみる 3Dオブジェクト カメラ、前後判定の工夫しました 自由な形状を作成
Flexでクラス
Class1(白黒ゲームの盤) Class2(白黒ゲームのプレイヤー) Class3(プレイヤーを外部SWF)
PHP
共通関数1
Flexの作品
お問合せの説明 サンプルのソース表示の説明 分子構造の表示(PDBファイル) マンデルブロ集合の画像作成 swf参加型白黒ゲーム(Reversi) ストップウォッチ WEB素材
AIR
AIRを使ってみる ソースファイルのHTML変換を作る
etc.
マンデルブロ集合のギャラリー ジュリア集合のギャラリー wonderflを使ってみました お問合せ

Flex4基本-ウィンドウ

■2011.02.21:作成
サンプル サンプルのソース

ウィンドウ-TitleWindow

FLEXではTitleWindowを使用すればウィンドウを開く事が出来ます。
http://help.adobe.com/ja_JP/AS3LCR/Flex_4.0/spark/components/TitleWindow.html
にサンプルがあります。

今回は少し違った方法でTitleWindowを利用します。理由は前回の表示位置にウィンドウを
開きたいからです。

親側のプログラム

一番最初に"private var wSub:winSub=new winSub();"でウィンドウの実体を非表示で作成
 ウィンドウの実体を削除しないので閉じる(非表示)ても表示位置を保持できます。
ウィンドウを表示するときはウィンドウの関数をコールします。以下のパラメータを渡します。
 ・親のアドレス(this)
 ・ウィンドウで表示するデータ(txtPar1.text, txtPar2.text)
 ・親とのインタフェース用関数(fncOkFnc,fncCanFnc,fncCloFnc)
ウィンドウのOKボタンの処理
 OKボタンを押したときのサーバの実行結果等で閉じる/閉じないの判断を行いたいので
 親側からのウィンドウを閉じるインターフェースをもちます。
import mx.controls.Alert;

//ウィンドウ
private var wSub:winSub=new winSub();

//ウィンドウを開く
private function onOpen():void {
    wSub.showModal(this, txtPar1.text, txtPar2.text,
        fncOkFnc,fncCanFnc,fncCloFnc);
}

//ウィンドウでOKが押されたとき
private function fncOkFnc(prm1:String,prm2:String):void {
    txtData.text = "ウィンドウで\n(" + prm1 + "," + 
            prm2 + ")\nの入力がありました。";
    //今回はOKの時親側で閉じるを判断する
    if (chkClose.selected == true) {
        wSub.close();
    }
}

//ウィンドウでキャンセルが押されたとき
private function fncCanFnc():void {
    txtData.text = "キャンセルしました。";
}

//ウィンドウでclose(右上×ボタン)が押されたとき
private function fncCloFnc():void {
    txtData.text = "クローズしました。";
}

ウィンドウ側のプログラム

ウィンドウ用のwinSub.mxmlを作成します。
 Main.mxmlと同じように作成しますが"s:Application"を"s:TitleWindow"にします。
イベント関数を定義しておきます。
 creationComplete="onComp()":初期化(非表示で描画が完了した時)
 move="onMove()":ウィンドウが移動したとき
 close="onClose()":close(右上×ボタン)
<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               title="winSub"
               creationComplete="onComp()"
               move="onMove()"
               close="onClose()">
          :
          :    
</s:TitleWindow>

親から引き渡された関数用の変数とウィンドウは表示が1回目かのフラグを持ちます。
import mx.managers.PopUpManager;

//親から引き渡された関数
private var fncOK:Function;     //OK
private var fncCan:Function;    //キャンセル
private var fncClo:Function;    //close(右上×ボタン)

//ウィンドウは表示されたことがあるか?
private var bolDispFlg:Boolean = false;

初期化関数(今回は処理なし)
 ウィンドウが表示される毎のコールされる関数ではない。
//初期化(非表示で描画が完了した時)
private function onComp():void {
    //処理なし
}

ウィンドウを開く(表示する)関数
"PopUpManager.addPopUp(this, doParent, true);"でウィンドウを開いています。

ウィンドウの表示位置は
 "PopUpManager.centerPopUp(this);"で中央表示になります。(1回目は中央表示)
 何もしなければ前回と同じ位置になります。
 固定の位置に出したいのなら
   this.x=100;
   this.y=100;

"txtPar1.setFocus();"に関して、フォーカスをウィンドウ側に指定しないと親側にフォーカスが
残ってしまいます。問題が起きそうなのでフォーカスをウィンドウ側に指定しています。
("this.setFocus();"でもOK)
//ウィンドウを開く
// doParent:親のアドレス
// parm1,parm2:表示パラメータ
// fncOkFnc:親側のOK処理関数
// fncCanFnc:親側のキャンセル処理関数
// fncCloFnc:親側のclose(右上×ボタン)処理関数
public function showModal(doParent:DisplayObject,
        parm1:String, parm2:String,
        fncOkFnc:Function, fncCanFnc:Function, fncCloFnc:Function):void {
    //ウィンドウを開く(表示する)
    PopUpManager.addPopUp(this, doParent, true);
    //ウィンドウの位置:最初の1回は中央
    if (bolDispFlg == false) { PopUpManager.centerPopUp(this); }
    bolDispFlg = true;
    //フォーカスのセット(この処理を行わないと親にフォーカスが残る)
    txtPar1.setFocus();
    //親の関数を関数変数にセット
    fncOK = fncOkFnc;
    fncCan = fncCanFnc;
    fncClo = fncCloFnc;
    //表示パラメータのセット
    txtPar1.text = parm1;
    txtPar2.text = parm2;
}

親側からのウィンドウを閉じるインターフェース
 サーバの実行結果等で閉じる/閉じないの判断を行うため
//親から閉じるを行うための関数
public function close():void {
    PopUpManager.removePopUp(this);
}

OK、Cancel、close(右上×ボタン)の処理
 ・showModalで指定した親の関数の実行
 ・ウィンドウを閉じる(この例ではOKの時は閉じる処理は親側で判断しています)
//OKボタンの処理
private function onOK():void {
    //親側のOKボタンの処理
    fncOK(txtPar1.text, txtPar2.text);
    //今回はウィンドウを閉じるは親に任せる。
    //PopUpManager.removePopUp(this);
}

//Cancel処理:ウィンドウを閉じる。
private function onCancel():void {
    fncCan(); //親の関数
    PopUpManager.removePopUp(this);
}

//close(右上×ボタン)処理:ウィンドウを閉じる。
private function onClose():void {
    fncClo(); //親の関数
    // モーダルフォーム(自分自身)を閉じる...
    PopUpManager.removePopUp(this);                             
}

ウィンドウがFLEX領域の外部に出てしまうことの対応

ウィンドウを表示中にFLEX領域の外部に出てしまうとその後の操作が出来なくなります。
winSub.mxmlのmove="onMove()"(ウィンドウが移動したとき)の関数でウィンドウを
領域外に出ない様にできます。
xとyの判定の順番が逆になっているのはFLEX領域が小さいとき右上×ボタンが必ず領域外に
出ない為の対応です。
//ウィンドウが移動した時の処理
private function onMove():void {
    //ウィンドウが必ず表示するようにする。
    if (this.x < 0) {this.x = 0;}
    if (this.x > this.parentApplication.width - this.width) {
            this.x = this.parentApplication.width - this.width;
    }
    if (this.y > this.parentApplication.height - this.height) {
        this.y = this.parentApplication.height - this.height;
    }
    if (this.y < 0) {this.y = 0;}
}

プログラミング工房