Convertitore di Misure in C# – #5 – Risorse e Stili

Convertitore di Misure in C# – #5 – Risorse e Stili

Convertitore di Misure in C# – #5 – Risorse e Stili: Inserimento di elementi di tipo Resource e Style all’interno di un progetto in WPF.

Tempo di lettura stimato: 4 minuti

Convertitore di Misure in C# – #5 – Risorse e Stili

In questo quindi tutorial sull’utilizzo di WPF vediamo come inserire delle risorse e degli stili da poter utilizzare nelle diverse finestre del progetto.

Nel tutorial precedente abbiamo già visto come inserire un font nelle risorse e come richiamarlo, in questo tutorial andremo ad approfondire l’utilizzo delle risorse.

Resources

Iniziamo dal primo elemento, le risorse, una risorsa è un singolo attributo o valore che può essere applicato a più elementi o controlli.

Ad esempio potremmo impostare un colore, un font, una misura.

Questo valore può essere poi richiamato all’interno del codice XAML.

Dove Inserire le Risorse

Le risorse possono essere dichiarate in 2 posizioni:

  • All’interno del file App.xaml
  • All’inizio di un qualsiasi documento xaml

Quando dichiariamo una risorsa nel file app.xaml la rendiamo disponibile per l’intero progetto, se invece è inserita solo in una finestra sarà disponibile solamente per quella finestra.

Come inserire la risorsa nel file app.xaml

<Application.Resources>
        <SolidColorBrush x:Key="ColorePrincipale">LightGreen</SolidColorBrush>
        <SolidColorBrush x:Key="ColoreTestoPulsanti">White</SolidColorBrush>
</Application.Resources>

Le risorse all’interno del file app.xaml andranno sempre inserite all’interno del tag Application.Resources, in questo esempio abbiamo creato 2 risorse di tipo SolidColorBrush che andranno ad inserire un colore alla proprietà che le andrà a richiamare.

x:Key permette di assegnare un nome alla risorsa, questo nome è fondamentale per poterla poi richiamare.

Come inserire la risorsa nelle finestre o nelle pagine

Le risorse possono essere inserite anche direttamente nelle finestre o nelle pagine che le richiedono.

In questo caso saranno disponibili solo per quella finestra o quella pagina.

Nelle finestre andranno inserite nel tag Window.Resources, nelle pagine invece nel tag Page.Resources.

Come richiamare una risorsa

Per richiamare una risorsa in una proprietà dovremo scrivere {StaticResources NOMEDELLARISORSA}, ad esempio:

<Button Background="{StaticResources ColorePrincipale}"/>

Risorse speciali e Variabili

Per poter utilizzare alcuni tipi di variabili come risorsa, ad esempio la variabile Double, Boolean, Int16, Int32, DateTime ecc. dovremo aggiungere un nuovo riferimento ad inizio documento, la riga da aggiungere è:

xmlns:sys="clr-namespace:System;assembly=mscorlib"

Gli Stili

Gli stili sono delle risorse più avanzate.

Uno stile permette infatti di raggruppare più risorse e di assegnarle tutte ad un determinato elemento.

Con uno stile quindi è possibile impostare automaticamente colore, font, dimensioni e qualsiasi altra proprietà dell’elemento.

Dove inserire gli stili

Gli stili funzionano esattamente come le risorse, quindi possono essere inseriti nelle stesse posizioni delle risorse.

Come creare uno stile

Lo stile è un contenitore di risorse, in questo caso dovremo indicare il controllo di destinazione con TargetType (nell’esempio Button).

Tramite Setter andiamo ad impostare la proprietà ed il suo valore, possiamo aggiungere facilmente tutte le proprietà di un determinato elemento.

Non è obbligatorio impostare nello stile tutte le proprietà, possiamo scegliere quali impostare e poi aggiungere esternamente le altre.

Esempio di stile:

        <SolidColorBrush x:Key="ColorePrincipale">LightGreen</SolidColorBrush>
        <Style x:Key="PulsanteConverti" TargetType="Button">
            <Setter Property="Background" Value="{StaticResource ColorePrincipale}" />
            <Setter Property="Foreground" Value="{StaticResource ColoreTestoPulsanti}" />
            <Setter Property="Width" Value="368" />
            <Setter Property="Height" Value="37" />
            <Setter Property="Margin" Value="200,186,0,0" />
        </Style>

Come richiamare lo stile

A differenza della risorsa lo stile non va assegnato ad un singolo attributo ma all’intero elemento, quindi per assegnarlo scriveremo:

<Button Style="{StaticResources PulsanteConverti}"/>

Stili Base

Gli stili possono ereditare proprietà da altri stili, è possibile quindi creare uno stile base con alcune proprietà e poi uno stile che richiama quelle proprietà e ne aggiunge altre.

Esempio:

<Style x:Key="StileElementiComuni" TargetType="Control">
            <Setter Property="Background" Value="{StaticResource ColorePrincipale}" />
            <Setter Property="Foreground" Value="{StaticResource ColoreTestoPulsanti}" />
        </Style>

        <Style x:Key="PulsanteConverti" TargetType="Button" BasedOn="{StaticResource StileElementiComuni}">
            <Setter Property="Width" Value="368" />
            <Setter Property="Height" Value="37" />
            <Setter Property="Margin" Value="200,186,0,0" />
        </Style>
        <Style x:Key="TextBoxInserimentoDati" TargetType="TextBox" BasedOn="{StaticResource StileElementiComuni}">
            
        </Style>

In questo esempio lo stile StileElementiComuni è generico, e come TargetType ha Control (quindi disponibilie per tutti i tipi di controlli), poi gli stili Button e TextBox vanno a prendere le informazioni dallo stile StileElementiComuni grazie all’attributo BasedOn.

Download Codice Sorgente

Puoi scaricare il codice sorgente del progetto incluso questo tutorial e il funzionamento completo della conversione dei pesi da questo link:

Video

Nel video trovi il tutorial completo e dettagliato sul funzionamento delle risorse e degli stili

Scopri di più da ClaudioMasci

Abbonati ora per continuare a leggere e avere accesso all'archivio completo.

Continua a leggere