Finestra di progettazione shader

In questo documento viene descritto come utilizzare la finestra di Progettazione shader di Visual Studio per creare, modificare ed esportare gli effetti visivi personalizzati noti con il termine di shader.

È possibile utilizzare Progettazione shader per creare effetti visivi personalizzati per il gioco o applicazione anche se non si conosce la programmazione di HLSL.Per creare uno shader nella finestra di Progettazione shader, è sufficiente disporlo come un grafico, vale a dire si aggiungono dei nodi nell'area di progettazione che rappresentano i dati e le operazioni, quindi li si collega tra loro per definire il modo in cui le operazioni elaborano i dati.A ogni nodo di un'operazione, viene fornita un'anteprima dell'effetto fino a quel momento in modo da poterne visualizzare il risultato.I dati passano attraverso i nodi verso un nodo finale che rappresenta l'output dello shader.

Formati supportati

La finestra di Progettazione shader supporta questi formati di shader:

Introduzione

In questa sezione viene descritto come aggiungere uno shader di DGSL al progetto Visual Studio e vengono fornite informazioni di base introduttivi.

Per aggiungere uno shader di DGSL al progetto

1. In Esplora soluzioni, scegliere dal menu di scelta rapida del progetto a cui aggiungere lo shader e quindi scegliere Aggiungi, Nuovo elemento.

2. Nella finestra di dialogo Aggiungi nuovo elemento, in Installato, Graficaquindi selezionare Visual Effect Graph (.dgsl).

3. Specificare Nome del file di shader e Percorso posizione desiderata da creare.

4. Selezionare il pulsante Aggiungi.

Lo shader predefinito

Ogni volta che si crea uno shader di DGSL, inizia come shader minimo che dispone di un solo nodo Colore punto connesso al nodo Colore finale.Sebbene shader è completo e funzionale, non esegue molto.Di conseguenza, il primo passaggio per creare uno shader funzionante costituisce spesso di eliminare il nodo Colore punto o di disconnetterlo dal nodo Colore finale per creare spazio per altri nodi.

Utilizzo della finestra di Progettazione shader.

Nelle sezioni seguenti viene descritto come utilizzare la finestra di progettazione di shader per l'utilizzo di shader personalizzati.

Barre degli strumenti di Progettazione shader

Le barre degli strumenti della finestra di Progettazione shader contengono i controlli che consentono di lavorare con i grafici di shader DGSL.

I comandi che influiscono sullo stato della finestra di Progettazione shader si trovano nella barra degli strumenti Modalità progettazione shader nella finestra principale di Visual Studio.Gli strumenti e i comandi di progettazione si trovano nella barra degli strumenti della finestra di Progettazione shader nell'area di progettazione.

Di seguito viene riportata la barra degli strumenti Modalità progettazione shader:

In questa tabella vengono descritti gli elementi nella barra degli strumenti Modalità progettazione shader, nell'ordine in cui appaiono da sinistra verso destra.

Elemento della barra degli strumenti	Descrizione
Select	Abilita l'interazione con i nodi e i bordi nel grafico.In questo modo, è possibile selezionare nodi e spostarli o eliminarli e definire i bordi o interromperli.
Dettaglio	Consente lo spostamento di un grafico dello shader relativa alla cornice della finestra.Per visualizzare una panoramica, selezionare un punto sull'area di progettazione e spostarlo intorno. In modalità Seleziona è possibile premere e tenere premuto CTRL per attivare temporaneamente la modalità Panoramica.
Zoom	Consente la visualizzazione di più o meno dettagli del grafico dello shader a seconda della cornice della finestra.In modalità Zoom selezionare un punto nell'area di progettazione, quindi spostarlo a destra o in basso per fare zoom avanti oppure a sinistra o in basso per fare zoom indietro. In modalità Seleziona è possibile premere e tenere premuto CTRL per ingrandire o ridurre utilizzando la rotellina del mouse.
Adatta alla finestra	Viene visualizzato il grafico dello shader completo nella cornice della finestra.
Modalità rendering in tempo reale	Quando è attivato il rendering in tempo reale, in Visual Studio viene ridisegnata l'area di progettazione, anche quando l'utente non ha eseguito alcuna azione.Questa modalità è utile quando si utilizzano gli shader che cambiano nel tempo.
Anteprima con sfera	Una volta abilitata, viene utilizzato un modello di sfera per visualizzare in anteprima lo shader.È possibile abilitare una sola forma di anteprima alla volta.
Anteprima con cubo	Una volta abilitata, viene utilizzato un modello di cubo per visualizzare in anteprima lo shader.È possibile abilitare una sola forma di anteprima alla volta.
Anteprima con cilindro	Una volta abilitata, viene utilizzato un modello di cilindro per visualizzare in anteprima lo shader.È possibile abilitare una sola forma di anteprima alla volta.
Anteprima con cono	Una volta abilitata, viene utilizzato un modello di cono per visualizzare in anteprima lo shader.È possibile abilitare una sola forma di anteprima alla volta.
Anteprima con teiera	Una volta abilitata, viene utilizzato un modello di teiera per visualizzare in anteprima lo shader.È possibile abilitare una sola forma di anteprima alla volta.
Anteprima con piano	Una volta abilitata, viene utilizzato un modello di piano per visualizzare in anteprima lo shader.È possibile abilitare una sola forma di anteprima alla volta.
Casella degli strumenti	In alternativa verrà mostrata o nascosta la finestra Casella degli strumenti.
Proprietà	In alternativa verrà mostrata o nascosta la finestra Proprietà.
Avanzate	Contiene i comandi avanzati e le opzioni. Esportare Consente l'esportazione di uno shader in diversi formati. Esporta come Esporta lo shader come codice sorgente HLSL o come bytecode shader compilato.Per ulteriori informazioni sulle modalità di esportazione degli shader, vedere Procedura: esportare uno shader. Motori grafica Consente la selezione del renderer utilizzato per visualizzare l'area di progettazione. Eseguire il rendering con D3D11 Utilizza Direct3D 11 per eseguire il rendering dell'area di progettazione della finestra di Progettazione shader. Eseguire il rendering con D3D11WARP Utilizza la piattaforma WARP di Direct3D 11 per eseguire il rendering dell'area di progettazione della finestra di Progettazione shader. Visualizzazione Consente la selezione di informazioni aggiuntive sulla finestra di progettazione shader. Frequenza dei fotogrammi Quanto attivata, consente di visualizzare la frequenza dei fotogrammi corrente nell'angolo superiore destro dell'area di progettazione.La frequenza dei fotogrammi è il numero di frame disegnati al secondo. Questa opzione è utile quando si abilita l'opzione Modalità rendering in tempo reale. Suggerimento È possibile scegliere Avanzate per eseguire nuovamente l'ultimo comando.

