Anpassa komponenten List

Du kan omforma en List-komponent vågrätt och lodrätt under utvecklingen och vid körning. 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() och tillämpliga egenskaper i List-klassen, till exempel height , width , scaleX och scaleY .

När storleken på en lista ändras, krymper raderna vågrätt och eventuell text på raderna beskärs. Lodrätt så läggs rader till eller tas bort efter behov. Rullningslister placeras automatiskt där de behövs.

Använda format med komponenten List

Du kan ställa in stilegenskaper för att ändra utseendet på en List-komponent. Stilarna anger värden för komponentens skal och utfyllning när komponenten ritas.

De olika skalstilarna gör att du kan ange olika klasser att använda för skalet. Mer information om att använda skalstilar finns i Om skal .

Följande procedur ställer in värdet på stilen contentPadding för List-komponenten. Observera att värdet på den här inställningen subtraheras från storleken på List för att få utfyllning runt innehållet, så du kan behöva öka storleken på List för att förhindra att texten i den beskärs.

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

  2. Dra en List-komponent från panelen Komponenter till scenen och ge den förekomstnamnet aList .

  3. Markera bildruta 1 i huvudtidslinjen, öppna panelen Åtgärder och ange följande kod, som ställer in stilen contentPadding och lägger till data i List: 

    aList.setStyle("contentPadding", 5); 
aList.setSize(145, 200); 
aList.addItem({label:"1956 Chevy (Cherry Red)", data:35000}); 
aList.addItem({label:"1966 Mustang (Classic)", data:27000}); 
aList.addItem({label:"1976 Volvo (Xcllnt Cond)", data:17000}); 
aList.rowCount = aList.length;

  4. Välj Kontroll > Testa filmen.

Använda skal med komponenten List

Komponenten List använder följande skal för att representera de olika visuella lägena:

List-skal

Mer information om skalning av ScrollBar finns i Anpassa komponenten UIScrollBar . Information om skalning av Focus Rect-skal finns i Anpassa komponenten TextArea

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

Dubbelklicka på Cell Renderer-skalet för att öppna ytterligare en palett med skal för en List-cells olika lägen.

Cell Renderer-skal för List

Du kan ändra utseendet på List-cellerna genom att redigera de här skalen. Följande procedur ändrar färgen på Up-skalet för att ändra utseende på List i dess normala inaktiva läge.

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

  2. Dra en List-komponent från panelen Komponenter till scenen och ge den förekomstnamnet aList .

  3. Dubbelklicka på List för att öppna paletten med skal.

  4. Dubbelklicka på Cell Renderer-skalet för att öppna paletten med cellrenderarskal.

  5. Dubbelklicka på Up_Skin så att det öppnas för redigering.

  6. Klicka på skalets fyllnadsområde för att markera det. En fyllningsfärgväljare ska visas i egenskapsinspektören med skalets aktuella fyllningsfärg.

  7. Välj färgen #CC66FF med fyllningsfärgväljaren för att använda den på fyllningen för Up_Skin.

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

  9. Lägg till följande kod i åtgärdspanelen på bildruta 1 i tidslinjen för att lägga till data i List: 

    aList.setStyle("contentPadding", 5); 
aList.setSize(145, 200); 
aList.addItem({label:"1956 Chevy (Cherry Red)", data:35000}); 
aList.addItem({label:"1966 Mustang (Classic)", data:27000}); 
aList.addItem({label:"1976 Volvo (Xcllnt Cond)", data:17000}); 
aList.rowCount = aList.length;

  10. Välj Kontroll > Testa filmen.

    Listan ska visas på samma sätt som i bilden nedan:

    List-celler med anpassad färg på Up_Skin
    List-celler med anpassad färg på Up_Skin

    Inramningen kommer från inställningen av contentPadding -stilen.