|
Potete trasformare un componente ComboBox modificandone le dimensioni orizzontale e verticale sia durante la creazione che in fase di runtime. Durante la creazione, selezionate il componente nello stage e usate lo strumento Trasformazione libera o uno dei comandi Elabora > Trasforma. In fase di runtime, usate il metodo
setSize()
o le proprietà valide della classe ComboBox quali
height
,
width
,
scaleX
e
scaleY
.
Il componente ComboBox viene ridimensionato in base alla larghezza e all'altezza specificate. L'elenco viene ridimensionato in base alla larghezza del componente, a meno che sia stata impostata la proprietà
dropdownWidth
.
Se il testo è troppo lungo, viene troncato per essere adattato al componente ComboBox. È necessario ridimensionare ComboBox e impostare la proprietà
dropdownWidth
per adattarvi il testo.
Usare gli stili con il componente ComboBox
L'impostazione delle proprietà degli stili consente di modificare l'aspetto di un componente ComboBox. Mediante gli stili potete specificare i valori per gli skin, il renderer di celle, il riempimento e la larghezza del pulsante relativi al componente. Nell'esempio seguente vengono impostati gli stili
buttonWidth
e
textPadding
. Lo stile
buttonWidth
consente di impostare la larghezza dell'area attiva del pulsante, ed è disponibile quando il componente ComboBox è modificabile ed è possibile solo premere il pulsante per aprire l'elenco a discesa. Lo stile textPadding consente di specificare la quantità di spazio tra il bordo esterno del campo di testo e il testo. È utile per centrare verticalmente il testo nel campo di testo se aumentate l'altezza del componente ComboBox, in caso contrario il testo potrebbe essere visualizzato nella parte superiore del campo di testo.
-
Create un nuovo documento File Flash (ActionScript 3.0).
-
Trascinate il componente ComboBox nello stage e assegnategli il nome di istanza
aCb
.
-
Aprite il pannello Azioni, selezionate il fotogramma 1 nella linea temporale principale e immettete il codice seguente:
import fl.data.DataProvider;
aCb.setSize(150, 35);
aCb.setStyle("textPadding", 10);
aCb.setStyle("buttonWidth", 10);
aCb.editable = true;
var items:Array = [
{label:"San Francisco", data:"601 Townsend St."},
{label:"San Jose", data:"345 Park Ave."},
{label:"San Diego", data:"10590 West Ocean Air Drive, Suite 100"},
{label:"Santa Rosa", data:"2235 Mercury Way, Suite 105"},
{label:"San Luis Obispo", data:"3220 South Higuera Street, Suite 311"}
];
aCb.dataProvider = new DataProvider(items);
-
Selezionare Controllo > Prova filmato.
L'area del pulsante su cui potete fare clic per aprire l'elenco a discesa è solamente un'area sottile presente sul lato destro e il testo è centrato verticalmente nel campo di testo. Potete provare a eseguire l'esempio senza le due istruzioni
setStyle()
per verificarne l'effetto.
Usare gli skin con il componente ComboBox
Il componente ComboBox usa i seguenti skin per rappresentare i relativi stati visivi:
Skin del componente ComboBox
Potete cambiare il colore dello skin Up per modificare il colore del componente nello stato inattivo sullo stage.
-
Create un nuovo documento File Flash (ActionScript 3.0).
-
Trascinate il componente ComboBox nello stage.
-
Fate doppio clic sul componente per aprire la tavolozza dei relativi skin.
-
Fate doppio clic sullo skin Up per selezionarlo e aprirlo per la modifica.
-
Impostate la percentuale di ingrandimento su 400%.
-
Fate clic sull'area centrale dello skin per visualizzare il colore nel selettore Colore riempimento nella finestra di ispezione Proprietà.
-
Selezionate il colore #33FF99 usando il selettore Colore riempimento per applicarlo allo skin Up.
-
Fate clic sul pulsante Indietro sul lato sinistro della barra di modifica, visualizzata sopra lo stage, per tornare alla modalità di modifica del documento.
-
Selezionare Controllo > Prova filmato.
Il componente ComboBox dovrebbe essere visualizzato nello stage come nella figura illustrata di seguito.
ComboBox con colore personalizzato per lo skin Background
|
|
|