Utilizzo dei nodi e le connessioni

Utilizzare la modalità di Selezione per aggiungere, rimuovere, riposizionare, connettere e configurare i nodi.Di seguito viene illustrato come eseguire queste operazioni di base:

Per eseguire le operazioni di base in modalità di selezione

• Di seguito viene illustrato come:

  • Per aggiungere un nodo al grafico, selezionarlo in Casella degli strumenti, quindi spostarlo nell'area di progettazione.

  • Per rimuovere un nodo dal grafico, selezionarlo, quindi premere CANC.

  • Per riposizionare un nodo, selezionarlo e spostarlo in una nuova posizione.

  • Per connettere due nodi, spostare un terminale di output di un nodo a un terminale di input dell'altro nodo.Solo i terminali con tipi compatibili possono essere connessi.Una linea tra i terminal mostra la connessione.

  • Per rimuovere una connessione, scegliere Interrompi collegamenti dal menu di scelta rapida per uno dei terminali connessi.

  • Per configurare le proprietà di un nodo, selezionare il nodo, quindi nella finestra Proprietà specificare i nuovi valori per le proprietà.

Visualizzare in anteprima gli shader

Per capire come uno shader apparirà nell'app, è possibile configurare il modo in cui l'effetto viene visualizzato in anteprima.Per creare un'app approssimativa, è possibile scegliere una delle varie forme per il rendering, configurare le trame e altri parametri di materiale, attivare l'animazione degli effetti temporizzati ed esaminare l'anteprima da diverse angolature.

Forme

Nella finestra di Progettazione shader sono disponibili sei forme, una sfera, un cubo, un cilindro, un cono, una teiera e un piano, che è possibile utilizzare per visualizzare in anteprima lo shader.A seconda dello shader, alcune forme potrebbero offrire una migliore anteprima.

Per selezionare una forma in anteprima

• Sulla barra degli strumenti Modalità progettazione shader, selezionare la forma desiderata.

Parametri di trame e materiale

Molti shader si basano sulle trame e proprietà materiali per produrre un aspetto univoco per ogni tipo di oggetto nell'applicazione.Per vedere l'aspetto che avrà lo shader nell'applicazione, è possibile impostare le trame e le proprietà di materiale utilizzate per il rendering dell'anteprima per confrontare le trame e i parametri utilizzabili nell'applicazione.

Per associare una trama differente a un registro di trama o per modificare altri parametri dei materiali

1. In modalità Seleziona selezionare un'area vuota dell'area di progettazione.In questo modo, nella finestra Proprietà vengono visualizzate le proprietà dello shader.

2. Nella finestra Proprietà specificare i nuovi valori per le proprietà di parametro e trama che si desidera modificare.

Di seguito sono riportati i parametri di shader che è possibile modificare:

Effetti temporizzati

Alcuni shader dispongono di un componente temporale che anima l'effetto.Per vedere come apparirà l'effetto, è necessario aggiornare l'anteprima più volte al secondo.Per impostazione predefinita, l'anteprima viene aggiornata solo quando lo shader viene modificato; per modificare questo comportamento in modo da poter visualizzare gli effetti temporizzati, è necessario consentire il rendering in tempo reale.

Per abilitare il rendering in tempo reale

• Sulla barra degli strumenti Progettazione shader, scegliere Rendering in tempo reale.

Esame dell'effetto

Molti shader sono interessati da variabili come la visualizzazione dell'illuminazione angolare o direzionale.Per esaminare il modo in cui l'effetto reagisce al cambiamento di queste variabili, è possibile ruotare liberamente la forma di anteprima e osservare il comportamento dello shader.

Per ruotare la forma

• Premere e tenere premuto ALT e selezionare qualsiasi punto nell'area di progettazione e spostarlo.

Esportazione degli shader

Prima di poter utilizzare uno shader nell'applicazione, è necessario esportarlo in un formato noto a DirectX.

È possibile esportare gli shader come codice sorgente HLSL o come bytecode shader compilato.Il codice sorgente HLSL viene esportato in un file di testo con un'estensione del nome file hlsl.Il bytecode di shader può essere esportato in un file binario non elaborato con estensione di file cso o in un file di intestazione C++ (con estensione h) che codifica il bytecode di shader in una matrice.

Per ulteriori informazioni sulle modalità di esportazione degli shader, vedere Procedura: esportare uno shader.

Tasti di scelta rapida

Argomenti correlati