２つのプルダウンメニューを使用したフレームラベルへの移動

質問

はじめまして。
お世話になります。

Flashムービー内で
２つのプルダウンメニューを組み合わせた
フレーム移動をさせたいのですが方法がわかりません。

例えば、
１つ目のプルダウン（「A」～「D」までアルファベット順のメニュー）で「A」を選択し、
２つ目のプルダウン（「1」～「9」までの数字順のメニュー）で「1」を選択したら、「A1」というフレームラベルへジャンプするという仕組みを実装したいのですが、方法が分かりません。

プルダウンメニューが一つの場合だと任意のフレームラベルへジャンプさせるという方法は分かるのですが、２つを連動させるというのが、どうしても分かりません。

お教えいただけると大変助かります。
よろしくお願いいたします。

回答No.2

DPE

＃１です。
ActionScript 3.0 は詳しくないので、ActionScript 2.0 の ComboBox コンポーネントを使用した作例でよろしければ、ご参考までに。

例題として、次のような構成・仕様の作品を考えます。

　・フレーム１：各種初期設定を行うフレーム。
　・フレーム２：最初に表示するトップページ。
　・フレーム３以降：
　　　２つのコンボボックスの選択に応じて表示される。
　　　フレームラベルは a1 ～ c3 （ a ～ c ＋各 1 ～ 3 の番号で、計９フレーム）。

　・コンボボックスは常に表示されていて、どのフレームからでも操作できる。
　・どちらかのコンボボックスで何か選択されたら、その時に対応するフレームに移動する。
　　（例えば、” a ”と” 1 ”が選ばれている状態で” b ”を選ぶと、その時に” b1 ”のフレームに移動する仕様です）

制作中の作品にいきなり組み込むのも難しいかと思います。
「新規作成」で次のようなムービーを作成して検証してみてください。
パブリッシュの設定は、Flash Player 7 以降、ActionScript 2.0 です。

レイヤーを３つ、作成します。

　●レイヤー１：スクリプトとフレームラベルのレイヤー
　　　空白のキーフレームを 11 個、作成します。
　　　フレーム２に” top_page ”、フレーム３以降は a1 ・ a2 ・ a3 ・ b1 ・・・ c3 という命名規則で
　　　フレームラベルを付けてください。
　　　フレーム１には後述のスクリプトを書きます。

　●レイヤー２：コンボボックスのレイヤー
　　　フレーム１に ComboBox コンポーネントのインスタンスを２つ配置し、それぞれにインスタンス名を付けます。
　　　ここでは仮に、アルファベットを選ぶコンボボックスに” category ”、数字を選ぶ方に” num ”と付けたとします。
　　　フレーム 11 にフレームを挿入し、フレーム１と同じ内容をフレーム 11 まで繰り返すようにします。

　●レイヤー３：コンテンツのレイヤー
　　　フレーム１は空白にします。
　　　フレーム２以降は、フレームを移動したことが分かるように何か絵や字を描いてください。
　　　TOP や a1 など、フレームラベルと同様のテキストを書いておくと分かりやすいと思います。

以上で準備は完了です。
次はスクリプトを書きます。

**************************************

２つのコンボボックスの選択結果を合わせて、対応するフレームラベルのフレームに移動するスクリプトは、次のようになります。
このスクリプトは、レイヤー１のフレーム１に記述してください。

（↓各行頭に全角のスペースが入っています。コピーする際は、全て半角のスペースかタブに置き換えてください。このまま使うとシンタックスエラーになります）

　//////////////////////////////////////////////////////////
　//初期設定
　//////////////////////////////////////////////////////////

　//移動先のフレームラベルを作成するための作業用の配列変数
　//コンボボックスの選択に応じて、
　//[0]にカテゴリー名（a～c）、[1]に番号（1～3）が入る
　//初期値として”a1”を設定しておく
　label_temp = new Array();
　label_temp = [ "a" , "1" ];

　//////////////////////////////////////////////////////////
　//カテゴリーのコンボボックスのセットアップ
　//////////////////////////////////////////////////////////

　//表示するデータの準備
　category_data = new Array();
　category_data =
　[
　　{ label : "Ａ" , data : "a" } ,
　　{ label : "Ｂ" , data : "b" } ,
　　{ label : "Ｃ" , data : "c" }
　];

　//コンボボックスに表示
　category.dataProvider = category_data;

