Condividi tramite

Effetti

  • Articolo

Quali sono gli effetti Direct2D?

È possibile 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 effetto e comporre o combinare l'output degli effetti.

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

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

Sia gli effetti predefinitiDirect2D che gli effetti personalizzati che è possibile usare l'API effetti personalizzati funzionano in questo modo.

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

È possibile applicare effetti a qualsiasi bitmap, tra cui: immagini caricate dal componente WIC (Windows Imaging Component), 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, ad esempio pixel shader, vertex shader e l'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 dell'autore degli effetti Direct2D fornisce un set di interfacce per creare e registrare gli 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 altri argomenti sugli effetti.

Argomento Descrizione
Collegamento di Effect Shader
 Direct2D usa un'ottimizzazione denominata collegamento di effetto shader che combina il rendering di più grafici effetti 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 negli 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 effetti usando Direct2D devono prestare attenzione a ottenere il livello desiderato di qualità e stimabilità 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 Come caricare un'immagine in effetti Direct2D usando FilePicker e Dispositivi e Contesti del 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 l'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 blur gaussian .

        ComPtr<ID2D1Effect> gaussianBlurEffect;

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

  4. Impostare l'input per ricevere l'immagine dall'effetto origine bitmap. Impostare la quantità di 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ò accettare un'immagine o l'output di un effetto e eseguirne il rendering nell'area di destinazione.

Trasformazioni spaziali

Direct2D offre effetti predefiniti che possono trasformare le immagini nello spazio 2D e 3D, oltre a ridimensionare. Gli effetti di scalabilità e trasformazione offrono vari livelli di qualità, ad esempio il vicino più vicino, lineare, lineare, cubo, multi-campione, anisotropico e cubo di alta qualità.

Nota

La modalità anisotropica genera mipmap durante il ridimensionamento, tuttavia, se si imposta la proprietà Cache su true sugli effetti che vengono inseriti nella trasformazione le mipmap non verranno generate 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 antiorario.

Prima
Effetto affine 2d prima dell'immagine.
After
Effetto affine 2d dopo l'immagine.

Composizione di immagini

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

Gli effetti compositi e aritmetici predefiniti forniscono varie modalità, per altre informazioni, vedere l'argomento composito . L'effetto blend ha diverse modalità accelerate della 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 immagini in diversi modi in base alla modalità specificata.

Regolazioni pixel

Esistono alcuni effetti Direct2D predefiniti che consentono di modificare i dati dei pixel. Ad esempio, l'effetto matrice di colore 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
effetto matrice di colore prima dell'immagine.
After
effetto matrice di colori dopo l'immagine.

Per altre informazioni, vedere la sezione effetti predefiniti del colore .

Grafici degli effetti predefiniti

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

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();

Risultato:

output dell'effetto shadow.

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

Per altre informazioni, vedere Come applicare effetti alle primitive .

Esempio di effetti di immagine di base Direct2D

Effetti predefiniti