Esporta (0) Stampa
Espandi tutto
Il presente articolo è stato tradotto manualmente. Passare il puntatore sulle frasi nell'articolo per visualizzare il testo originale.
Traduzione
Originale

Procedura dettagliata: sviluppo e utilizzo di un controllo server Web personalizzato

In questa procedura dettagliata viene illustrato come creare ed eseguire il test di un controllo server Web ASP.NET.

In particolare, vengono illustrate le seguenti operazioni:

  • Creare un controllo server Web ASP.NET.

  • Specificare le impostazioni di sicurezza e il comportamento in fase di progettazione aggiungendo metadati al controllo.

  • Specificare un prefisso di tag in un file di configurazione e nell'assembly del controllo.

  • Specificare un'icona da utilizzare per il controllo nella casella degli strumenti di Visual Studio.

  • Compilare il controllo in un assembly e aggiungere un riferimento al progetto per consentirne l'utilizzo in un altro progetto nella stessa soluzione.

  • Eseguire il test del controllo in una pagina Web e accedere alle relative proprietà tramite la finestra Proprietà o IntelliSense.

Come complemento a questo argomento è disponibile una soluzione di Visual Studio con codice sorgente che è possibile scaricare.

Verrà creato un controllo semplice che deriva dal controllo Label standard. Il controllo è denominato WelcomeLabel. Viene aggiunto il nome dell'utente alla stringa di testo definita nella proprietà Text. Se, ad esempio, lo sviluppatore della pagina imposta "Salve" come valore della proprietà Text, il controllo WelcomeLabel restituirà il valore "Salve, NomeUtente!"

Il controllo definisce una proprietà DefaultUserName che specifica il valore relativo al nome utente da utilizzare quando l'utente non è connesso. Ad esempio, se lo sviluppatore della pagina imposta la proprietà Text su "Salve" e la proprietà DefaultUserName su "Guest", il controllo visualizzerà "Salve Guest!" se l'utente non è connesso.

Per creare il controllo server personalizzato

  1. Scegliere Nuovo progetto dal menu File.

    Verrà visualizzata la finestra di dialogo Nuovo progetto.

  2. In Modelli installati espandere Visual Basic o Visual C#, quindi selezionare Web.

  3. Selezionare il modello controllo server ASP.NET.

  4. Immettere ServerControl1 nella casella Nome.

    La finestra di dialogo Nuovo progetto sarà simile alla figura seguente.

    Finestra di dialogo Nuovo progetto
  5. Fare clic su OK.

    In Visual Studio viene creato un progetto di controllo server che dispone di un file di classe denominato ServerControl1.cs o ServerControl1.vb.

  6. In Esplora server rinominare ServerControl1.cs o ServerControl1.vb in WelcomeLabel.cs o WelcomeLabel.vb.

    Verrà visualizzata una finestra di dialogo in cui viene richiesto se si desidera rinominare tutti i riferimenti a ServerControl1, come illustrato nella figura riportata di seguito.

    Ridenominazione di un file e aggiornamento dei riferimenti
  7. Scegliere .

  8. Aprire WelcomeLabel.cs o WelcomeLabel.vb.

  9. Modificare la classe WelcomeLabel in modo che erediti da System.Web.UI.WebControls.Label anziché da System.Web.UI.WebControls.WebControl.

  10. Nell'attributo ToolboxData per la classe WelcomeLabel, impostare la stringa "ServerControl1" su "WelcomeLabel" in entrambe le occorrenze.

  11. Eliminare il codice nella classe WelcomeLabel e inserire una proprietà DefaultUserName e un metodo RenderContents, come illustrato nell'esempio seguente:

    
    using System.Drawing;
    using System;
    using System.Collections.Generic;
    using System.ComponentModel;
    using System.Linq;
    using System.Text;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    
    namespace ServerControl1
    {
        [DefaultProperty("Text")]
        [ToolboxData("<{0}:WelcomeLabel runat=server></{0}:WelcomeLabel>")]
        public class WelcomeLabel : Label
        {
            [
            Bindable(true),
            Category("Appearance"),
            DefaultValue(""),
            Description("The text to display when the user is not logged in."),
            Localizable(true)
            ]
            public virtual string DefaultUserName
            {
                get
                {
                    string s = (string)ViewState["DefaultUserName"];
                    return (s == null) ? String.Empty : s;
                }
                set
                {
                    ViewState["DefaultUserName"] = value;
                }
            }
    
            protected override void RenderContents(HtmlTextWriter writer)
            {
                writer.WriteEncodedText(Text);
    
                string displayUserName = DefaultUserName;
                if (Context != null)
                {
                    string userName = Context.User.Identity.Name;
                    if (!String.IsNullOrEmpty(userName))
                    {
                        displayUserName = userName;
                    }
                }
    
                if (!String.IsNullOrEmpty(displayUserName))
                {
                    writer.Write(", ");
                    writer.WriteEncodedText(displayUserName);
                }
    
                writer.Write("!");
            }
        }
    }
    
    
    
  12. In Esplora soluzioni espandere Proprietà o Progetto e aprire AssemblyInfo.cs o AssemblyInfo.vb.

  13. All'inizio del file aggiungere la riga seguente:

    Using System.Web.UI;
    

    Imports System.Web.UI
    

    Questo spazio dei nomi è obbligatorio per l'attributo TagPrefixAttribute che verrà aggiunto nel passaggio seguente.

  14. Alla fine del file aggiungere la riga seguente:

    [assembly: TagPrefix("ServerControl1", "aspSample")]
    

    <Assembly: TagPrefix("ServerControl1", "aspSample")> 
    

    L'attributo TagPrefixAttribute crea un mapping tra lo spazio dei nomi ServerControl1 e il prefisso aspSample.

  15. Salvare il file WelcomeLabel.cs o WelcomeLabel.vb.

