Effets
Que sont les effets Direct2D ?
Vous pouvez utiliser Direct2D pour appliquer un ou plusieurs effets de haute qualité à une image ou à un ensemble d’images. Les API d’effets sont basées sur Direct3D 11 et tirent parti des fonctionnalités GPU pour le traitement d’images. Vous pouvez chaîner des effets dans un graphique d’effets et composer ou fusionner la sortie des effets.
Un effet Direct2D effectue une tâche d’imagerie, comme la modification de la luminosité, la désaturation d’une image ou la création d’une ombre portée. Les effets peuvent accepter zéro ou plusieurs images d’entrée, exposer plusieurs propriétés qui contrôlent leur fonctionnement et générer une seule image de sortie.
Chaque effet crée un graphique de transformation interne composé de transformations individuelles. Chaque transformation représente une seule opération d’image. L’objectif main d’une transformation est de loger les nuanceurs exécutés pour chaque pixel de sortie. Ces nuanceurs peuvent inclure des nuanceurs de pixels, des nuanceurs de vertex, l’étape de fusion d’un GPU et des nuanceurs de calcul.
Les effets intégrésDirect2D et les effets personnalisés que vous pouvez faire à l’aide de l’API d’effets personnalisés fonctionnent de cette façon.
Il existe une gamme d’effets intégrés de catégories comme celles-ci . Pour obtenir la liste complète, consultez la section Effets intégrés.
- Filtrage
- Composition et fusion
- Transparence
- Color
- Éclairage et stylisation
- Transformation et mise à l’échelle
- Sources
Vous pouvez appliquer des effets à n’importe quelle bitmap, y compris les images chargées par le composant d’acquisition d’images Windows (WIC), les primitives dessinées par Direct2D, le texte de DirectWrite ou les scènes rendues par Direct3D.
Avec les effets Direct2D, vous pouvez écrire vos propres effets que vous pouvez utiliser pour vos applications. Une infrastructure d’effets personnalisés vous permet d’utiliser des fonctionnalités GPU telles que les nuanceurs de pixels, les nuanceurs de vertex et l’unité de fusion. Vous pouvez également inclure d’autres effets intégrés ou personnalisés dans votre effet personnalisé. L’infrastructure de création d’effets personnalisés est la même que celle utilisée pour créer les effets intégrés de Direct2D. L’API auteur d’effet Direct2D fournit un ensemble d’interfaces pour créer et inscrire des effets.
Autres rubriques sur les effets
Le reste de cette rubrique explique les principes de base des effets Direct2D, comme l’application d’un effet à une image. Le tableau ci-dessous contient des liens vers des rubriques supplémentaires sur les effets.
| Rubrique | Description |
|---|---|
| Liaison de nuanceurs d’effet |
Direct2D utilise une optimisation appelée liaison de nuanceur d’effet qui combine plusieurs passes de rendu de graphe à effet en un seul passage. |
| Effets personnalisés |
Montre comment écrire vos propres effets personnalisés à l’aide de HLSL standard. |
| Comment charger une image dans Direct2D Effects à l’aide de FilePicker |
Montre comment utiliser Windows::Storage::P ickers::FileOpenPicker pour charger une image dans des effets Direct2D. |
| Guide pratique pour enregistrer le contenu Direct2D dans un fichier image |
Cette rubrique montre comment utiliser IWICImageEncoder pour enregistrer du contenu sous la forme d’un ID2D1Image dans un fichier image encodé tel que JPEG. |
| Comment appliquer des effets aux primitives |
Cette rubrique montre comment appliquer une série d’effets à Direct2D et DirectWrite primitives. |
| Contrôle de la précision et du découpage numérique dans les graphiques à effet |
Les applications qui affichent des effets à l’aide de Direct2D doivent veiller à atteindre le niveau de qualité et de prévisibilité souhaité en ce qui concerne la précision numérique. |
Application d’un effet à une image
Vous pouvez utiliser l’API effets Direct2D pour appliquer des transformations aux images.
Notes
Cet exemple suppose que vous avez déjà créé des objets ID2D1DeviceContext et IWICBitmapSource . Pour plus d’informations sur la création de ces objets, consultez Comment charger une image dans des effets Direct2D à l’aide du FilePicker et des périphériques et des contextes d’appareil.
Déclarez une variable ID2D1Effect , puis créez un effet source bitmap à l’aide de la méthode ID2DDeviceContext::CreateEffect .
ComPtr<ID2D1Effect> bitmapSourceEffect; DX::ThrowIfFailed(m_d2dContext->CreateEffect(CLSID_D2D1BitmapSource, &bitmapSourceEffect));Définissez la propriété BitmapSource sur la source bitmap WIC à l’aide de l’ID2D1Effect::SetValue.
DX::ThrowIfFailed(m_bitmapSourceEffect->SetValue(D2D1_BITMAPSOURCE_PROP_WIC_BITMAP_SOURCE, m_wicBitmapSource.Get()));Déclarez une variable ID2D1Effect , puis créez l’effet de flou gaussien .
ComPtr<ID2D1Effect> gaussianBlurEffect; DX::ThrowIfFailed(m_d2dContext->CreateEffect(CLSID_D2D1GaussianBlur, &gaussianBlurEffect));Définissez l’entrée pour recevoir l’image à partir de l’effet source bitmap. Définissez la quantité de flou la méthode SetValue et la propriété d’écart type.
gaussianBlurEffect->SetInputEffect(0, bitmapSourceEffect.Get()); DX::ThrowIfFailed(gaussianBlurEffect->SetValue(D2D1_GAUSSIANBLUR_PROP_STANDARD_DEVIATION, 6.0f));Utilisez le contexte de l’appareil pour dessiner la sortie de l’image obtenue.
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();La méthode DrawImage doit être appelée entre les appels ID2DDeviceContext::BeginDraw et EndDraw comme d’autres opérations de rendu Direct2D. DrawImage peut prendre une image ou la sortie d’un effet et la restituer à la surface cible.
Transformations spatiales
Direct2D fournit des effets intégrés qui peuvent transformer des images dans un espace 2D et 3D, ainsi que la mise à l’échelle. Les effets de mise à l’échelle et de transformation offrent différents niveaux de qualité tels que : voisin le plus proche, linéaire, cubique, linéaire à plusieurs échantillons, anisotrope et cube de haute qualité.
Notes
Le mode anisotrope génère des mipmaps lors de la mise à l’échelle. Toutefois, si vous définissez la propriété Mise en cache sur true sur les effets qui sont entrés dans la transformation, les mipmaps ne seront pas générés à chaque fois pour des images suffisamment petites.
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();
Cette utilisation de l’effet de transformation affine 2D fait pivoter légèrement la bitmap dans le sens inverse des aiguilles d’une montre.
| Avant |
|---|
 |
