Modello MVC personalizzato

di Jacques Eloff

La versione di MVC 3 Tools Update per Visual Studio 2010 ha introdotto una procedura guidata di progetto separata per i progetti MVC. Il cambiamento è stato determinato da due fattori. In primo luogo, l'introduzione di nuovi modelli in MVC 3 e il supporto per motori di visualizzazione aggiuntivi, ad esempio Razor, comportano un sovraffollamento della finestra di dialogo Nuovo progetto in Visual Studio. In secondo luogo, i clienti avevano chiesto punti di estendibilità e la creazione guidata del nuovo progetto MVC ci avrebbe permesso di rispondere a queste richieste.

L'aggiunta di modelli personalizzati era un processo difficile che si basava sull'uso del Registro di sistema per rendere visibili i nuovi modelli alla procedura guidata del progetto MVC. L'autore di un nuovo modello doveva eseguire il wrapping all'interno di un'identità del servizio gestito per assicurarsi che le voci del Registro di sistema necessarie vengano create al momento dell'installazione. L'alternativa consiste nel rendere disponibile un file ZIP contenente il modello e l'utente finale crea manualmente le voci del Registro di sistema necessarie.

Nessuno degli approcci indicati sopra è ideale, quindi abbiamo deciso di sfruttare alcune delle estensioni VSIX esistenti per semplificare la creazione, la distribuzione e l'installazione di modelli MVC personalizzati a partire da MVC 4 per Visual Studio 2012. Ecco alcuni dei vantaggi offerti da questo approccio:

• Un'estensione VSIX può contenere più modelli che supportano linguaggi diversi (C# e Visual Basic) e più motori di visualizzazione (ASPX e Razor).
• Un'estensione VSIX può avere come destinazione più SKU di Visual Studio, inclusi gli SKU Express.
• Visual Studio Gallery facilita la distribuzione dell'estensione a un ampio pubblico.
• Le estensioni VSIX possono essere aggiornate rendendo più semplice creare correzioni e aggiornamenti ai modelli personalizzati.

Prerequisiti

• Gli utenti devono avere familiarità con la creazione di modelli di progetto, incluso il markup necessario per i file vstemplate e così via.
• Gli utenti dovranno avere Visual Studio Professional e versioni successive installate. Gli SKU Express non supportano la creazione di progetti VSIX.
• Visual Studio 2012 SDK installato.

Esempio

Il primo passaggio consiste nel creare un nuovo progetto VSIX usando C# o Visual Basic. Selezionare File > Nuovo progetto, quindi fare clic su Estendibilità nel riquadro sinistro e selezionare il progetto VSIX.

Dopo aver creato il progetto, verrà aperta la finestra di progettazione VSIX.

La finestra di progettazione può essere usata per modificare alcune delle proprietà generali dell'estensione che verranno visualizzate agli utenti quando installano l'estensione o esplorano le estensioni installate in Visual Studio (estensioni degli strumenti > e Aggiornamenti). Dopo aver completato le informazioni generali, fare clic sulla scheda Installa destinazioni.

Questa scheda viene usata per specificare gli SKU e le versioni di Visual Studio supportati dall'estensione. Selezionare la casella di controllo This VSIX is installed for all users to enable per-machine installs of the VSIX .Select the checkbox for This VSIX is installed for all users to enable per-machine installs of the VSIX. Fare clic sul pulsante Nuovo a destra per aggiungere altri SKU, ad esempio Web Developer Express (VWD).

Se si prevede di supportare tutti gli SKU Professional e superiori (Professional, Premium e Ultimate) è sufficiente selezionare lo SKU minimo nella famiglia, Microsoft.VisualStudio.Pro. Ricordarsi di salvare tutte le modifiche dopo aver completato le destinazioni di installazione.

La scheda Asset viene usata per aggiungere tutti i file di contenuto a VSIX. Poiché MVC richiede metadati personalizzati, si modificherà il codice XML non elaborato del file manifesto VSIX anziché usare la scheda Asset per aggiungere contenuto. Per iniziare, aggiungere il contenuto del modello al progetto VSIX. È importante che la struttura della cartella e il contenuto rispecchiano il layout del progetto. L'esempio seguente contiene quattro modelli di progetto derivati dal modello di progetto MVC di base. Assicurarsi che tutti i file che costituiscono il modello di progetto (tutti gli elementi sottostanti la cartella ProjectTemplates) vengano aggiunti al gruppo di elementi Contenuto nel file di progetto VSIX e che ogni elemento contenga il set di metadati CopyToOutputDirectory e IncludeInVsix , come illustrato nell'esempio seguente.

<Content Include="ProjectTemplates\MyMvcWebApplicationProjectTemplate.csaspx\BasicWeb.config">