Illustrazione del codice

Nelle sezioni seguenti viene illustrato il codice creato nella procedura precedente.

Eredità dalla classe WebControl

Se il controllo personalizzato esegue il rendering di un elemento dell'interfaccia utente o di qualsiasi altro elemento visibile sul client, è necessario derivarlo dalla classe System.Web.UI.WebControls.WebControl o da una classe derivata da quest'ultima. In questo esempio il controllo personalizzato deriva da Label, che a sua volta deriva da System.Web.UI.WebControls.WebControl. Se il controllo personalizzato esegue il rendering di un elemento che non è visibile nel browser client, come, ad esempio, un elemento nascosto o un elemento meta, è necessario derivarlo da System.Web.UI.Control. La classe WebControl è derivata da Control e contiene proprietà aggiuntive relative allo stile, come Font, ForeColor e BackColor. Inoltre, un controllo derivato da WebControl beneficerà della funzionalità relativa ai temi ASP.NET senza necessità di operazioni aggiuntive da parte dello sviluppatore.

Proprietà DefaultUserName

Il controllo WelcomeLabel definisce una proprietà, DefaultUserName, e utilizza lo stato di visualizzazione per rendere persistente il valore di tale proprietà durante i vari postback. Durante i postback, la pagina viene ricreata e i valori vengono recuperati dallo stato di visualizzazione. Se il valore della proprietà DefaultUserName non fosse stato memorizzato nello stato di visualizzazione, in seguito a ciascun postback verrebbe impostato sul valore predefinito Empty. La proprietà ViewState, ereditata da WebControl, è costituita da un dizionario in cui vengono salvati i valori dei dati. Tali valori sono memorizzati e recuperati utilizzando una chiave di tipo String. In questo caso "DefaultUserName" viene utilizzato come chiave. Il tipo di dati degli elementi del dizionario è Object e quando vi si accede è necessario eseguire il cast al tipo di proprietà effettivo. Per ulteriori informazioni sullo stato di visualizzazione, vedere Cenni preliminari sulla gestione dello stato ASP.NET.

Metodo RenderContents

Il controllo WelcomeLabel scrive il testo nel flusso di risposte eseguendo l'override del metodo RenderContents ereditato. Il parametro passato al metodo RenderContents è un oggetto di tipo HtmlTextWriter, ossia una classe che contiene metodi per eseguire il rendering di HTML.

