Categories: ActionScript3.0

[AS3.0]CS4 Flash上でFlexのAlertポップアップを実現する

Flashの環境上にはAlertがない。
FlexではAlert.show(“message”);とかで簡単にできちゃうけど、Flashではそれができないのだ。
そこでなんとか方法はないかと探ったら方法と、また、問題点があったのでめもっとく。


[方法]Examples: AlertManager for Flash CS3から適当にどれかFLAファイルひろってくる。
そのあと、FLAファイルにあるAlertManagerと、コンポーネントのButtonを自分とこのライブラリにコピー
次に

import com.yahoo.astra.fl.managers.AlertManager;
import fl.data.DataProvider;
import fl.events.ComponentEvent;

を、importして、

AlertManager.createAlert(this, “This is an alert box.”);

を実行するだけ。
[問題点]
ASファイルを別に作り、ドキュメントクラスで書いてるとうまく動かない
[解決方法]
AlertManager.createAlert(this, “This is an alert box.”);
のthisの部分をrootに変える。
[詳細]
参考サイト
ASTRA AlertManager
FlashでのAlertポップアップの答えがここにあった！
サンプルをみると、、、
おー！
FlexのAlertのようだ！
Using AlertManagerをみてみると、
1.importと初期設定

import com.yahoo.astra.fl.managers.AlertManager;
import fl.data.DataProvider;
import fl.events.ComponentEvent;
stage.align = StageAlign.TOP_LEFT;

をやってくれとのこと。
しかし、ここで問題。
私の環境ではstage.align = StageAlign.TOP_LEFT;をやってもえらーになってしまった。
しかたないのでここははずしたが・・・
あれ、、はずしてもうごいてるじゃんｗ
ということで、なくてもよくわからんけど動きます。
2.Alertの表示
以下を書き込むだけでアラートができる。

AlertManager.createAlert(this, “表示したいメッセージ”);

なんと簡単なんだ！！
3.引数の設定
もっと詳細に設定したい場合はこちら。

AlertManager.createAlert(this, “表示したいメッセージ”, “アラートタイトル”, buttons, alertClickHandler, iconClass, true);

・1個目の引数
みたまんまthisをいれている。
だがしかし、これがトラップをもっている。
ASファイルを別につくりドキュメントクラスとして書いて、thisで実行するとこんなエラーがでた。

TypeError: Error #1034: 強制型変換に失敗しました。global@31f3f0f9 を flash.display.DisplayObject に変換できません。
at MethodInfo-136()

そのため、代わりにrootをいれてあげたらできた。
・2個目の引数
メッセージ本文です。
String型でいれてあげましょう。
・3個目の引数
メッセージのタイトルです。
これもString。
・4個目の引数
ボタンの設定です。
Arrayをいれます。
Arrayの個数によってボタンが増えていきます。
たとえば

var buttons:Array = new Array( “button1”, “button2” );

と、宣言しこのbuttonsを引数に指定すれば、
button1とbutton2のボタンが生成されます。
・5個目の引数
ボタンが押されたときに呼び出されるイベントハンドラです。
適当に関数を指定しときましょう
・6個目の引数
iconClassってことだが、これは表示するポップアップを

“” (普通のアラート)
“dialogIcon”
“warningIcon”
“confirmationIcon”

4つ選択できる。
すきなものをString型でいれてあげてください。
・7個目の引数
よくわからん。
とりあえずtrue。
falseにするとなんかエラーでるのでとりあえずtrueにしとけばいいかと。
とりあえずASファイルの記述はこんなかんじ。

package
{
import flash.display.*;
import flash.events.*;
import com.yahoo.astra.fl.managers.AlertManager;
import fl.data.DataProvider;
public class test extends Sprite {
public function test() {
//add event listener to the button
showAlertButton.addEventListener(MouseEvent.CLICK, ShowAlerts);
//event handler to trigger the alert
function ShowAlerts(evnt:MouseEvent):void
{
var buttons:Array = new Array( "button1", "button2" );
AlertManager.createAlert(root, "this is Alert Message\n are you ok?", "Title", buttons, _clickAlert, "", true );
}
function _clickAlert ()
{
showAlertButton.label = "ok";
}
}
}
}

