Direct2D custom image effects sample
Shows how to implement custom Direct2D effects using HLSL pixel, vertex, and compute shaders.
Note: This sample is part of a large collection of UWP feature samples. If you are unfamiliar with Git and GitHub, you can download the entire collection as a ZIP file, but be sure to unzip everything to access shared dependencies. For more info on working with the ZIP file, the samples collection, and GitHub, see Get the UWP samples from GitHub. For more samples, see the Samples portal on the Windows Dev Center.
Specifically, this sample shows how to:
- Define the effect's properties, metadata and implement required interfaces
- Author HLSL that conforms to Direct2D requirements, including opting into effect shader linking
- Register and use a custom effect in an app
Note The Windows universal samples require Visual Studio 2017 to build and Windows 10 to execute.
To obtain information about Windows 10 development, go to the Windows Dev Center
To obtain information about Microsoft Visual Studio and the tools for developing Windows apps, go to Visual Studio
Sample project files
This sample contains three separate projects, demonstrating a custom pixel, vertex, and compute shader effect. Each project has a similar set of files that follow the same pattern.
Custom Direct2D effect implementation
The following files are the core effect implementation, i.e. the main educational content of the sample:
- *.hlsl: The core shader routines that operate on image data. These are written using standard HLSL with some helper Direct2D intrinsics that enable the custom effect to take advantage of shader linking.
- *Effect.cpp/.h, *Transform.cpp/.h: Implementation of the Direct2D effect interfaces, e.g. ID2D1EffectImpl. This code is called by the Direct2D renderer to setup and control the effect shader operation.
A custom Direct2D effect does nothing on its own, as it must be loaded and executed by a calling app. The following files provide a simple demo environment to exercise the effect:
- *Main.cpp/.h, *Renderer.cpp/.h
DirectX SDK sample common files
The following files provide common functionality needed by DirectX SDK samples:
- DeviceResources.cpp/.h: Manages creation and lifetime of the core Direct3D and Direct2D device-dependent resources. Handles cases such as device lost and window size and orientation changes.
- DirectXHelper.h: Common inline helper functions, including ThrowIfFailed which converts HRESULT-based APIs into an exception model.
- BasicReaderWriter.cpp/.h: Basic file I/O functionality, needed for things like loading shaders, textures and geometry.
- SampleOverlay.cpp/.h: Renders the Windows SDK overlay badge on top of sample content.
- BasicTimer.cpp/.h: Wraps QueryPerformanceCounter to provide an accurate, low-overhead timer.
All DX SDK samples and the Visual Studio template DX project contain a version of these files (some are not always needed). These common files demonstrate important best practices for DX UWP apps, and you are encouraged to use them in your own projects.
C++ UWP common files
Variants of the following files are found in every UWP app written in C++:
Direct2D effects: provides built-in effects and the ability to create custom effects.
Direct2D: used to render images, primitives, and text.
Windows Imaging Component (WIC): used to load, scale, and convert the images.
Custom effect interfaces:
Related DirectX app APIs:
Client: Windows 10
Server: Windows Server 2016 Technical Preview
Phone: Windows 10
Build the sample
- If you download the samples ZIP, be sure to unzip the entire archive, not just the folder with the sample you want to build.
- Start Microsoft Visual Studio 2017 and select File > Open > Project/Solution.
- Press Ctrl+Shift+B, or select Build > Build Solution.
Run the sample
The next steps depend on whether you just want to deploy the sample or you want to both deploy and run it.
Deploying the sample
- Select Build > Deploy Solution.
Deploying and running the sample
- To debug the sample and then run it, press F5 or select Debug > Start Debugging. To run the sample without debugging, press Ctrl+F5 or selectDebug > Start Without Debugging.