Si noti che, invece di concatenare le stringhe per poi richiamare il metodo Write, il controllo WelcomeLabel effettua una sequenza di chiamate al metodo Write dell'oggetto HtmlTextWriter. In tal modo si ottengono migliori prestazioni, in quanto l'oggetto HtmlTextWriter consente di scrivere direttamente nel flusso di output. La concatenazione di stringhe richiede tempo e memoria in quanto le stringhe vengono prima create e poi scritte nel flusso.

In generale, quando un controllo personalizzato deriva da WebControl ed esegue il rendering di un singolo elemento, è necessario eseguire l'override del metodo RenderContents, non del metodo Render. Il metodo Render della classe WebControl richiama RenderContents dopo aver eseguito il rendering dei tag di apertura del controllo e dei relativi attributi di stile. Se, per la scrittura del contenuto, si effettua l'override del metodo Render, il controllo personalizzato perderà la logica di rendering dello stile, che è incorporata nel metodo Render della classe WebControl. Per ulteriori informazioni su come eseguire il rendering di un controllo che deriva da WebControl, vedere Esempio di rendering di controlli Web.

Attributi del controllo

Gli attributi applicati al controllo WelcomeLabel e alla proprietà DefaultUserName contengono metadati utilizzati da Common Language Runtime e dagli strumenti in fase di progettazione. A livello di classe WelcomeLabel è contrassegnato dai seguenti attributi:

  • DefaultPropertyAttribute . Si tratta di un attributo della fase di progettazione che specifica la proprietà predefinita di un controllo. Nelle finestre di progettazione visiva, il Visualizzatore proprietà evidenzia generalmente la proprietà predefinita quando si fa clic sul controllo nell'area di progettazione.

  • ToolboxDataAttribute . Specifica la stringa di formato dell'elemento. Quando si fa doppio clic sul controllo nella casella degli strumenti o lo si trascina da questa nell'area di progettazione, la stringa verrà impiegata per la creazione del markup del controllo. Per WelcomeLabel, la stringa consente di creare l'elemento seguente:

    <aspSample:WelcomeLabel runat="server"> </aspSample:WelcomeLabel>
    

Il controllo WelcomeLabel eredita inoltre due attributi dalla classe di base WebControl: ParseChildrenAttribute e PersistChildrenAttribute. Questi attributi vengono applicati come ParseChildren(true) e PersistChildren(false). Gli attributi interagiscono tra loro e con l'attributo ToolboxDataAttribute in modo che gli elementi figlio vengano interpretati come proprietà e le proprietà vengano conservate come attributi.

Attributi della proprietà DefaultUserName

I seguenti attributi applicati alla proprietà DefaultUserName di WelcomeLabel sono attributi della fase di progettazione che in genere si applicano a tutte le proprietà pubbliche dei controlli personalizzati:

  • BindableAttribute . Indica se è appropriato associare la proprietà a dati nelle finestre di progettazione visiva. For example, in Visual Studio, if a property is marked with Bindable(true), the property is displayed in the DataBindings dialog box. Se una proprietà non viene contrassegnata con l'attributo, nel Visualizzatore proprietà si deduce che il valore sia Bindable(false).

  • CategoryAttribute . Indica come categorizzare la proprietà nel Visualizzatore proprietà della finestra di progettazione visiva. Ad esempio, con Category("Appearance") il Visualizzatore proprietà visualizzerà la proprietà nella categoria Aspetto, se lo sviluppatore utilizza la visualizzazione per categorie. È possibile specificare un argomento stringa che corrisponde a una categoria esistente nel Visualizzatore proprietà oppure creare la propria categoria.

  • DescriptionAttribute . Consente di specificare una breve descrizione della proprietà. In Visual Studio il Visualizzatore proprietà consente di visualizzare la descrizione della proprietà selezionata, in genere nella parte inferiore della finestra Proprietà.

  • DefaultValueAttribute . Consente di specificare un valore predefinito per la proprietà. Il valore deve essere uguale al valore predefinito restituito dalla funzione di accesso alla proprietà (metodo Get). In Visual Studio l'attributo DefaultValueAttribute consente a uno sviluppatore di pagine di reimpostare un valore della proprietà sul valore predefinito visualizzando il menu di scelta rapida nella finestra Proprietà e facendo clic sul pulsante Reimposta.

  • LocalizableAttribute . Indica se è rilevante localizzare la proprietà nelle finestre di progettazione visiva. Se una proprietà è contrassegnata con Localizable(true), il relativo valore verrà incluso nella finestra di progettazione visiva quando la proprietà viene serializzata come risorsa. Quando il controllo è sottoposto al polling delle proprietà localizzabili, la finestra di progettazione mantiene il valore della proprietà nel file di risorse indipendente dalle impostazioni cultura o in un'altra risorsa localizzata.

