TextAreaとScrollBarのコンポーネントについて

質問

ドキュメント内のボタンが始めは可動せず、そのドキュメント内にあるTextAreaが一番下まで来た時に初めてボタンが可動する仕組みを作りたいのですが、どなたか知恵をお貸しいただけないでしょうか？

イメージ的にはネットの同意書を一番下までスクロールしたら「同意する」ボタンが可動するようなものです。

詳しく説明させていただきます。

僕が出来たところは,TextAreaにUIscrollBarを組み合わせて、HTMLでそのTextAreaの中身の文章は作りました。そしてUIscrollBarで中身がスクロールする仕組みが出来たのですが、それとTextArea外のボタンの組み合わせがわかりません。つまり、

「TextArea内の文章が一番下までスクロールしたらTextArea外のボタンが可動する」仕組みが知りたいです！

どなたか僕に知恵を分けてください。

僕が使っているものは Macromedia　Flash8

回答No.2

DPE

テキストフィールドに画像を表示した時は、画像の位置もテキストと同様に行として管理されているようです。
テキストの行を何行か使って、文字の代わりに画像を表示しているようなもの、と言うと分かりやすいでしょうか。

従って、テキストフィールドで表示している行が変化した時に呼び出される TextField クラスの onScroller イベントは、テキストフィールド内に画像を表示している時でも有効です。

ステージにボタンシンボルのインスタンス” btn ”と、「ダイナミックテキスト」に設定したテキストフィールド” disp ”があるとします。
disp 内に画像とテキストを表示している状態で、scroll プロパティを監視し、末尾を表示している時にボタンを有効にするスクリプトは、大体、次のようになります。
このスクリプトはメインのタイムラインのフレームに設定してください。

（↓各行頭に全角のスペースが入っています。コピーする際はご注意ください）

　/////////////////////////////////////////////////////
　//テキストフィールドの初期設定
　/////////////////////////////////////////////////////

　//HTMLを有効・複数行・キーボードによる操作を不可にする
　disp.html = true;
　disp.multiline = true;
　disp.selectable = false;

　//ダミーのテキスト
　disp.htmlText += "***********************************<BR><BR>";
　disp.htmlText += "<P>猫が寝込んだ。<BR>";
　disp.htmlText += "犬が居ぬ。<BR>";
　disp.htmlText += "豚がぶたれた。<BR></P>";
　disp.htmlText += "<P><IMG src='○○○.jpg'></P>";
　disp.htmlText += "<P><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR></P>";
　disp.htmlText += "<P>隣の家に塀ができた？へぇ～。<BR>";
　disp.htmlText += "カッターが無かった。<BR>";
　disp.htmlText += "布団が吹っ飛んだ。<BR></P>";
　disp.htmlText += "<BR>***********************************";

　//表示されている行を監視
　disp.onScroller = function()
　{
　　//末尾を表示している時、ボタンを有効にする
　　if( disp.scroll >= disp.maxscroll )
　　{
　　　btn.enabled = true;
　　　btn._alpha = 100;
　　}
　　//それ以外は無効・薄表示にする
　　else
　　{
　　　btn.enabled = false;
　　　btn._alpha = 30;
　　}
　};

　/////////////////////////////////////////////////////
　//ボタンの初期設定
　/////////////////////////////////////////////////////

　//ボタンを無効にしておく
　btn.enabled = false;
　btn._alpha = 30;

　//ボタンが押された時の処理
　btn.onRelease = function()
　{
　　/*ここに、ボタンがクリックされた時の処理を書く*/
　};

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

「ダイナミックテキスト」のテキストフィールドは、フィールド内の文字を選択可能にするかどうかを設定できます。
「プロパティ」パネルで” Ab ”と書かれたボタン（単一行などを設定するリストの隣）を有効にするか、スクリプトで selectable というプロパティを true にすると選択可能になります。
選択が可能になっている時は、テキストフィールドの行をキーボードで送ることができます。

スクロールバーでスクロールするだけならあまり問題はないのですが、キーボードでスクロールさせると、スクロールバーが連動しなかったり scroll プロパティの変化が検出されるタイミングのズレなどの理由で、テキストの末尾に達したかどうかが正しく判定されないことがあります。

簡単な回避策は、キーボードによるテキストフィールドの操作を禁止し、スクロールバーでのみスクロールできるようにすることです。
上記のスクリプトではテキストフィールド内での選択を不可能にし、キーボードではスクロールできないようにしています。

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

スクロールバーのコンポーネントは、Flash 8 の２世代前にあたる Flash MX で初めて登場しました。
その次の世代である Flash MX 2004 ではなぜかスクロールバーのコンポーネントが廃止されてしまい、代わりに、スクロールバー付きのテキストフィールドともいえる TextArea コンポーネントが採用されました。

ところが、この TextArea コンポーネントは評判が良くなかったようで、MX 2004 の Ver 7.2 アップデートでは MX 時代にあったスクロールバーのコンポーネントが復活しました。
（正確には、MX と MX 2004 のスクロールバーコンポーネントは同じものではありません）

Flash 8 には MX 2004 Ver 7.2 と同様に、TextArea と UIScrollBar コンポーネントがあります。
しかし、TextArea コンポーネントは書式をいちいちスクリプトで定義しなければならないなどの点が面倒で使い辛く、テキストフィールド＋ UIScrollBar コンポーネントの方が融通が利くような気がします。

