Anpassa komponenten UIScrollBar

Du kan omforma en UIScrollBar-komponent vågrätt och lodrätt under utvecklingen och vid körning. Men för en lodrät UIScrollBar kan du inte ändra bredden, och för en vågrät UIScrollBar kan du inte ändra höjden. Under utvecklingen markerar du komponenten på scenen och använder verktyget Omforma fritt eller något av kommandona på menyn Ändra > Omforma. Vid körning använder du metoden setSize() eller tillämpliga egenskaper för UIScrollBar-klassen, till exempel width , height , scaleX och scaleY .

Obs! Om du använder metoden setSize() kan du bara ändra bredden på en vågrät rullningslist eller höjden på en lodrät rullningslist. Under utvecklingen kan du ställa in höjden på en vågrät rullningslist och bredden på en lodrät rullningslist, men värdena återställs när filmen publiceras. Endast den dimension för en rullningslist som motsvarar dess längd kan ändras.

Använda format med komponenten UIScrollBar

UIScrollBar-komponentens stilar anger bara skalens klasser och ett värde för FocusRectPadding, som anger antalet pixlar som ska användas för utfyllningen mellan komponentens begränsningsram och dess yttre gräns. Mer information om att använda skalstilar finns i Om skal .

Använda skal med komponenten UIScrollBar

Komponenten UIScrollBar använder följande skal.

UIScrollBar-skal

Både vågräta och lodräta rullningslister använder samma skal. När en vågrät rullningslist visas roterar UIScrollBar-komponenten skalet på det sätt som behövs.

Obs! Om du ändrar ScrollBar-skalet i en komponent ändras skalet i alla andra komponenter som använder ScrollBar.

I följande exempel visas hur du ändrar färgen på UIScrollBars reglage och pilknappar.

  1. Skapa ett nytt Flash-dokument (ActionScript 3.0).

  2. Dra UIScrollBar-komponenten till scenen och ge den förekomstnamnet mySb . På fliken Parametrar ställer du in riktningen till vågrät.

  3. Dubbelklicka på rullningslisten för att öppna panelen med skal.

  4. Klicka på Up-skalet för att markera det.

  5. Ställ in zoomkontrollen på 400% för att förstora ikonen för redigering.

  6. Dubbelklicka på bakgrunden till den högra pilen (eller uppilen för en lodrät rullningslist) tills bakgrunden har markerats och färgen visas i fyllningsfärgväljaren i egenskapsinspektören.

  7. Välj färgen #CC0033 för att använda den på knappbakgrunden.

  8. Klicka på knappen Tillbaka till vänster om redigeringsfältet ovanför scenen tills du återgår till dokumentredigeringsläge.

  9. Upprepa steg 6, 7 och 8 för reglaget och den vänstra pilen (eller nedpilen för en lodrät rullningslist).

  10. Lägg till följande kod på åtgärdspanelen i bildruta 1 i tidslinjen för att koppla rullningslisten till ett TextField.

    var tf:TextField = new TextField(); 
    addChild(tf); 
    tf.x = 150; 
    tf.y = 100; 
    mySb.width = tf.width = 200; 
    tf.height = 22; 
    tf.text = "All work and no play makes Jack a dull boy. All work and no play makes Jack a dull boy. All . . ."; 
    mySb.y = tf.y + tf.height; 
    mySb.x = tf.x + tf.width;x 
    mySb.scrollTarget = tf;
  11. Välj Kontroll > Testa filmen.

    Komponenten UIScrollBar ska se ut på samma sätt som i bilden nedan.

    Vågrät ScrollBar med röd färg på reglage och vänster- och högerpilen
    Vågrät ScrollBar med röd färg på reglage och vänster- och högerpilen