Suggerimenti di stile per controlli di Silverlight comuni

Articolo
10/11/2017

Ee371156.0b2c798e-86c6-4ea2-a8a6-5cf1f12be1e2(it-it,Expression.40).png

Microsoft Expression Blend include diversi controlli Microsoft Silverlight che è possibile utilizzare per creare un'esperienza utente eccezionale. È inoltre possibile scaricare alcuni controlli da fonti attendibili.

Per ulteriori informazioni, vedere Importare un controllo personalizzato aggiungendo un riferimento.

Se si trova un controllo che supporta i modelli e funzionalmente adatto alle proprie esigenze ma non con l'aspetto desiderato, sarà possibile modificare i modelli del controllo per modificarne l'aspetto.

Per semplificare la procedura, è possibile concentrarsi sul progetto disegnando prima tutti gli elementi sulla tavola da disegno e importando successivamente elementi grafici o altri asset. Al termine, è possibile utilizzare il comando Crea controllo per convertire gli oggetti in un modello per qualsiasi controllo.

Associazione a modello

I controlli dispongono di proprietà a cui è possibile associare gli oggetti di un modello. Questa operazione è denominata associazione a modello. Tramite l'associazione di parti del modello a un controllo, è possibile definire in modo efficace i parametri del modello. Ad esempio, anziché un'istruzione di tipo "Questo oggetto Rectangle è di colore blu" viene utilizzata un'istruzione di tipo "Questo oggetto Rectangle è dello stesso colore della proprietà Background del controllo". In questo modo, quando si applica il modello a un controllo con proprietà Background diverse, il modello risulterà di colore diverso.

Per associare a modello una proprietà, selezionare un oggetto di un modello, fare clic su Opzioni avanzate nel pannello Proprietà e quindi scegliere una proprietà in Associazione a modello.

Per alcune proprietà, ad esempio OpacityMask, Font, FontSize, LayoutTransform e RenderTransform, non è necessario creare un'associazione a modello in quanto vengono applicate automaticamente agli oggetti dei modelli.

Proprietà Content e Header

Alcuni controlli, tra cui Button, CheckBox e RadioButton, contengono una proprietà Content. Altri tra cui TabItem e MenuItem, contengono una proprietà Header. Le proprietà Content e Header possono essere utilizzate per visualizzare contenuto di qualsiasi tipo.

Per visualizzare qualsiasi tipo di contenuto

Se si desidera visualizzare qualsiasi tipo di contenuto e non solo testo, è necessario inserire nel modello un oggetto ContentPresenter con una proprietà Content o Header associata alla proprietà Content o Header del controllo. Se si utilizza Crea controllo per convertire un oggetto grafico in un modello, al modello verrà aggiunto un oggetto ContentPresenter automaticamente da Expression Blend. Se in precedenza si utilizzava un controllo TextBlock per visualizzare il contenuto, eliminare TextBlock dopo la conversione dell'oggetto grafico in un controllo. ContentPresenter visualizzerà il contenuto in precedenza visualizzato in TextBlock.

Per visualizzare un testo

Se si desidera visualizzare solo testo, è possibile utilizzare un controllo TextBlock anziché ContentPresenter. Inserire nel modello il controllo TextBlock e quindi associare la proprietà Text di TextBlock alla proprietà Content o Header di Button. Se si utilizza Crea controllo per convertire un oggetto grafico in un modello e in precedenza si utilizzava un controllo TextBlock per visualizzare il contenuto, eliminare l'oggetto ContentPresenter aggiunto automaticamente da Expression Blend al modello. Quando si aggiunge un testo alla proprietà Content o Header di un controllo a cui è applicato questo stile, il testo verrà visualizzato nel controllo TextBlock.

Creazione di un controllo ContentControl

Quando si utilizza Crea controllo per convertire un oggetto grafico contenente un oggetto TextBlock in un modello di un controllo ContentControl, ad esempio un pulsante, in Expression Blend vengono eseguite le seguenti operazioni:

Nel modello al posto di TextBlock viene inserito un oggetto ContentPresenter.
Le proprietà Layout di TextBlock vengono copiate in ContentPresenter.
Le proprietà Typography di TextBlock vengono copiate nello stile del controllo.
La proprietà Text di TextBlock viene copiata nell'istanza della proprietà Content del controllo.

Creazione di un controllo TextBox

Quando si utilizza Crea controllo per convertire un oggetto grafico contenente un oggetto TextBlock in un modello di un controllo TextBox, in Expression Blend vengono eseguite le seguenti operazioni:

Nel modello al posto di TextBlock viene inserito un oggetto ScrollViewer che rappresenta la parte ContentElement.
Le proprietà Layout di TextBlock vengono copiate nella parte ContentElement.
Le proprietà Typography di TextBlock vengono copiate nello stile TextBox.
La proprietà Text di TextBlock viene copiata nell'istanza del controllo TextBox.

Stati di visualizzazione

Gli stati di visualizzazione di uno StateGroup si escludono a vicenda. Gli stati di qualsiasi gruppo sono tuttavia indipendenti dagli stati di qualsiasi altro gruppo. Ciò significa che qualsiasi stato di ogni gruppo può essere applicato in qualsiasi momento senza creare un conflitto.

Spesso viene modificata una proprietà di un oggetto in più stati di uno stesso gruppo. È ad esempio possibile modificare la proprietà Fill di Rectangle per gli stati MouseOver, Pressed e Disabled. Questa operazione è possibile perché viene applicato un solo stato del gruppo di stati CommonStates alla volta. Se tuttavia si modifica la proprietà di un oggetto in più gruppi di stati, verrà compromessa l'indipendenza dei gruppi di stato e si verificherà un conflitto nel caso in cui più stati tentino di impostare la proprietà di uno stesso oggetto contemporaneamente. Se viene rilevato un conflitto tra stati, in Expression Blend verrà visualizzato un avviso.

Importante:
Ogni nome di stato deve essere univoco all'interno di un modello, anche tra diversi gruppi di stati.

Stato di visualizzazione Normal

Ogni gruppo di stato dispone di uno stato predefinito. Ad esempio, lo stato predefinito di CommonStates è Normal, mentre quello di CheckedStates è Unchecked. È consigliabile lasciare invariato lo stato predefinito quando si modificano le proprietà di un oggetto. Nel caso di una casella di controllo, ad esempio, i rettangoli del segno di spunta e della casella di controllo sono vuoti (nascosti) nello stato Base, mentre nello stato Checked viene visualizzato il rettangolo del segno di spunta e nello stato Focused viene visualizzato il rettangolo della casella di controllo.

Si tenga presenta che Base non è uno stato. Per questo motivo, non è possibile definire o controllare transizioni da e verso Base. Non è ad esempio possibile definire una transizione da Base a MouseOver perché Base non è uno stato. Base rappresenta il modello nella condizione di base, ovvero senza alcuno stato applicato. Quando si definiscono le transizioni, è consigliabile prendere in considerazione solo gli stati veri e propri.

Quando si creano modelli di controlli personalizzati, è consigliabile definire uno stato Normal in ogni gruppo di stato e attivare per impostazione predefinita tale stato quando il controllo viene caricato. Se un controllo, ad esempio Button, non si trova nello stato Normal quando viene caricato, la transizione, ad esempio dallo stato Normal allo stato MouseOver, non verrà eseguita.

Contenuto della sezione

Vedere anche

Concetti

Definire stati di visualizzazione diversi per un controllo
Applicazione di stili alle parti di un modello controllo di Silverlight
Definizione dello stile di un controllo che supporta i modelli
Suggerimenti di stile per stili semplici WPF

Condividi tramite