Usare il componente UIScrollBar

Il componente UIScrollBar consente di aggiungere una barra di scorrimento a un campo di testo, durante la creazione oppure in fase di runtime con ActionScript. Per usare il componente UIScrollBar, create un campo di testo sullo stage e trascinate il componente UIScrollBar dal pannello Componenti in un'area qualsiasi del riquadro di delimitazione del campo di testo.

Se la lunghezza della barra di scorrimento è inferiore alle dimensioni complessive delle relative frecce di scorrimento, la barra non viene visualizzata correttamente. Uno dei pulsanti freccia viene infatti coperto dall'altro. In Flash non è disponibile una funzione di controllo per questo tipo di errore, quindi, in questo caso, è consigliabile nascondere la barra di scorrimento utilizzando ActionScript. Se le dimensioni della barra di scorrimento sono insufficienti per contenere la casella di scorrimento, questa viene nascosta automaticamente.

Il funzionamento del componente UIScrollBar è analogo a qualsiasi altra barra di scorrimento. Contiene pulsanti freccia a entrambe le estremità, separati da una traccia di scorrimento e una casella di scorrimento. Può essere associato a un bordo qualsiasi di un campo di testo e utilizzato sia in verticale che in orizzontale.

Per ulteriori informazioni, vedete la classe TextField nella Guida di riferimento di ActionScript 3.0 per Flash Professional .

Interazione dell'utente con il componente UIScrollBar

A differenza di molti altri componenti, il componente UIScrollBar non richiede l'esecuzione di clic ripetuti, ma può ricevere l'input continuo del mouse, ad esempio quando l'utente tiene premuto il pulsante del mouse.

Il componente UIScrollBar non supporta alcuna interazione mediante la tastiera.

Parametri del componente UIScrollBar

I seguenti parametri di creazione possono essere impostati per ogni istanza del componente UIScrollBar nella finestra di ispezione Proprietà o nella finestra di ispezione dei componenti: direction e scrollTargetName . Ciascuno di questi parametri ha una proprietà ActionScript corrispondente con lo stesso nome.

Potete creare codice ActionScript per impostare opzioni aggiuntive per le istanze di UIScrollBar usandone le proprietà, i metodi e gli eventi. Per ulteriori informazioni, vedete la classe UIScrollBar nella Guida di riferimento di ActionScript 3.0 per Flash Professional .

Creare un'applicazione con il componente UIScrollBar

Nella procedura seguente viene descritto come aggiungere un componente UIScrollBar a un'applicazione durante la creazione.

  1. Create un nuovo documento Flash (ActionScript 3.0).

  2. Create un campo di testo dinamico la cui altezza sia sufficiente per contenere una o più righe di testo e assegnategli il nome di istanza myText nella finestra di ispezione Proprietà.

  3. Nella finestra di ispezione Proprietà, impostare il tipo di riga del campo di immissione di testo su Multiriga, oppure su Multiriga senza a capo auto se si prevede di utilizzare la barra di scorrimento in orizzontale.

  4. Aprite il pannello Azioni, selezionate il fotogramma 1 nella linea temporale e immettete il codice ActionScript seguente per compilare la proprietà text in modo che sia necessario scorrere il testo per visualizzarlo completamente:

    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."
    Nota: Assicurarsi che il campo di testo sullo stage sia sufficientemente piccolo da richiedere lo scorrimento per visualizzare tutto il testo. In caso contrario, la barra di scorrimento non è visibile o appare sotto forma di due righe prive del riquadro da trascinare per scorrere il contenuto.
  5. Verificate che la funzione di aggancio agli oggetti sia attivata (Visualizza > Aggancio > Aggancia agli oggetti).

  6. Trascinare un'istanza di UIScrollBar dal pannello Componenti al campo di testo di input accanto al lato di aggancio. Quando si rilascia il pulsante del mouse, il componente deve essere sovrapposto al campo di testo per agganciarsi correttamente al campo. Assegnate all'istanza il nome mySb .

    La proprietà scrollTargetName del componente viene compilata automaticamente con il nome di istanza del campo di testo nella finestra di ispezione Proprietà e nella finestra di ispezione dei componenti. Se non viene visualizzata nella scheda Parametri, è possibile che non sia stata sufficientemente sovrapposta l'istanza UIScrollBar.

  7. Selezionare Controllo > Prova filmato.

Creare l'istanza di un componente UIScrollBar mediante ActionScript

Potete inoltre creare un'istanza del componente UIScrollBar mediante ActionScript e associarla a un campo di testo in fase di runtime. Nell'esempio seguente viene creata un'istanza UIScrollBar con orientamento orizzontale che viene agganciata al lato inferiore di un'istanza di campo di testo chiamata myTxt , caricata con il testo da un URL. Nell'esempio vengono inoltre impostate le dimensioni della barra di scorrimento in modo che corrisponda alle dimensioni del campo di testo:

  1. Create un nuovo documento Flash (ActionScript 3.0).

  2. Trascinate il componente ScrollBar nel pannello Libreria.

  3. Aprite il pannello Azioni, selezionate il fotogramma 1 nella linea temporale principale, quindi immettete il codice ActionScript seguente:

    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. Selezionare Controllo > Prova filmato.