TextArea コンポーネントに onScroller イベントハンドラはありませんが、スクロールバーが操作された時に発生する” scroll ”というイベントが用意されています。
このイベントを利用してスクロールバーのスライダの位置を監視し、スライダが下端に来た時にボタンを有効にすることで、先述のスクリプトと同様のことができます。

なお、TextArea コンポーネントは自前でスクロールバーを備えているので、改めて UIScrollBar コンポーネントを付ける必要はありません。
デフォルトでは必要に応じて表示されるようになっています。

ステージに、ボタンシンボルのインスタンス” btn ”と TextArea コンポーネントのインスタンス” disp ”があるとします。
このスクリプトはメインのタイムラインのフレームに設定してください。

　/////////////////////////////////////////////////////
　//TextAreaの初期設定
　/////////////////////////////////////////////////////

　//ダミーのテキスト
　disp.text += "***********************************<BR><BR>";
　/*省略*/
　disp.text += "<BR>***********************************";

　//スクロールするたびに、表示されている行を監視
　area_listener = new Object();
　area_listener.scroll = function( info:Object )
　{
　　var text_obj;

　　//TextAreaインスタンスの参照を格納
　　text_obj = info.target;

　　//末尾を表示している時、ボタンを有効にする
　　if( text_obj.vPosition >= text_obj.maxVPosition )
　　{
　　　btn.enabled = true;
　　　btn._alpha = 100;
　　}
　　//それ以外は無効・薄表示にする
　　else
　　{
　　　btn.enabled = false;
　　　btn._alpha = 30;
　　}
　};

　//リスナーオブジェクトを登録
　disp.addEventListener( "scroll" , area_listener );

　/////////////////////////////////////////////////////
　//ボタンの初期設定
　/////////////////////////////////////////////////////

　/*ここに、ボタンを無効化する処理などを書く*/

ボタンの初期設定はテキストフィールドを使う場合と同じです。
先述のスクリプトと同じ処理を追加してください。

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

TextArea コンポーネントを使う場合は、”テキストの行”ではなく”スクロールバーのスライダの位置”を監視します。
スクリプトが実行されるタイミングも、”表示されている行が変わった時”ではなく”スクロールバーが操作された時”になります。

TextArea が持っているスクロールバーのスライダの位置は vScrollPosition プロパティに、このプロパティが取りうる最大値（スライダが下端にある時の位置情報）は maxVPosition プロパティに記録されています。
スクロールバーが操作された時にこの２つを見て、スライダが下端に来ている場合のみボタンを有効にします。
見るものが少々違いますが、テキストフィールドの scroll と maxscroll プロパティを見て判断するのと似たような発想です。

TextArea コンポーネントのコンポーネントパラメータ「 editable 」を false にすると、テキストを書き換えるなどの編集はできなくなりますが、キーボードでの選択やスクロール（行送り）だけは可能です。
これはこれで便利なこともあるのですが、TextArea コンポーネントでもスクロールバーとキーボードの操作が連動しないことがあるため、この仕様は少々厄介です。

また、scroll イベントはスクロールバーを操作した時にしか発生しませんので、キーボードでスクロールした時にはボタンを有効にするためのスクリプトが実行されません。
キーボードの操作に対応するには、Key クラスを使ってキー操作でのスクロールを検出するなどの工夫が必要になります。

妙な不具合やトラブルを極力避けたいのなら、TextArea より、テキストフィールド＋ UIScrollBar コンポーネントの方が無難だと思います。
ちなみに、スクロール対象が画像主体なら、スクロールバー付きの表示パネルである ScrollPane というコンポーネントもあります。

お礼

ＤＰＥ様へ

ありがとうございます！
「画面全体にスクロールバーをつけるやり方」についても重ね重ね感謝します。

言われたとおり自分の作ったスクリプトに教えていただいたスクリプトを組み合わせると自分が望んでいたＦｌａｓｈが現実化しました。

まだＦｌａｓｈを始めて間もないのですが、初心者でもわかり易かったです。ＤＰＥ様のご厚誼感謝致します。

ありがとうございました！

回答No.1

noname#35109

ぬぬうぅぅぅ？？？？

そのご質問に本当にそっくり（そくりではないかも…？）なご質問を見かけたことがあるのを鮮明に覚えています。

「スクロールバーが一番したまで来たときにボタンが表示される。」
http://oshiete1.goo.ne.jp/qa2369318.html
　↑教えて！goo　↓OKWave （同じです）
http://okwave.jp/qa2369318.html

私が回答して物ではありませんし，
内容自体は私もよく理解できておりません。
他の方の回答ですが，
よろしければ参考にしてみてください。

お礼

お答えありがとうございます。

僕も先日その例を参考にさせてもらい、そのやり方ではできたのですが、その例だとTextArea内に文字を書くことは出来るのですが僕が求めているのは、画像もTextAreaに含んだものを作るのを目標としています。
僕の説明不足でした（汗）

ちょっと質問とは違うんですが、画面全体にスクロールバーをつけるやり方はわかりますか？
ドキュメント自体にスクロールバーを作るやり方なんですが…
　それができれば問題が解決します!(^-^)♪