Gli attributi della fase di progettazione applicati a un controllo e ai relativi membri non influiscono sul funzionamento del controllo in fase di esecuzione. Tuttavia, facilitano il lavoro dello sviluppatore quando il controllo viene utilizzato in una finestra di progettazione visiva. Per un elenco completo degli attributi della fase di progettazione e di esecuzione per i controlli server, vedere Attributi di metadati per controlli server personalizzati.

Prefisso del tag

Il prefisso di tag è un prefisso (ad esempio "asp" in <asp:Table />) che viene anteposto al nome del tipo del controllo quando questo viene creato in modo dichiarativo in una pagina. Per consentire l'utilizzo di un controllo in modalità dichiarativa in una pagina, è necessario eseguire il mapping di un prefisso di tag allo spazio dei nomi del controllo. È possibile realizzare il mapping prefisso di tag/spazio dei nomi aggiungendo una direttiva @ Register a ciascuna pagina che utilizza il controllo personalizzato, come illustrato nell'esempio seguente:

<%@ Register Assembly="ServerControl" TagPrefix="aspSample" 
        Namespace="ServerControl"%>

Quando si trascina un controllo server personalizzato dalla casella degli strumenti in una pagina ASPX, in Visual Studio viene automaticamente aggiunta la direttiva Register.

Anziché utilizzare la direttiva @ Register in ogni pagina ASPX, è possibile specificare il mapping prefisso di tag/spazio dei nomi nel file Web.config. Questa opzione risulta utile quando il controllo personalizzato è utilizzato in più pagine dell'applicazione Web. Nell'esempio riportato di seguito viene illustrato un file Web.config in cui si specifica un prefisso di tag per l'assembly ServerControl1.

<?xml version="1.0"?>
<configuration>
  <system.web>    
   <pages>
     <controls>
       <add tagPrefix="aspSample" Assembly="ServerControl" 
         namespace="ServerControl">
       </add>
     </controls>
   </pages>
  </system.web>
</configuration>

Nella procedura seguente si completeranno le attività seguenti:

  • Creare un sito Web che verrà utilizzato per testare il controllo server creato nella procedura precedente.

  • Aggiungere un riferimento nel progetto di sito Web al progetto controllo server.

  • Aggiungere il controllo WelcomeLabel alla Casella degli strumenti

  • Aggiungere un'istanza del controllo WelcomeLabel alla pagina Default.aspx.

  • Eseguire la pagina Default.aspx per verificare il funzionamento del controllo WelcomeLabel.

Innanzitutto, si creerà un sito Web che è possibile utilizzare per i test.

In questa procedura dettagliata viene utilizzato un progetto di sito Web. In alternativa, è possibile utilizzare un progetto di applicazione Web. Per informazioni sulla differenza tra questi tipi di progetto Web, vedere Confronto tra progetti di applicazione Web e progetti di sito Web.

Per creare un progetto di sito Web per eseguire il test del controllo server personalizzato

  1. Scegliere Aggiungi dal menu File, quindi selezionare Nuovo sito Web.

    Verrà visualizzata la finestra di dialogo Nuovo sito Web.

  2. In Modelli installati selezionare Visual Basic o Visual C#, quindi selezionare il modello Sito Web ASP.NET.

  3. Assegnare al sito Web il nome TestWebSite e salvarlo in una nuova cartella all'interno della cartella della soluzione ServerControl1.

    La finestra di dialogo Nuovo sito Web sarà simile alla figura seguente:

    Finestra di dialogo Nuovo sito Web
  4. Fare clic su OK.

    In Visual Studio verrà creato un progetto di sito Web che verrà aggiunto alla soluzione ServerControl1 e verrà aperta la pagina Default.aspx nella visualizzazione Origine.

  5. In Esplora server fare clic con il pulsante destro del mouse sul progetto di sito Web e selezionare Imposta come progetto di avvio.

  6. In Esplora server fare clic con il pulsante destro del mouse sul progetto di sito Web e selezionare Aggiungi riferimento.

    Verrà visualizzata la finestra di dialogo Aggiungi riferimento.

  7. Selezionare la scheda Progetti, il progetto ServerControl1, quindi fare clic su OK. La finestra di dialogo Aggiungi riferimento viene illustrata nella figura seguente:

    Finestra di dialogo Aggiungi riferimento

