Effetti

Che cosa sono gli effetti Direct2D?

Puoi usare Direct2D per applicare uno o più effetti di alta qualità a un'immagine o a un set di immagini. Le API degli effetti sono basate su Direct3D 11 e sfruttano le funzionalità GPU per l'elaborazione delle immagini. È possibile concatenare gli effetti in un grafico degli effetti e comporre o combinare l'output degli effetti.

Un effetto Direct2D esegue un'attività di imaging, ad esempio la modifica della luminosità, la deaturazione di un'immagine o la creazione di un'ombreggiatura. Gli effetti possono accettare zero o più immagini di input, esporre più proprietà che ne controllano l'operazione e generare una singola immagine di output.

Ogni effetto crea un grafico di trasformazione interno costituito da singole trasformazioni. Ogni trasformazione rappresenta una singola operazione di immagine. Lo scopo principale di una trasformazione è ospitare gli shader eseguiti per ogni pixel di output. Questi shader possono includere pixel shader, vertex shader, la fase di fusione di una GPU e gli shader di calcolo.

Sia gli effetti predefiniti Direct2D che gli effetti personalizzati che è possibile apportare usando l'API effetti personalizzati funzionano in questo modo.

Ci sono una gamma di effetti predefiniti da categorie come quelle qui. Per un elenco completo, vedere la sezione Effetti predefiniti.

• Filtri
• Composizione e fusione
• Trasparenza
• Color
• Illuminazione e stilizzazione
• Trasformazione e ridimensionamento
• Sources

Puoi applicare effetti a qualsiasi bitmap, tra cui: immagini caricate dal componente Windows Imaging (WIC), primitive disegnate da Direct2D, testo da DirectWrite o scene sottoposte a rendering da Direct3D.

Con effetti Direct2D è possibile scrivere effetti personalizzati che è possibile usare per le applicazioni. Un framework di effetti personalizzato consente di usare funzionalità GPU come pixel shader, vertex shader e unità di fusione. È anche possibile includere altri effetti predefiniti o personalizzati nell'effetto personalizzato. Il framework per la creazione di effetti personalizzati è lo stesso usato per creare gli effetti predefiniti di Direct2D. L'API di creazione degli effetti Direct2D fornisce un set di interfacce per creare e registrare effetti.

Altri argomenti sugli effetti

Il resto di questo argomento illustra le nozioni di base degli effetti Direct2D, ad esempio l'applicazione di un effetto a un'immagine. La tabella qui contiene collegamenti ad argomenti aggiuntivi sugli effetti.

Argomento	Descrizione
Collegamento di effect shader	Direct2D usa un'ottimizzazione denominata collegamento di effect shader che combina il rendering di più effetti del grafico passa in un singolo passaggio.
Effetti personalizzati	Illustra come scrivere effetti personalizzati usando HLSL standard.
Come caricare un'immagine in effetti Direct2D usando FilePicker	Illustra come usare Windows::Storage::P ickers::FileOpenPicker per caricare un'immagine in effetti Direct2D.
Come salvare il contenuto Direct2D in un file di immagine	Questo argomento illustra come usare IWICImageEncoder per salvare il contenuto sotto forma di ID2D1Image in un file di immagine codificato, ad esempio JPEG.
Come applicare effetti alle primitive	Questo argomento illustra come applicare una serie di effetti alle primitive Direct2D e DirectWrite .
Controllo della precisione e del ritaglio numerico nei grafici degli effetti	Le applicazioni che eseguono il rendering degli effetti con Direct2D devono prestare attenzione a ottenere il livello desiderato di qualità e prevedibilità rispetto alla precisione numerica.

Applicazione di un effetto a un'immagine

È possibile usare l'API effetti Direct2D per applicare trasformazioni alle immagini.

Nota

