UIScrollBar コンポーネントの使用

UIScrollBar コンポーネントを使用すると、スクロールバーをテキストフィールドに追加できます。テキストフィールドのスクロールバーは、オーサリング時に追加することも、ActionScript を使用して実行時に追加することもできます。 UIScrollBar コンポーネントを使用するには、テキストフィールドをステージ上に作成し、UIScrollBar コンポーネントをコンポーネントパネルからテキストフィールドの境界ボックス上の任意の辺にドラッグします。

スクロールバーの長さが、両端の矢印ボタンの合計サイズより小さい場合は、正しく表示されません。 矢印ボタンの一方が、もう一方の下に隠れます。 Flash では、これに関するエラーチェックは実行されません。 そのような場合は、ActionScript を使用してスクロールバーを非表示にすることをお勧めします。 スクロールバーのサイズがスクロールボックス (サム) を表示できないほど小さい場合、Flash ではスクロールボックスが非表示になります。

UIScrollBar コンポーネントは、他のスクロールバーと同じように機能します。 両端に矢印ボタンがあり、その間にスクロールトラックとスクロールボックス (サム) があります。 UIScrollBar コンポーネントは、テキストフィールドの任意の端に追加でき、垂直にも水平にも使用できます。

TextField については、「Adobe Flash Professional CS5 用 ActionScript 3.0 リファレンスガイド」の TextField クラスを参照してください。

UIScrollBar コンポーネントのユーザー操作

他の多くのコンポーネントとは異なり、UIScrollBar コンポーネントでは、連続的なマウス入力を受け付けます。例えば、クリックを繰り返すのではなくマウスボタンを押したままでの操作ができます。

UIScrollBar コンポーネントは、キーボードで操作することはできません。

UIScrollBar コンポーネントのパラメーター

プロパティインスペクターまたはコンポーネントインスペクターで UIScrollBar コンポーネントの各インスタンスに設定できるオーサリングパラメーターは、direction および scrollTargetName です。これらの各パラメーターには、対応する同名の ActionScript プロパティがあります。

ActionScript を記述すれば、UIScrollBar コンポーネントのメソッド、プロパティ、イベントを使用して、UIScrollBar インスタンスのその他のオプションを設定できます。 詳しくは、「Adobe Flash Professional CS5 用 ActionScript 3.0 リファレンスガイド」の UIScrollBar クラスを参照してください。

UIScrollBar コンポーネントを使用したアプリケーションの作成

次の手順は、オーサリング時に UIScrollBar コンポーネントをアプリケーションに追加する方法を示しています。

  1. 新しい Flash (ActionScript 3.0) ドキュメントを作成します。

  2. 1 行または 2 行のテキストを格納するのに十分な高さを持つダイナミックテキストフィールドを作成し、プロパティインスペクターでインスタンス名を myText にします。

  3. プロパティインスペクターで、テキスト入力フィールドの「行タイプ」を「複数行」に設定します。または、スクロールバーを水平方向で使用する場合は、「折り返しなし」に設定します。

  4. アクションパネルを開いて、メインタイムライン内でフレーム 1 を選択し、次の ActionScript コードを入力します。このコードで、ユーザーがテキストをすべて表示するにはスクロールが必要となるように、text プロパティが設定されます。

    myText.text="When the moon is in the seventh house and Jupiter aligns with Mars, then peace will guide the planet and love will rule the stars."
    注意: スクロールしないとすべてのテキストを表示できないように、ステージ上のテキストフィールドは小さくしておいてください。 そうしないと、スクロールバーが表示されないか、2 行だけ表示されてサムグリップ(コンテンツをスクロールする際にドラッグする部分)が表示されません。
  5. オブジェクトの吸着がオンになっていることを確認します (表示/吸着/オブジェクトの吸着)。

  6. テキスト入力フィールド上の、UIScrollBar インスタンスを追加する端の付近に、コンポーネントパネルから UIScrollBar インスタンスをドラッグします。 コンポーネントをテキストフィールドに適切にバインドするためには、マウスを離すとき、コンポーネントがテキストフィールドに重なっている必要があります。 インスタンス名を mySb にします。

    コンポーネントの scrollTargetName プロパティには、プロパティインスペクターおよびコンポーネントインスペクターでのテキストフィールドのインスタンス名が自動的に反映されます。「パラメーター」タブに表示されない場合は、UIScrollBar インスタンスの重なりが十分でない可能性があります。

  7. 制御/ムービープレビューを選択します。

ActionScript を使用した UIScrollBar コンポーネントインスタンスの作成

ActionScript を使用して、実行時に UIScrollBar インスタンスを作成し、テキストフィールドに関連付けることができます。次の例では、水平方向の UIScrollBar インスタンスを作成し、myTxt という名前のテキストフィールドインスタンスの下部に割り当てます。このフィールドには、特定の URL からテキストがロードされます。また、テキストフィールドのサイズに一致するように、スクロールバーのサイズを設定します。

  1. 新しい Flash (ActionScript 3.0) ドキュメントを作成します。

  2. ScrollBar コンポーネントをライブラリパネルにドラッグします。

  3. アクションパネルを開いて、メインタイムライン内でフレーム 1 を選択し、次の ActionScript コードを入力します。

    import flash.net.URLLoader; 
    import fl.controls.UIScrollBar; 
    import flash.events.Event; 
     
    var myTxt:TextField = new TextField(); 
    myTxt.border = true; 
    myTxt.width = 200; 
    myTxt.height = 16; 
    myTxt.x = 200; 
    myTxt.y = 150; 
     
    var mySb:UIScrollBar = new UIScrollBar(); 
    mySb.direction = "horizontal"; 
    // Size it to match the text field. 
    mySb.setSize(myTxt.width, myTxt.height);  
     
    // Move it immediately below the text field. 
    mySb.move(myTxt.x, myTxt.height + myTxt.y); 
     
    // put them on the Stage 
    addChild(myTxt); 
    addChild(mySb); 
    // load text 
    var loader:URLLoader = new URLLoader(); 
    var request:URLRequest = new URLRequest("http://www.helpexamples.com/flash/lorem.txt"); 
    loader.load(request); 
    loader.addEventListener(Event.COMPLETE, loadcomplete); 
     
    function loadcomplete(event:Event) { 
        // move loaded text to text field 
        myTxt.text = loader.data; 
        // Set myTxt as target for scroll bar. 
        mySb.scrollTarget = myTxt; 
    }
  4. 制御/ムービープレビューを選択します。