Visualizzazione Progettazione

Articolo
09/12/2008

Aggiornamento: novembre 2007

Nella visualizzazione Progettazione vengono visualizzati pagine Web ASP.NET, pagine master, pagine di contenuti, pagine HTML e controlli utente tramite una visualizzazione analoga a quella WYSIWYG. La visualizzazione Progettazione consente di aggiungere testo ed elementi, di posizionarli e ridimensionarli, nonché di impostarne le proprietà utilizzando menu speciali o la finestra Proprietà.

Quando vengono aggiunti elementi alla pagina, in Visual Web Developer viene creato markup corrispondente che può essere anche modificato nella visualizzazione Origine. Per informazioni, vedere Visualizzazione Origine.

Per passare alla visualizzazione Progettazione, scegliere la scheda Progettazione nella parte inferiore della finestra di progettazione HTML.

Nota:
La visualizzazione Progettazione consente di visualizzare solo il corpo del documento, ossia la parte tra i tag <body> e </body>. Sebbene sia possibile modificare alcune proprietà dell'elemento head, ad esempio il titolo del documento, utilizzando la finestra Proprietà documento, è necessario passare alla visualizzazione Origine per modificare le proprietà degli elementi che non fanno parte dell'elemento body.

La visualizzazione Progettazione consente di visualizzare solo il corpo del documento, ossia la parte tra i tag <body> e </body>. Sebbene sia possibile modificare alcune proprietà dell'elemento head, ad esempio il titolo del documento, utilizzando la finestra Proprietà documento, è necessario passare alla visualizzazione Origine per modificare le proprietà degli elementi che non fanno parte dell'elemento body.

Differenze tra la visualizzazione Progettazione e la visualizzazione in un browser Web

La visualizzazione Progettazione consente di visualizzare in modo analogo alla visualizzazione di modifica WYSIWYG l'aspetto della pagina in un browser. Tuttavia, nella visualizzazione Progettazione la pagina non corrisponde esattamente al risultato del rendering, ed è pertanto necessario controllare la pagina in un browser (o in più browser) per assicurarsi che venga visualizzata nel modo desiderato.

Un documento visualizzato in visualizzazione Progettazione differisce da uno visualizzato in un browser Web per i seguenti aspetti:

È possibile modificare l'area di progettazione.
Alcuni elementi come, ad esempio, i controlli origine, vengono visualizzati nella visualizzazione Progettazione a scopo di modifica, ma il rendering non viene eseguito nel browser. Per la maggior parte dei controlli che vengono visualizzati solamente durante la fase di modifica, il rendering viene eseguito come caselle di colore grigio nella visualizzazione Progettazione.
Alcuni tipi di formattazione di carattere e paragrafo possono essere visualizzati in modo differente rispetto a un browser specifico, se il browser Web implementa la formattazione in modo diverso rispetto alla visualizzazione Progettazione.
Facoltativamente, è possibile visualizzare con l'editor le caselle di visualizzazione, i simboli e le icone per contrassegnare i controlli server. Per informazioni, vedere Visualizzazione, Finestra di progettazione HTML, finestra di dialogo Opzioni.
I collegamenti ipertestuali non sono funzionanti.
Non è possibile eseguire gli script client.
Il codice server non viene eseguito.
Negli elementi che supportano testo alternativo, come le immagini, non viene visualizzato il testo alternativo nelle descrizioni comandi quando si posiziona il puntatore del mouse su di essi.

Visualizzazione di elementi invisibili

La visualizzazione Progettazione consente di visualizzare alcuni elementi, quali i campi nascosti, che generalmente non sono visibili nel browser, per facilitare la modifica della pagina. Inoltre, la visualizzazione Progettazione consente di visualizzare riquadri grigi e altre rappresentazioni dei controlli server ASP.NET, ad esempio controlli origine, che non eseguono il rendering di codice in fase di esecuzione.

È anche possibile scegliere di visualizzare i bordi e i simboli che possono facilitare l'esecuzione delle operazioni relative a elementi e tag nella pagina. Per informazioni, vedere Procedura: visualizzare informazioni nascoste in visualizzazione Progettazione.

Visualizzazione di caratteri null