In questo esempio si presuppone che siano già stati creati oggetti ID2D1DeviceContext e IWICBitmapSource. Per altre informazioni sulla creazione di questi oggetti, vedere How to load an image into Direct2D effects using the FilePicker and Devices and Device Contexts (Come caricare un'immagine in effetti Direct2D usando FilePicker e Dispositivi e contesti di dispositivo).

1. Dichiarare una variabile ID2D1Effect e quindi creare un effetto di origine bitmap usando il metodo ID2DDeviceContext::CreateEffect.

       ComPtr<ID2D1Effect> bitmapSourceEffect;
   
       DX::ThrowIfFailed(m_d2dContext->CreateEffect(CLSID_D2D1BitmapSource, &bitmapSourceEffect));
   

2. Impostare la proprietà BitmapSource sull'origine bitmap WIC usando ID2D1Effect ::SetValue.

           DX::ThrowIfFailed(m_bitmapSourceEffect->SetValue(D2D1_BITMAPSOURCE_PROP_WIC_BITMAP_SOURCE, m_wicBitmapSource.Get()));
   

3. Dichiarare una variabile ID2D1Effect e quindi creare l'effetto sfocatura gaussian.

       ComPtr<ID2D1Effect> gaussianBlurEffect;
   
       DX::ThrowIfFailed(m_d2dContext->CreateEffect(CLSID_D2D1GaussianBlur, &gaussianBlurEffect));
   

4. Impostare l'input per ricevere l'immagine dall'effetto di origine bitmap. Impostare la sfocatura del metodo SetValue e la proprietà di deviazione standard.

       gaussianBlurEffect->SetInputEffect(0, bitmapSourceEffect.Get());
   
       DX::ThrowIfFailed(gaussianBlurEffect->SetValue(D2D1_GAUSSIANBLUR_PROP_STANDARD_DEVIATION, 6.0f));
   

5. Usare il contesto del dispositivo per disegnare l'output dell'immagine risultante.

       m_d2dContext->BeginDraw();
   
       m_d2dContext->Clear(D2D1::ColorF(D2D1::ColorF::CornflowerBlue));
   
       // Draw the blurred image.
       m_d2dContext->DrawImage(gaussianBlurEffect.Get());
   
       HRESULT hr = m_d2dContext->EndDraw();
   

   Il metodo DrawImage deve essere chiamato tra le chiamate ID2DDeviceContext::BeginDraw e EndDraw come altre operazioni di rendering Direct2D. DrawImage può acquisire un'immagine o l'output di un effetto ed eseguirne il rendering nella superficie di destinazione.

Trasformazioni spaziali

Direct2D offre effetti predefiniti che possono trasformare le immagini nello spazio 2D e 3D, oltre che nel ridimensionamento. Gli effetti di scala e trasformazione offrono diversi livelli di qualità, ad esempio: vicino più vicino, lineare, lineare, cubico, multi campione lineare, anisotropico e cubico di alta qualità.

Nota

La modalità Anisotropic genera mipmap durante il ridimensionamento, tuttavia, se si imposta la proprietà Cached su true sugli effetti che sono input per la trasformazione i mipmap non verranno generati ogni volta per immagini sufficientemente piccole.

ComPtr<ID2D1Effect> affineTransformEffect;
DX::ThrowIfFailed(m_d2dContext->CreateEffect(CLSID_D2D12DAffineTransform, &affineTransformEffect));

affineTransformEffect->SetInput(0, bitmap.Get());

D2D1_MATRIX_3X2_F matrix = D2D1::Matrix3x2F(0.9f, -0.1f,  0.1f, 0.9f, 8.0f, 45.0f);
DX::ThrowIfFailed(affineTransformEffect->SetValue(D2D1_2DAFFINETRANSFORM_PROP_TRANSFORM_MATRIX, matrix));

m_d2dContext->BeginDraw();
m_d2dContext->DrawImage(affineTransformEffect.Get());
m_d2dContext->EndDraw();

Questo uso dell'effetto di trasformazione affine 2D ruota leggermente la bitmap in senso antiorario.

Prima di
Dopo

Composizione di immagini

Alcuni effetti accettano più input e li compositi in un'unica immagine risultante.

Gli effetti compositi compositi incorporati e aritmetici forniscono varie modalità, per altre info vedi l'argomento composito . L'effetto blend offre diverse modalità con accelerazione GPU disponibili.

ComPtr<ID2D1Effect> compositeEffect;
DX::ThrowIfFailed(m_d2dContext->CreateEffect(CLSID_D2D1Composite, &compositeEffect));

compositeEffect->SetInput(0, bitmap.Get());
compositeEffect->SetInput(1, bitmapTwo.Get());

m_d2dContext->BeginDraw();
m_d2dContext->DrawImage(compositeEffect.Get());
m_d2dContext->EndDraw();

L'effetto composito combina le immagini in diversi modi in base alla modalità specificata.

Regolazioni dei pixel

Esistono alcuni effetti Direct2D predefiniti che consentono di modificare i dati pixel. Ad esempio, l'effetto matrice di colori può essere usato per modificare il colore di un'immagine.

ComPtr<ID2D1Effect> colorMatrixEffect;
DX::ThrowIfFailed(m_d2dContext->CreateEffect(CLSID_D2D1ColorMatrix, &colorMatrixEffect));

colorMatrixEffect->SetInput(0, bitmap.Get());

D2D1_MATRIX_5X4_F matrix = D2D1::Matrix5x4F(0, 0, 1, 0,   0, 1, 0, 0,   1, 0, 0, 0,   0, 0, 0, 1,   0, 0, 0, 0);
DX::ThrowIfFailed(colorMatrixEffect->SetValue(D2D1_COLORMATRIX_PROP_COLOR_MATRIX, matrix));

m_d2dContext->BeginDraw();
m_d2dContext->DrawImage(colorMatrixEffect.Get());
m_d2dContext->EndDraw();

Questo codice accetta l'immagine e modifica il colore come illustrato nelle immagini di esempio qui.

Prima di
Dopo

Per altre informazioni, vedi la sezione effetti predefiniti per i colori.

Grafici degli effetti di compilazione

È possibile concatenare gli effetti per trasformare le immagini. Ad esempio, il codice qui applica un'ombreggiatura e una trasformazione 2D, quindi raggruppa i risultati.

ComPtr<ID2D1Effect> shadowEffect;
ComPtr<ID2D1Effect> affineTransformEffect;
ComPtr<ID2D1Effect> compositeEffect;

DX::ThrowIfFailed(m_d2dContext->CreateEffect(CLSID_D2D1Shadow, &shadowEffect));
DX::ThrowIfFailed(m_d2dContext->CreateEffect(CLSID_D2D12DAffineTransform, &affineTransformEffect));
DX::ThrowIfFailed(m_d2dContext->CreateEffect(CLSID_D2D1Composite, &compositeEffect));

shadowEffect->SetInput(0, bitmap.Get());
affineTransformEffect->SetInputEffect(0, shadowEffect.Get());

D2D1_MATRIX_3X2_F matrix = D2D1::Matrix3x2F::Translation(20, 20));

affineTransformEffect->SetValue(D2D1_2DAFFINETRANSFORM_PROP_TRANSFORM_MATRIX, matrix);

compositeEffect->SetInputEffect(0, affineTransformEffect.Get());
compositeEffect->SetInput(1, bitmap.Get());

m_d2dContext->BeginDraw();
m_d2dContext->DrawImage(compositeEffect.Get());
m_d2dContext->EndDraw();

Questo è il risultato.

Gli effetti accettano oggetti ID2D1Image come input. È possibile usare un ID2D1Bitmap perché l'interfaccia è derivata da ID2D1Image. È anche possibile usare ID2D1Effect::GetOutput per ottenere l'output di un oggetto ID2D1Effect come ID2D1Image o usare il metodo SetInputEffect, che converte automaticamente l'output. Nella maggior parte dei casi un grafico degli effetti è costituito da oggetti ID2D1Effect concatenati direttamente, che semplificano l'applicazione di più effetti a un'immagine per creare oggetti visivi accattivanti.

Per altre informazioni, vedi Come applicare effetti alle primitive .

Argomenti correlati

Esempio di effetti immagine di base Direct2D

Effetti predefiniti