De component UIScrollBar gebruiken

Met de component UIScrollBar kunt u een schuifbalk toevoegen aan een tekstveld. U kunt met ActionScript een schuifbalk aan een tekstveld toevoegen tijdens het ontwerpen of bij uitvoering. Wanneer u de component UIScrollBar wilt gebruiken, maakt u een tekstveld in het werkgebied en sleept u de component UIScrollBar van het deelvenster Componenten naar de gewenste zijde van het selectiekader van het tekstveld.

Wanneer de lengte van de schuifbalk korter is dan de gezamenlijke grootte van de schuifpijlen, wordt deze niet goed weergegeven. Een van de pijlknoppen wordt in dat geval achter de andere verborgen. In Flash wordt hier geen foutcontrole op uitgevoerd. In een dergelijk geval is het raadzaam de schuifbalk met ActionScript te verbergen. Wanneer de grootte van de schuifbalk zodanig is dat er onvoldoende ruimte is voor het schuifblokje, wordt het schuifblokje onzichtbaar gemaakt.

De component UIScrollBar werkt als elke andere schuifbalk. Deze bevat een pijlknop aan elk uiteinde met daartussen een schuifvak met een schuifblokje. De component kan aan elke rand van een tekstveld worden gekoppeld en zowel verticaal als horizontaal worden gebruikt.

Zie de klasse TextField in de Naslaggids voor ActionScript 3.0 voor Adobe Flash Professional CS5 voor informatie over TextField.

Gebruikersinteractie met de component UIScrollBar

In tegenstelling tot vele andere componenten kan de component UIScrollBar continue muisinvoer ontvangen (bijvoorbeeld wanneer de gebruiker de muisknop ingedrukt houdt) in plaats  van herhaalde klikhandelingen.

Er is geen toetsenbordinteractie met de component UIScrollBar.

Parameters van de component UIScrollBar

U kunt in Eigenschapcontrole of Componentcontrole de volgende ontwerpparameters instellen voor elke instantie van de component CheckBox: direction en scrollTargetName . Elk van deze parameters heeft een bijbehorende ActionScript-eigenschap met dezelfde naam.

U kunt ActionScript-code schrijven om aanvullende opties voor instanties UIScrollBar in te stellen met de methoden, eigenschappen en gebeurtenissen ervan. Zie de klasse UIScrollBar in de Naslaggids voor ActionScript 3.0 voor Adobe Flash Professional CS5 voor meer informatie.

Een toepassing met de component UIScrollBar maken

De volgende procedure laat zien hoe u een component UIScrollBar tijdens het ontwerpen aan een toepassing kunt toevoegen.

  1. Maak een nieuw Flash-document (ActionScript 3.0).

  2. Maak een dynamisch tekstveld dat hoog genoeg is voor een of twee tekstregels en geef deze in Eigenschapcontrole de instantienaam myText .

  3. Stel in Eigenschapcontrole het lijntype van het tekstinvoerveld in op Meerdere regels of Meerdere regels, geen tekstomloop wanneer u de schuifbalk horizontaal wilt gebruiken.

  4. Open het deelvenster Handelingen, selecteer frame 1 van de hoofdtijdlijn en voeg de volgende ActionScript-code toe om de eigenschap text te vullen, zodat de gebruiker moet schuiven om alles te kunnen zien: 

    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."
    Opmerking: Zorg dat het tekstveld in het werkgebied klein genoeg is om te moeten schuiven om alle tekst te kunnen zien. Als dit niet het geval is, wordt de schuifbalk niet weergegeven of wordt deze mogelijk als twee lijnen zonder blokje weergegeven (het deel dat u sleept om door de inhoud te schuiven).

  5. Controleer of magnetische objectuitlijning is ingeschakeld (Weergave > Magnetisch uitlijnen > Objecten magnetisch).

  6. Sleep een instantie UIScrollBar van het deelvenster componenten naar het tekstinvoerveld in de buurt van de zijde waar u deze wilt plaatsen. De component moet met het tekstveld overlappen wanneer de muisknop wordt losgelaten, anders wordt deze niet juist aan het veld gebonden. Geef deze de instantienaam mySb.

    De eigenschap scrollTargetName van de component wordt automatisch gevuld met de instantienaam van het tekstveld in Eigenschapcontrole en Componentcontrole. Wanneer deze niet op het tabblad Parameters wordt weergegeven, hebt u de instantie UIScrollBar mogelijk niet genoeg laten overlappen.

  7. Selecteer Besturing > Film testen.

Een componentinstantie UIScrollBar met ActionScript maken

U kunt met ActionScript een instantie UIScrollBar maken en deze aan een tekstveld koppelen bij uitvoering. In het volgende voorbeeld wordt een horizontale instantie UIScrollBar gemaakt en gekoppeld aan de onderzijde van een tekstveldinstantie met de naam myTxt , waarin tekst uit een URL wordt geladen. Bovendien wordt de grootte van de schuifbalk ingesteld, zodat deze overeenkomt met de grootte van het tekstveld.

  1. Maak een nieuw Flash-document (ActionScript 3.0).

  2. Sleep de component UIScrollBar naar het deelvenster Bibliotheek.

  3. Open het deelvenster Handelingen, selecteer frame 1 van de hoofdtijdlijn en voeg de volgende ActionScript-code toe: 

    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. Selecteer Besturing > Film testen.