Il passaggio successivo consiste nell'aggiunta del controllo server alla casella degli strumenti in modo da poterlo utilizzare in una pagina Web nel sito Web di test.

Per aggiungere il controllo WelcomeLabel alla casella degli strumenti

  1. Scegliere Compila soluzione dal menu Compila.

    In Visual Studio verrà compilata la soluzione e l'assembly creato dal progetto ServerControl1 verrà copiato nella cartella Bin del progetto TestWebSite.

  2. Con la pagina Default.aspx ancora aperta, aprire la finestra Casella degli strumenti.

  3. Fare clic con il pulsante destro del mouse in un punto qualsiasi della finestra Casella degli strumenti, quindi scegliere Aggiungi scheda.

  4. Assegnare alla nuova scheda il nome Server Control1.

  5. Fare clic con il pulsante destro del mouse sulla scheda Server Control1, quindi fare clic su Scegli elementi.

  6. Selezionare Sfoglia, quindi passare alla cartella Bin del progetto TestWebSite.

  7. Selezionare ServerControl1.dll, quindi fare clic su Apri.

    L'assembly ServerControl1 verrà aggiunto alla scheda Componenti di .NET Framework della finestra di dialogo Scegli elementi della Casella degli strumenti, come illustrato nella figura seguente:

    Finestra di dialogo Scegli elementi
  8. Scegliere OK.

    Il controllo WelcomeLabel verrà visualizzato nella scheda Server Control1 nella Casella degli strumenti.

È infine possibile aggiungere il controllo server a una pagina Web ed eseguire il test di quest'ultima.

Per eseguire il test del controllo WelcomeLabel

  1. Nella pagina Default.aspx eliminare il testo "ASP.NET" e trascinare al suo posto il controllo WelcomeLabel dalla Casella degli strumenti.

  2. Aggiungere gli attributi Text e DefaultUserName al markup per il controllo WelcomeLabel e impostarlo su "Welcome", come illustrato nell'esempio seguente:

    <aspSample:WelcomeLabel ID="WelcomeLabel1" runat="server" Text="Welcome" DefaultUserName="Guest">
    </aspSample:WelcomeLabel>
    
  3. Premere CTRL-F5 per visualizzare la pagina Web nel browser.

    Nel controllo WelcomeLabel sarà visualizzato "Welcome!", come illustrato nella figura seguente:

    Controllo WelcomeLabel senza nome utente
  4. Fare clic sul collegamento ipertestuale Accedi.

    Verrà visualizzata la pagina Accedi.

  5. Fare clic sul collegamento ipertestuale Registra.

    Verrà visualizzata la pagina Crea nuovo account, come illustrato nella figura seguente.

    Pagina Crea nuovo account
  6. Immettere newuser come nome utente, newuser@asp.net come indirizzo di posta elettronica, immettere una password, quindi fare clic su Crea utente.

    In ASP.NET verrà creato il nuovo account utente, verrà effettuato l'accesso dell'utente come nuovo utente e verrà visualizzata nuovamente la home page. Nel controllo WelcomeLabel è ora visualizzato "Welcome, newuser!", come illustrato nella figura seguente:

    Controllo WelcomeLabel con nome utente

In Visual Studio viene in genere utilizzata un'icona predefinita per visualizzare un controllo nella casella degli strumenti, come illustrato nella figura seguente:

Icona di controllo server predefinito nella Casella degli strumenti

Opzionalmente, è possibile personalizzare l'aspetto del controllo nella casella degli strumenti incorporando una bitmap di 16x16 pixel nell'assembly.