　//最初に選択されているものを”なし”にする
　category.selectedIndex = undefined;

　//何かが選択された時のイベント処理
　obj_c = new Object();
　obj_c.change = function( info:Object ):Void
　{
　　var category_name:String;

　　//選択されている項目に設定されている隠しデータの値を取得
　　category_name = info.target.selectedItem.data;

　　//取得した値を、作業用配列変数の[0]に記録
　　label_temp[ 0 ] = category_name;

　　//作業用配列変数の[0]と[1]を連結して指定のフレームに移動
　　gotoAndStop( label_temp.join( "" ) );
　};

　//リスナーオブジェクトを登録
　category.addEventListener( "change" , obj_c );

　//////////////////////////////////////////////////////////
　//番号のコンボボックスのセットアップ
　//////////////////////////////////////////////////////////

　//表示するデータの準備
　num_data = new Array();
　num_data =
　[
　　{ label : "壱" , data : "1" } ,
　　{ label : "弐" , data : "2" } ,
　　{ label : "参" , data : "3" }
　];

　//コンボボックスに表示
　num.dataProvider = num_data;

　//最初に選択されているものを”なし”にする
　num.selectedIndex = undefined;

　//何かが選択された時のイベント処理
　obj_n = new Object();
　obj_n.change = function( info:Object ):Void
　{
　　var jump_no:String;

　　//選択されている項目に設定されている隠しデータの値を取得
　　jump_no = info.target.selectedItem.data;

　　//取得した値を、作業用配列変数の[1]に記録
　　label_temp[ 1 ] = jump_no;

　　//作業用配列変数の[0]と[1]を連結して指定のフレームに移動
　　gotoAndStop( label_temp.join( "" ) );
　};

　//リスナーオブジェクトを登録
　num.addEventListener( "change" , obj_n );

　//////////////////////////////////////////////////////////
　//最初のページに移動
　//////////////////////////////////////////////////////////

　gotoAndStop( "top_page" );

/**********************************************************/

「ムービープレビュー」で動作を確認してみてください。
問題がなければ、２つのコンボボックスにそれぞれ、”Ａ”と”壱”という項目が表示されている状態になります。

コンボボックスらしきものは表示されているが、中身がなく真っ白になっている場合は、ComboBox コンポーネントのインスタンス名をご確認ください。
アルファベットを選ぶコンボボックスのインスタンス名は” category ”、数字を選ぶ方は” num ”です。大文字と小文字・全角と半角の誤り、不要なスペースや文字の混入などにもご注意ください。

最初は、フレーム２（フレームラベル” top_page ”）のトップページが表示されます。
どちらかのコンボボックスを操作すると、２つのコンボボックスの選択に応じたフレームに移動します。
例えば、アルファベットのコンボボックスで”Ｃ”、数字のコンボボックスで”弐”を選ぶと、” c2 ”のフレームに移動します。
この状態でアルファベットのコンボボックスで”Ａ”を選ぶと、数字と合わせて” a2 ”のフレームに移動します。

この作例では省略していますが、よろしければ、トップページに戻るボタンを追加して、トップページである”top_page”のフレーム（フレーム２）に戻れるように改良してみてください。
初期化を実行しているフレーム１に戻らないため、前に選択したコンボボックスの状態はそのまま維持されます。

**************************************

紙面の都合上、スクリプトや ComboBox コンポーネントの使い方を１つ１つ説明できません。
スクリプトの詳細はコメントをご参考になさってください。

基本的な考え方は＃１で説明しました通りです。
まず、作業用の配列変数として” label_temp ”という配列変数を用意します。
アルファベットのコンボボックスで選択された情報を label_temp[ 0 ] に、数字のコンボボックスで選択された情報を label_temp[ 1 ] に入れます。
ここでいう情報とは、画面に表示されない隠しデータのことです。つまり、アルファベットのコンボボックスでは a ～ c 、数字のコンボボックスでは 1 ～ 3 のいずれかになります。
最終的にはこの２つを label_temp.join( "" ); でつなぎ合わせて、移動先になるフレームラベルを作成します。

コンボボックスで選択した通りに移動しない・特定のフレームにだけ移動できない場合は、フレームラベルに誤りがないかどうかを確認してみてください。
コンボボックスにより移動するフレームには、小文字の a ・ b ・ c に 1 ～ 3 の数字（いずれも半角）を組み合わせたフレームラベルを付けます。