<CopyToOutputDirectory>Always</CopyToOutputDirectory>

<IncludeInVSIX>true</IncludeInVSIX>

</Contenuto>

In caso contrario, l'IDE tenterà di compilare il contenuto del modello quando si compila VSIX e probabilmente verrà visualizzato un errore. I file di codice nei modelli spesso contengono parametri di modello speciali usati da Visual Studio quando viene creata un'istanza del modello di progetto e pertanto non possono essere compilati nell'IDE.

Chiudere la finestra di progettazione VSIX, quindi fare clic con il pulsante destro del mouse sul file source.extension.manifest in Esplora soluzioni e scegliere Apri con e scegliere l'opzione Editor XML (testo).

Creare un <elemento Assets> e aggiungere un <elemento Asset> per ogni file che deve essere incluso in VSIX. L'attributo Type di ogni <elemento Asset> deve essere impostato su Microsoft.VisualStudio.Mvc.Template. Si tratta di uno spazio dei nomi personalizzato che riconosce solo la procedura guidata del progetto MVC. Per altre informazioni sulla struttura e sul layout del file manifesto, vedere la documentazione dello schema VSIX 2.0.

L'aggiunta di file a VSIX non è sufficiente per registrare i modelli con la procedura guidata MVC. È necessario fornire informazioni quali il nome del modello, la descrizione, i motori di visualizzazione supportati e il linguaggio di programmazione per la procedura guidata MVC. Queste informazioni vengono fornite in attributi personalizzati associati all'elemento <Asset> per ogni file vstemplate .

<Asset d:VsixSubPath="ProjectTemplates\MyMvcWebApplicationProjectTemplate.csaspx"

Type="Microsoft.VisualStudio.Mvc.Template"

d:Source="File"

Path="ProjectTemplates\MyMvcWebApplicationProjectTemplate.csaspx\BasicMvcWebApplicationProjectTemplate.11.csaspx.vstemplate"

ProjectType="MVC"

Language="C#"

ViewEngine="Aspx"

TemplateId="MyMvcApplication"

Title="Applicazione Web di base personalizzata"

Description="Modello personalizzato derivato da un'applicazione Web MVC di base (Razor)"

Version="4.0"/>

Di seguito è riportata una spiegazione degli attributi personalizzati che devono essere presenti:

• ProjectType deve essere impostato su MVC.
• Il linguaggio designa il linguaggio di sviluppo supportato dal modello. I valori validi sono C# o VB.
• ViewEngine designa il motore di visualizzazione supportato dal modello, ad esempio Aspx o Razor. È possibile specificare un valore personalizzato per questo campo.
• TemplateId viene usato per raggruppare i modelli. Se il valore corrisponde a un ID modello esistente, verrà eseguito l'override dei modelli registrati in precedenza con la procedura guidata MVC.
• Titolo indica la breve descrizione visualizzata nella procedura guidata MVC sotto ogni modello di progetto.
• La descrizione definisce una descrizione più dettagliata del modello.

Dopo aver aggiunto tutti i file al manifesto e averla salvata, si noterà che la scheda Asset nella finestra di progettazione visualizzerà tutti i file, ma non gli attributi personalizzati aggiunti agli <elementi Asset> per i file vstemplate .

Tutto ciò che rimane ora consiste nel compilare il progetto VSIX e installarlo.

Assicurarsi che tutte le istanze di Visual Studio siano chiuse nel computer in cui si intende testare l'estensione VSIX. Visual Studio analizza le nuove estensioni durante l'avvio, quindi se l'IDE è aperto durante l'installazione di un VSIX, è necessario riavviare Visual Studio. In Esplora risorse fare doppio clic sul file VSIX per avviare il programma di installazione VSIX, fare clic su Installa e quindi avviare Visual Studio.

Dal menu selezionare Strumenti > estensioni e Aggiornamenti per verificare che l'estensione sia stata installata. Se il programma di installazione VSIX ha segnalato errori durante l'installazione dell'estensione, è possibile visualizzare il log del programma di installazione VSIX per altre informazioni. Il log viene in genere creato nella cartella %temp% dell'utente che ha installato l'estensione, ad esempio C:\Users\Bob\AppData\Local\Temp.

Dopo aver chiuso la finestra è possibile creare un progetto MVC 4 per verificare se i nuovi modelli vengono visualizzati nella procedura guidata MVC.

Limitazioni

1. La procedura guidata MVC non supporta modelli personalizzati localizzati.
2. Se non riesce a individuare modelli personalizzati, la procedura guidata non segnala errori. Se uno degli attributi personalizzati necessari è assente, il modello verrà semplicemente escluso dalla procedura guidata.