Cenni preliminari su temi e interfacce ASP.NET
Aggiornamento: novembre 2007
Un tema è un insieme di impostazioni delle proprietà che consentono di definire l'aspetto di pagine e controlli e di applicarlo in modo uniforme alle pagine di un'applicazione Web, a un'intera applicazione Web o a tutte le applicazioni Web su un server.
Temi e interfacce dei controlli
I temi sono composti da un insieme di elementi: interfacce, fogli di stile CSS, immagini e altre risorse. Un tema include almeno le interfacce. I temi sono definiti in directory specifiche nel sito Web o nel server Web.
Interfacce
Un file di interfaccia presenta l'estensione skin e include impostazioni delle proprietà di singoli controlli come Button, Label, TextBox o Calendar. Le impostazioni dell'interfaccia di un controllo sono simili al codice del controllo, ma includono solo le proprietà da impostare come parte del tema. Ad esempio, di seguito viene riportata un'interfaccia per un controllo Button.
<asp:button BackColor="lightblue" ForeColor="black" />
I file con estensione skin vengono creati nella cartella del tema. Un file con estensione skin può contenere una o più interfacce di un controllo per uno o più tipi di controllo. È possibile definire le interfacce in un file separato per ogni controllo oppure definire tutte le interfacce per un tema in un singolo file.
Esistono due tipi di interfacce dei controlli, interfacce predefinite e interfacce con nome:
Un'interfaccia predefinita si applica automaticamente a tutti i controlli dello stesso tipo quando un tema viene applicato a una pagina. Un'interfaccia del controllo è predefinita se è priva dell'attributo SkinID. Se, ad esempio, si crea un'interfaccia predefinita per un controllo Calendar, l'interfaccia verrà applicata a tutti i controlli Calendar nelle pagine che fanno uso del tema. Per le interfacce predefinite viene creata una corrispondenza esatta in base al tipo di controllo, in modo che un'interfaccia del controllo Button venga applicata a tutti i controlli Button, ma non ai controlli LinkButton che derivano dall'oggetto Button.
Un'interfaccia denominata è un'interfaccia di controllo per la quale è impostata la proprietà SkinID. Le interfacce denominate non vengono applicate automaticamente ai controlli in base al tipo. Vengono invece applicate esplicitamente a un controllo impostando la proprietà SkinID del controllo stesso. Tramite la creazione di interfacce denominate è possibile impostare interfacce diverse per istanze diverse dello stesso controllo all'interno di un'applicazione.
Fogli di stile CSS
Un tema può anche includere un foglio di stile CSS (file css). Quando un file css viene inserito nella cartella del tema, il foglio di stile viene applicato automaticamente come parte del tema e viene definito mediante l'estensione css nella cartella dei temi.
Elementi grafici dei temi e altre risorse
I temi possono includere anche elementi grafici e altre risorse, ad esempio file script o audio. Ad esempio, parte del tema di pagina può includere un'interfaccia per un controllo TreeView. All'interno del tema, è possibile includere gli elementi grafici utilizzati per rappresentare i pulsanti di espansione e compressione.
Generalmente i file di risorse del tema si trovano nella stessa cartella dei file di interfaccia, ma possono anche essere ubicati altrove nell'applicazione Web, in una sottocartella della cartella del tema ad esempio. Per fare riferimento a un file di risorse in una sottocartella della cartella del tema, utilizzare un percorso come quello illustrato in questa interfaccia del controllo Image:
<asp:Image ImageUrl="ThemeSubfolder/filename.ext" />
Il file di risorse può anche essere memorizzato al di fuori della cartella del tema. Se si utilizza la sintassi della tilde (~) per fare riferimento ai file di risorse, le immagini verranno trovate automaticamente nell'applicazione Web. Se, ad esempio, le risorse relative a un tema vengono inserite in una sottocartella dell'applicazione, è possibile utilizzare percorsi del formato ~/SubFolder/nomefile.ext per fare riferimento ai file di risorse, come nell'esempio riportato di seguito.
<asp:Image ImageUrl="~/AppSubfolder/filename.ext" />
Ambito dei temi
È possibile definire temi per una singola applicazione Web o come temi globali utilizzabili da tutte le applicazioni su un server Web. Una volta definito, un tema può essere inserito in singole pagine mediante l'attributo Theme o StyleSheetTheme della direttiva @ Page o essere applicato a tutte le pagine di un'applicazione tramite l'impostazione dell'elemento <pages> nel file di configurazione dell'applicazione. Se l'elemento <pages> viene definito nel file Machine.config, il tema verrà applicato a tutte le pagine delle applicazioni Web sul server.
Temi di pagina
Un tema pagina è una cartella di temi con interfacce del controllo, fogli di stile, file grafici e altre risorse create come sottocartella della cartella \App_Themes nel sito Web. Per ogni tema è presente una diversa sottocartella della cartella \App_Themes. Nell'esempio riportato di seguito viene mostrato un tema pagina standard, che definisce due temi: BlueTheme e PinkTheme:
MyWebSite
App_Themes
BlueTheme
Controls.skin
BlueTheme.css
PinkTheme
Controls.skin
PinkTheme.css
Temi globali
Un tema globale è un tema applicabile a tutti i siti Web su un server. Tramite i temi globali è possibile definire un aspetto generale del dominio dove sono presenti più sito Web nello stesso server.
I temi globali sono simili ai temi pagina, in quanto includono impostazioni di proprietà e di fogli di stile ed elementi grafici. Tuttavia, sono memorizzati in una cartella denominata Themes, unica per il server Web. Ogni sito Web nel server e ogni pagina nel sito Web può fare riferimento a un tema globale.
Precedenze nelle impostazioni dei temi
È possibile specificare la precedenza delle impostazioni dei temi rispetto alle impostazioni dei controlli locali indicando la modalità di applicazione del tema.
Se si imposta la proprietà Theme di una pagina, le impostazioni del controllo nel tema e la pagina vengono unite per formare le impostazioni finali del controllo. Se l'impostazione di un controllo viene definita sia nel controllo che nel tema, le impostazioni del controllo provenienti dal tema eseguono l'override di qualsiasi impostazione di pagina sul controllo. Questa strategia rende possibile il conferimento di un aspetto coerente alle pagine tramite il tema, anche se ai controlli sulle pagine sono già associate impostazioni di proprietà specifiche. In questo modo è possibile, ad esempio, applicare un tema a una pagina creata in una versione precedente di ASP.NET.
In alternativa, è possibile applicare un tema come tema di foglio di stile impostando la proprietà StyleSheetTheme della pagina. in questo caso, le impostazioni della pagina locale hanno la precedenza su quelle definite nel tema quando l'impostazione viene definita in entrambe le posizioni. Questo è il modello utilizzato dai fogli di stile CSS. È possibile applicare un tema come tema di foglio di stile se si desidera essere in grado di impostare le proprietà dei singoli controlli sulla pagina pur applicando un tema per ottenere un aspetto uniforme.
Gli elementi globali del tema non possono essere sostituiti parzialmente da elementi di temi a livello di applicazione. Se si crea un tema a livello di applicazione con lo stesso nome di un tema globale, gli elementi nel tema a livello di applicazione non eseguiranno l'override degli elementi globali del tema.
Proprietà che è possibile definire utilizzando i temi
Di norma, è possibile utilizzare i temi per definire le proprietà relative all'aspetto di una pagina o di un controllo o al contenuto statico. È possibile impostare solo le proprietà che includono un attributo ThemeableAttribute impostato su true nella classe del controllo.
Le proprietà che specificano esplicitamente il funzionamento del controllo anziché il suo aspetto non accettano valori del tema. Non è ad esempio possibile impostare la proprietà CommandName del controllo Button utilizzando un tema. Analogamente, non è possibile utilizzare un tema per impostare la proprietà AllowPaging o DataSource del controllo GridView.
Si noti che non è possibile utilizzare generatori di espressioni che generano espressioni di codice per l'assegnazione in una pagina in fase di compilazione in temi o interfacce.
Temi e fogli di stile CSS
I temi sono simili ai fogli di stile CSS in quanto entrambi definiscono un insieme di attributi comuni che è possibile applicare a qualsiasi pagina. Tuttavia, i temi differiscono dai fogli di stile per le seguenti caratteristiche:
I temi possono definire molte proprietà di un controllo o di una pagina, non soltanto le proprietà di stile. Utilizzando i temi, ad esempio, è possibile specificare gli elementi grafici per un controllo TreeView, il layout del modello di un controllo GridView e così via.
I temi possono includere anche elementi grafici.
I temi non vengono sovrapposti come i fogli di stile. Per impostazione predefinita, i valori delle proprietà definiti in un tema a cui viene fatto riferimento dalla proprietà Theme di una pagina eseguono l'override di quelli impostati in modo dichiarativo in un controllo, a meno che il tema sia applicato esplicitamente utilizzando la proprietà StyleSheetTheme. Per ulteriori informazioni, vedere la sezione Precedenze nelle impostazioni dei temi sopra.
A ogni pagina è possibile applicare un solo tema. A differenza dei fogli di stile per i quali è consentita l'applicazione di più fogli di stile, infatti, l'applicazione di più temi a una pagina non è consentita.
Considerazioni sulla sicurezza
I temi possono causare problemi di sicurezza quando vengono utilizzati nel sito Web. Temi dannosi possono essere utilizzati per:
Alterare il comportamento di un controllo in modo che non si comporti come previsto.
Inserire script sul lato client, causando così un rischio di script su più siti.
Alterare la convalida.
Rendere pubbliche informazioni riservate.
Per ridurre gli effetti di queste comuni minacce:
Proteggere le directory dei temi globali e dei temi dell'applicazione mediante impostazioni del controllo di accesso adeguate. Solo agli utenti attendibili deve essere consentito di scrivere file nelle directory dei temi.
Non utilizzare temi provenienti da una fonte non attendibile. Prima di utilizzarli nel sito Web, esaminare sempre i temi non provenienti dall'organizzazione alla ricerca di eventuale codice dannoso.
Non esporre il nome del tema nei dati di query. Utenti malintenzionati potrebbero utilizzare queste informazioni per utilizzare temi sconosciuti allo sviluppatore rendendo così pubbliche informazioni riservate.