------------------------------------------------------------

ComboBox コンポーネントは、ムービーに簡単にドロップダウン式のメニューを組み込めるようにと提供されている、既製の部品のようなものです。
メニューに何を表示して、どの項目が選ばれた時に何をするかは作品によって違うのが当たり前ですから、この部分はムービーの作者に作成させる設計になっています。
その手助けのために、メニューに表示する内容を設定したり、現在選ばれている項目の情報を取得する手段などが、コンポーネントの機能として提供されています。
これらのものを利用して目指す通りの動作を実現させるところが、腕の見せ所です。

ComboBox コンポーネントの基本的な使い方・説明は割愛させていただきました。
コンポーネントには様々な制御・設定方法が用意されています。今回使った方法や、解説サイト・解説書で説明されている方法だけが唯一の正解というわけではありません。
いろいろ試して、ComboBox コンポーネントの特性や扱い方を研究してみてください。

作品の完成に向けて何か参考になるところがあれば、幸いです。
長くなってすみませんでした。

回答No.1

DPE

お使いの Flash のバージョンや、メニューの作り方・フレームを移動するタイミングなどの詳細が不明なので、具体的な作例はご紹介できないのですが、考え方だけ。
配列変数を使って、次のように考えてはいかがでしょう。

アルファベットを選択するメニューの各項目に、表示されない隠しデータとして A ～ D のアルファベットを１つずつ設定します。
同様に数字を選択するメニューの各項目には、1 ～ 9 の数字を１つずつ、表示されないデータとして設定しておきます。

配列変数を１つ、用意します。
アルファベットのメニューで選択された項目のデータを配列変数の [ 0 ] に、数字のメニューから選択された項目のデータを [ 1 ] に格納するようにします。
例えば、仮にこの配列変数が” label_temp ”という名前で、アルファベットのリストで” B ”、数字のリストで” 3 ”が選ばれたとしますと、配列変数 label_temp の中身は

　label_temp[ 0 ] → "B"
　label_temp[ 1 ] → "3"

このようになります。

配列変数を管理している Array クラス（ Flash MX 以前はオブジェクト）には、配列変数に含まれる変数の内容をつなぎ合わせて１つの文字列にする” join ”というメソッドがあります。
これを利用して、先の label_temp[ 0 ] と label_temp[ 1 ] を label_temp.join( "" ); で連結すると、”B3”という文字列になり、フレームラベルとして利用できます。

それぞれのリストで選ばれた値を、アルファベットは [ 0 ] 、数字は [ 1 ] というように、特定のインデックスに格納するところがポイントです。
格納するインデックスを固定しておけば、２つのリストからどのような組み合わせで選択されても、最終的には、必ず「アルファベット＋数字」という文字列を取得することができます。

***************************************

Flash MX 2004 以降の Flash に付属の ComboBox コンポーネントをお使いでしたら、各インスタンスで change イベントを利用して、どちらかのリストから選択するたびに即座にフレームを移動することもできます。
ただし、change イベントはその名の通り、”今、選択されている項目とは違うものが選ばれた時”に発生するイベントです。
ComboBox コンポーネントは、スクリプトでは最初の項目（ 0 番目）がデフォルトで選ばれていることになっているので、初期値の設定にご注意ください。

移動ボタン（ Go ボタンのようなもの）が押された時にリストで指定したフレームラベルに移動するような作品でも、利用するイベントが違うだけで考え方は同じです。
ComboBox のイベント発生時には選択された項目から値を取得して配列変数に入れる処理だけ行い、ボタン側のイベントで配列変数を連結して移動先のフレームラベルを作成し、フレームを移動するようなスクリプトになるかと思います。

お礼

大変ご丁寧な回答ありがとうございます。
心から感謝いたします。

補足

DPE 様

大変ご丁寧な回答ありがとうございます。
心から感謝いたします。

一つ一つを理解しながら進めていきたいと思います。
今の私ではご回答内容がまだまだ理解できません
（お恥ずかしいです…）

使用環境を書き忘れておりましてすみません。

◆Flash CS3
◆WindowsXP pro sp2

使用するタイミングは、静止した同一のタイムライン上で
普通にジャンプさせるという具合です。
HTMLページのプルダウンメニューと同じ操作感覚です。

Flashを勉強し始めたばかりでつまずくことが多いですが
勉強して、少しずつ理解していこうと思います。

失礼致します。