Quando si utilizza un modello che contiene un carattere null, i caratteri che seguono il carattere null vengono troncati nella visualizzazione Progettazione. I dati non vengono persi, ma i caratteri che seguono un carattere null in un modello non vengono visualizzati nella visualizzazione Progettazione.

Posizionamento di elementi in visualizzazione Progettazione

Gli elementi nella pagina vengono fisicamente disposti dall'alto verso il basso. Per impostazione predefinita, quando viene eseguito il rendering della pagina nel browser, il rendering degli elementi viene eseguito seguendo lo stesso ordine, dall'alto verso il basso. È anche possibile posizionare gli elementi bidimensionali utilizzando coordinate orizzontali e verticali nella pagina. Questa opzione di layout usufruisce delle opzioni di posizionamento disponibili tramite gli stili. Per informazioni, vedere Posizionamento di elementi nella visualizzazione Progettazione.

Spostamenti nella visualizzazione Progettazione

Per facilitare lo spostamento tra elementi e la relativa selezione, la visualizzazione Progettazione fornisce le seguenti opzioni:

Struttura tag. La struttura tag consente di visualizzare l'elemento corrente nonché la gerarchia dei tag padre a cui appartiene. È possibile utilizzare la struttura tag per visualizzare gli elementi con stato attivo e per spostarsi dall'elemento corrente a un elemento più in alto nella gerarchia. Per informazioni dettagliate, vedere Spostamento tra i tag dell'editor HTML in Visual Web Developer.
Struttura documento. La finestra Struttura documento consente di individuare e selezionare tutti gli elementi di un documento, inclusi quelli non visualizzati. Per informazioni dettagliate, vedere Procedura: spostarsi all'interno dell'editor HTML in Visual Web Developer.
Finestra Proprietà. Quando viene selezionato un elemento dall'elenco a discesa nella parte superiore della finestra Proprietà, l'elemento nel documento viene selezionato dall'editor.

Aggiunta di elementi

Nella visualizzazione Progettazione, è possibile aggiungere elementi a una pagina in tre modi:

Trascinandoli dalla Casella degli strumenti.
Facendo doppio clic sull'elemento nella Casella degli strumenti, per inserire così l'elemento nella posizione corrente del punto di inserimento nel documento.
Trascinandoli da un altro documento aperto in Visual Web Developer.
Trascinandoli da Esplora soluzioni. Questo metodo viene utilizzato soprattutto per aggiungere nella pagina controlli utente e riferimenti a fogli di stile.
Digitare il testo direttamente nella pagina.

Smart tag nella visualizzazione Progettazione

Nella visualizzazione Progettazione, molti controlli server ASP.NET visualizzano uno smart tag che consente di accedere rapidamente alle impostazioni e alle azioni utilizzate più di frequente per la configurazione del controllo. Per impostazione predefinita, lo smart tag viene visualizzato quando viene aggiunto un controllo alla pagina per la prima volta. È anche possibile visualizzare uno smart tag in qualsiasi momento, utilizzando il menu di scelta rapida o scegliendo il relativo simbolo.

Espressioni nella visualizzazione Progettazione

Nella visualizzazione Progettazione non è possibile utilizzare la finestra Proprietà per modificare i valori dell'espressione. Ad esempio, se si assegna un'espressione a un controllo nella visualizzazione Origine, non è possibile modificare il valore di tale espressione nella visualizzazione Progettazione. Poiché il valore dell'espressione è calcolato, è necessario utilizzare la visualizzazione Origine per modificare l'espressione.

Aggiornamento della finestra di progettazione

Quando si passa dalla visualizzazione Origine alla visualizzazione Progettazione, può essere necessario aggiornare la finestra di progettazione per visualizzare determinati tipi di modifiche ai file. Ad esempio, il codice del tema viene analizzato, non compilato; pertanto, tutte le modifiche apportate al codice del tema nella visualizzazione Origine richiedono l'aggiornamento per essere visualizzate nella finestra di progettazione.

Per aggiornare la finestra di progettazione, è possibile eseguire una delle seguenti operazioni:

Fare doppio clic nella finestra di progettazione e scegliere Aggiorna.
Dal menu Visualizza, scegliere Aggiorna.

Vedere anche

Condividi tramite