| After |
 |
Composition d’images
Certains effets acceptent plusieurs entrées et les compositent dans une image résultante.
Les effets composites et arithmétiques intégrés fournissent différents modes. Pour plus d’informations, consultez la rubrique composite . L’effet de fusion dispose d’une variété de modes d’accélération GPU disponibles.
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’effet composite combine les images de différentes manières en fonction du mode que vous spécifiez.
Ajustements de pixels
Il existe quelques effets Direct2D intégrés qui vous permettent de modifier les données de pixels. Par exemple, l’effet de matrice de couleur peut être utilisé pour modifier la couleur d’une image.
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();
Ce code prend l’image et modifie la couleur comme indiqué dans les exemples d’images ici.
| Avant |
|---|
|
| After |
 |
Pour plus d’informations, consultez la section effets intégrés de couleur .
Création de graphiques d’effet
Vous pouvez chaîner des effets pour transformer des images. Par exemple, le code applique ici une ombre et une transformation 2D, puis combine les résultats.
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();
Voici le résultat.
Les effets prennent les objets ID2D1Image en tant qu’entrée. Vous pouvez utiliser un ID2D1Bitmap , car l’interface est dérivée d’ID2D1Image. Vous pouvez également utiliser ID2D1Effect::GetOutput pour obtenir la sortie d’un objet ID2D1Effect en tant qu’ID2D1Image ou utiliser la méthode SetInputEffect , qui convertit la sortie pour vous. Dans la plupart des cas, un graphique d’effets se compose d’objets ID2D1Effect directement chaînés ensemble, ce qui facilite l’application de plusieurs effets à une image pour créer des visuels attrayants.
Pour plus d’informations, consultez Comment appliquer des effets aux primitives .
Rubriques connexes
Commentaires
Bientôt disponible : tout au long de 2024, nous allons éliminer progressivement GitHub Issues comme mécanisme de commentaires pour le contenu et le remplacer par un nouveau système de commentaires. Pour plus d'informations, consultez : https://aka.ms/ContentUserFeedback.
Envoyer et afficher des commentaires pour