Per specificare un'icona per la casella degli strumenti

  1. Creare una bitmap di 16x16 pixel, o utilizzarne una esistente, per l'icona del controllo da visualizzare della casella di strumenti.

  2. Assegnare alla bitmap il nome WelcomeLabel.bmp.

  3. In Esplora soluzioni fare clic con il pulsante destro del mouse sul progetto ServerControl1, selezionare Aggiungi elemento esistente, quindi il file bitmap.

  4. Nella finestra Proprietà modificare la proprietà Operazione di compilazione per il file bitmap in Risorsa incorporata.

  5. In Esplora soluzioni fare clic con il pulsante destro del mouse sul progetto ServerControl1, quindi selezionare Aggiungi nuovo elemento.

    Verrà visualizzata la finestra di dialogo Aggiungi nuovo elemento.

  6. Selezionare il modello Classe, assegnare al file il nome ResourceFinder.cs o ResourceFinder.vb, quindi fare clic su Aggiungi.

    Verrà aperto il file ResourceFinder.cs o Resourcefinder.vb.

  7. Impostare la classe ResourceFinder su sealed e internal (Friend e NotInheritable in Visual Basic), come illustrato nell'esempio seguente.

    
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    
    namespace ServerControl1
    {
        internal sealed class ResourceFinder
        {
        }
    }
    
    
    
  8. Salvare e chiudere il file.

  9. Aprire il file WelcomeLabel.cs o WelcomeLabel.vb e aggiungere la riga seguente all'inizio del file:

    Using System.Drawing;
    

    Questo spazio dei nomi è obbligatorio per l'attributo ToolboxBitmapAttribute che verrà aggiunto nel passaggio seguente.

  10. Nella classe WelcomeLabel aggiungere l'attributo ToolboxBitmapAttribute e specificare il nome file WelcomeLabel.bmp con il prefisso dello spazio dei nomi ServerControl1, come illustrato nell'esempio seguente:

    [DefaultProperty("Text")]
    [ToolboxData("<{0}:WelcomeLabel runat=server></{0}:WelcomeLabel>")]
    [ToolboxBitmap(typeof(ResourceFinder), "ServerControl1.WelcomeLabel.bmp")]
    public class WelcomeLabel : Label
    
  11. Salvare e chiudere il file.

  12. Scegliere Compila soluzione dal menu Compila.

  13. Nel progetto TestWebSite aprire il file Default.aspx.

  14. Nella Casella degli strumenti fare clic con il pulsante destro del mouse sul controllo WelcomeLabel, quindi selezionare Elimina.

  15. Fare clic con il pulsante destro del mouse sulla scheda Server Control1, quindi fare clic su Scegli elementi.

  16. Selezionare Sfoglia, quindi passare alla cartella Bin del progetto TestWebSite.

  17. Selezionare ServerControl1.dll, quindi fare clic su Apri.

    L'assembly ServerControl1 viene aggiunto alla scheda Componenti di .NET Framework della finestra di dialogo Scegli elementi della Casella degli strumenti.

  18. Scegliere OK nella finestra di dialogo Scegli elementi.

    Il controllo WelcomeLabel verrà visualizzato nuovamente nella scheda Server Control1 nella Casella degli strumenti. L'icona selezionata verrà visualizzata a sinistra del nome WelcomeLabel, come illustrato nella figura seguente.

    Icona di controllo server personalizzato nella Casella degli strumenti

In questa procedura dettagliata si è illustrato come sviluppare un semplice controllo server ASP.NET personalizzato e come utilizzarlo in una pagina. Per ulteriori informazioni, incluse le informazioni sul rendering, la definizione delle proprietà, la gestione delle informazioni sullo stato e di diversi tipi di dispositivi o browser e l'implementazione dei controlli compositi, vedere Sviluppo di controlli server ASP.NET personalizzati.

I controlli complessi come il controllo GridView ottimizzano il lavoro in fase di progettazione perché usano classi di finestre di progettazione visiva che forniscono interfacce utente diverse in fase di progettazione e di esecuzione. Per ulteriori informazioni su come implementare classi di finestre di progettazione personalizzate per i controlli, vedere Cenni preliminari sulle finestre Progettazione controlli ASP.NET.

Aggiunte alla community

AGGIUNGI
Mostra:
© 2014 Microsoft