Download from Wow! eBook <www.wowebook.com>
HLSL and Pixel Shaders for XAML
Developers
Walt Ritscher
Beijing • Cambridge • Farnham • Kưln • Sebastopol • Tokyo
HLSL and Pixel Shaders for XAML Developers
by Walt Ritscher
Copyright © 2012 Walt Ritscher. All rights reserved.
Printed in the United States of America.
Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopol, CA 95472.
O’Reilly books may be purchased for educational, business, or sales promotional use. Online editions
are also available for most titles (). For more information, contact our
corporate/institutional sales department: 800-998-9938 or
Editor: Rachel Roumeliotis
Production Editor: Rachel Steely
Proofreader: Rachel Steely
Cover Designer: Karen Montgomery
Interior Designer: David Futato
Illustrators: Robert Romano and Rebecca Demarest
Revision History for the First Edition:
2012-07-03
First release
See for release details.
Nutshell Handbook, the Nutshell Handbook logo, and the O’Reilly logo are registered trademarks of
O’Reilly Media, Inc. HLSL and Pixel Shaders for XAML Developers, the image of an American bittern,
and related trade dress are trademarks of O’Reilly Media, Inc.
Many of the designations used by manufacturers and sellers to distinguish their products are claimed as
trademarks. Where those designations appear in this book, and O’Reilly Media, Inc., was aware of a
trademark claim, the designations have been printed in caps or initial caps.
While every precaution has been taken in the preparation of this book, the publisher and authors assume
no responsibility for errors or omissions, or for damages resulting from the use of the information contained herein.
ISBN: 978-1-449-31984-7
[LSI]
1341330024
Table of Contents
Preface . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ix
Foreword . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xv
1. Shader 101 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
Why Should XAML Developers Learn HLSL?
The Tale of the Shader
HLSL and DirectX
Understanding the Graphics Pipeline
XAML and Shaders
Summary
1
2
3
5
7
9
2. Getting Started . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Setting Up Your Development Computer
Silverlight Development
WPF Development
Expression Blend 4
Choosing a Shader Compiler
DirectX Compiler
WPF Build Task
Shazzam Shader Editor
Other Tools to Consider
FX Composer
NShader
Visual Studio 2012
A First Shader Project
Using Prebuilt Effects
Adding Effects
Debrief
Custom Shader
Create a Shader Algorithm
11
11
12
12
12
12
13
13
13
13
14
14
15
16
19
22
22
23
iii
Compile the HLSL Code
Add to Visual Studio XAML Project
Create a .NET Wrapper Class
Compile the Project
Instantiate the Shader
Summary
24
24
25
26
27
28
3. Commonplace Pixel Shaders . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
A Word About Pseudocode
Our Sample Image
Color Modification
Common Techniques
Black, White, and Gray
Color Replacement
Color Enhancement and Correction
Distinctive Effects
Distortion and Displacement
Magnify
Embossed
Testing Distortion Effects
Other Displacement Effects
Blurs
Motion Blur
Zoom Blur
Sharpening
Generative Effects
Multiple Inputs
Sampler Transition
Texture Map
Color Combination
Photoshop Blend Modes
Darken Modes
Lighten Modes
Contrast Modes
Comparative Modes
Other Modes
Blend Modes in HLSL
Practical Uses for Shader Effects
Motion Blur in Moving Parts
Blurs to Emphasize UI Focus
Desaturate for Emphasis
Summary
iv | Table of Contents
30
30
30
31
32
34
34
36
37
38
39
40
42
42
43
43
43
43
44
44
46
47
49
49
51
52
52
52
53
53
54
54
55
55
4. How WPF and Silverlight Use Shaders . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57
Framework Effects
BlurEffect
DropShadowEffect
Nested Effects
Multiple Effects on One Element
Expression Blend Effects
Using a Blend Effect
Custom Effects
Creating a Custom ShaderEffect
Working with Samplers
Multi-Input Shaders
Understanding Sampler Size
Creating Parameterized Effects
Padding
Effect Mapping
Summary
57
58
59
59
59
60
61
63
63
65
72
73
75
77
78
83
5. Using Expression Blend and Visual Studio with Shaders . . . . . . . . . . . . . . . . . . . . . . 85
Creating a Project
New Project
Adding Assets
Adding Effects
Setting Effect Properties
Visual Studio Editor
Using Custom Effects in Blend
Multi-Input Effects
Transition Effects in Blend
Create a State Group
Add the States
Set the Properties
Adding a Transition Effect
Summary
85
86
87
88
90
90
92
94
98
98
99
99
100
102
6. Using the Shazzam Shader Editor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 103
UI Tour
Create a Custom Shader
Exploring the HLSL Code Editor
Compiling and Testing the Shader
Editor Status Bar
Exploring the Generated Code
Changing Options
Working with HLSL Parameters
103
103
105
106
109
109
110
112
Table of Contents | v