サンプルとソースはこちら
アラートサンプル
ソース
11/20追記
ライブラリに追加する際に、AlertManagerだけでなく、コンポーネントからButtonも追加しないといけないようなので注意です。
これがないとエラーでて、大変だったので注意。
アラートボックス

mogmet

View Comments

  • new Array( "button1", "button2" );
    ２つのボタンのうちどちらがクリックされたかをイベントハンドラ内で判別したいのですが可能でしょうか？

  • ＞UKONNさん
    こんにちは。
    どちらかクリックされて判定は、少々スマートなやり方ではない気がしますが、私は event.target.nameの値をみて判別しました。
    以下のサンプルを参考にソースを弄ってみたので確認してみてください。
    http://developer.yahoo.com/flash/astra-flash/alertmanager/examples/CustomizedAlert.html
    //import necessary classes
    import com.yahoo.astra.fl.managers.AlertManager;
    import fl.data.DataProvider;
    import fl.events.ComponentEvent;
    //align the stage
    stage.align = StageAlign.TOP_LEFT;
    //create variable for the icon class
    var iconClass:String;
    //style showAlertButton and add listener to its click event
    showAlertButton.label = "Show Alert";
    showAlertButton.addEventListener(MouseEvent.CLICK, ShowAlerts);
    //event handler function for the showAlertButton
    //creates an alert based on the form field values
    function ShowAlerts(event:MouseEvent):void
    {
    var buttonString = buttonNames.text;
    if(buttonString.lastIndexOf(",") == buttonString.length-1) buttonString = buttonString.substr(0, buttonString.length-1);;
    // オリジナルソースでは「,」をいれることによってボタン化してますが、
    // 今回はボタンにする必要があるので、buttonsにarrayをいれておきます。
    //var buttons:Array = buttonString.split(",");
    var buttons:Array = new Array( "button1", "button2" );
    AlertManager.createAlert(this, alertText.text, titleText.text, buttons, displaySelectedButtonText, iconClass, true);
    }
    //create an array of classes for the iconSelector dropdown
    //set its width and data provider
    //add listener to its change event
    var iconClasses:Array = [
    {label:"none", data:""},
    {label:"dialogIcon", data:"dialogIcon"},
    {label:"warningIcon", data:"warningIcon"},
    {label:"confirmationIcon", data:"confirmationIcon"}
    ];
    iconSelector.width = 300;
    iconSelector.dataProvider = new DataProvider(iconClasses);
    iconSelector.addEventListener(Event.CHANGE, iconSelectorHandler);
    //event handler for the iconSelecter changes the ionClass value
    function iconSelectorHandler(event:Event):void
    {
    iconClass = event.target.selectedItem.data;
    }
    //event handler for the alert
    //displays the label of the button that the user clicks in the output text field
    function displaySelectedButtonText(event:Event):void
    {
    // event.target.nameの値をみてどのボタンがおされたかを判別します
    if ( event.target.name == "button1" ) {
    outputText.text = 'you selected button one';
    } else if (event.target.name == "button2") {
    outputText.text = "this is ... button two";
    }
    }

  • ありがとうございます。
    event.target.nameｃで充分だと思います。気がつきませんでした。
    そうですね、そうすればいいんですね。判別できなければアラートの意味がなくなりますもんね！
    ありがとうございました。

Leave a Comment
Share
Published by
mogmet
15年 ago

Recent Posts

ゲームビジネス カンファレンス 2023のまとめ

こんにちは。virapture…

6か月 ago

大手3社のiOSエンジニアが集った「WWDC23 報告会 at LINE, ZOZO, ヤフー」のまとめ #WWDC_lzy

こんにちは。virapture…

10か月 ago

2022年もぐめっとの活動をプライベートごと振り返る

こんにちは。virapture…

1年 ago

#love_swift WWDC22セッション情報を共有し合う「集まれSwift好き！Swift愛好会スピンオフ WWDC21セッション要約会 @オンライン」のまとめ

こんにちは。virapture…

2年 ago

フードコートから券売機が無くなる日が近づくアプリの体験がよかった話

こんにちは。virapture…

2年 ago

2022年をより幸せに生きるために2021年を振り返る

こんにちは。もぐめっとです。 …

2年 ago