wpf WPF中的像素着色器效果
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19178714/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Pixel Shader Effect in WPF
提问by mwjohnson
I was following along this tutorialabout how to include Pixel Shader Effectsin the form of an animation within a WPF application.
我一直在学习有关如何在 WPF 应用程序中以动画形式包含像素着色器效果的教程。
Background
背景
I felt like things were going smoothly, however I wanted to make a change to the application. In the tutorial the author has a separate GrayscaleEffect project and in his XAML does the following:
我觉得事情进展顺利，但我想对应用程序进行更改。在教程中，作者有一个单独的 GrayscaleEffect 项目，并在他的 XAML 中执行以下操作：
xmlns:effect="clr-namespace:GrayscaleEffect;assembly=GrayscaleEffect"
Later he has this:
后来他有这个：
DataTemplate x:Key="itemTemplate">
<Grid Width="225" Margin="3">
<Border BorderBrush="White" BorderThickness="2">
<Image Source="{Binding}" HorizontalAlignment="Center" VerticalAlignment="Center">
<Image.Effect>
<local:GrayscaleEffectTest x:Name="grayscaleEffect"/>
</Image.Effect>
<Image.Triggers>
<EventTrigger RoutedEvent="Mouse.MouseEnter">
<BeginStoryboard>
<Storyboard>
<!--HERE--> <DoubleAnimation To="1.0" Duration="0:0:0.3" AccelerationRatio="0.10" DecelerationRatio="0.25" Storyboard.TargetName="grayscaleEffect" Storyboard.TargetProperty="(local:GrayscaleEffectTest.DesaturationFactor)" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="Mouse.MouseLeave">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation To="0.0" Duration="0:0:4" AccelerationRatio="0.10" DecelerationRatio="0.25" Storyboard.TargetName="grayscaleEffect" Storyboard.TargetProperty="(local:GrayscaleEffectTest.DesaturationFactor)" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Image.Triggers>
</Image>
</Border>
</Grid>
</DataTemplate>
The key point here is the very long line <DoubleAnimation ....:
这里的关键点是很长的一行 <DoubleAnimation ....：
Storyboard.TargetProperty="(effect:GrayscaleEffect.DesaturationFactor)" />
My Approach
我的方法
I wanted to make the same thing, except I wanted to keep all of my code in the same project, rather than having two projects.
我想做同样的事情，但我想将所有代码保存在同一个项目中，而不是拥有两个项目。
So, I don't include the ;assembly=GrayscaleEffect. Furthermore my <DoubleAnimation ...line reads as:
所以，我不包括;assembly=GrayscaleEffect. 此外，我的<DoubleAnimation ...台词如下：
<DoubleAnimation ... Storyboard.TargetName="grayscaleEffect" Storyboard.TargetProperty="(local:GrayscaleEffectTest.DesaturationFactor)" />
However the WPF designer throws an initializer exception. The program runs but no animation ever gets triggered when I mouse over...
但是，WPF 设计器会引发初始化程序异常。程序运行但当我将鼠标悬停在上面时不会触发任何动画...
Anyone have any ideas? I feel confident that WPF should be able to run a pixel shader from within the same project...My project has the pre-build event, and other than renaming as GrayscaleEffect Testand having both projects combined into one, my project should be identical to the tutorial. I've tried a number of other failure approaches, mainly setting Storyboard.TargetProeprty = every damn thing under the sun. Also tried to hack together something to set up the animation in code behind in hopes I could at least walk through with a debugger and try to see what is going on. Obviously, nothing worked :(.
谁有想法？我相信 WPF 应该能够在同一个项目中运行像素着色器......我的项目有预构建事件，除了重命名为 GrayscaleEffect Test并将两个项目合并为一个之外，我的项目应该是相同的到教程。我尝试了许多其他失败方法，主要是设置Storyboard.TargetProeprty = every damn thing under the sun. 还尝试将一些东西拼凑起来，在后面的代码中设置动画，希望我至少可以使用调试器进行检查并尝试看看发生了什么。显然，没有任何效果:(。
Any help would be greatly appreciated. Cheers.
任何帮助将不胜感激。干杯。
回答by mwjohnson
Slightly embarrassing but the error was between chair and keyboard. So, the code was working just fine. To maybe help others I'll explain my debugging process, then explain what the problem was.
有点尴尬，但错误发生在椅子和键盘之间。所以，代码工作得很好。为了帮助其他人，我将解释我的调试过程，然后解释问题是什么。
First I changed the pixel shader to just go from Red to Red and Green. That is:
首先，我将像素着色器更改为从红色变为红色和绿色。那是：
result.r = 255;
result.g = 0;
result.b = 255 * factor;
Factor is the data variable that gets sent to the graphics card. Once I did this, I noticed that things were kind of working. The transition is a step-function, not a linear interpolation, but colors were changing. Then, I figured pixel color range must be [0 to 1.0]. This gave me the effect I was supposed to be getting.
Factor 是发送到显卡的数据变量。一旦我这样做了，我注意到事情有点奏效。过渡是阶跃函数，不是线性插值，但颜色在变化。然后，我认为像素颜色范围必须是 [0 到 1.0]。这给了我应该得到的效果。
result.r = 1.0;
result.g = 0;
result.b = 1.0 * factor;
Lastly, I loaded a new penguin picture instead of the original test image I was using and I realized my major mistake. The penguin picture was working just fine and I thought, what the hell?! Then I looked at my test image, which was a black and white image!!! (Dumb, dumb dumb dumb). The shame of having to post this "solution"will hopefully prevent me from making such a mistake again. Thank you for the help @Nico Schertler.
最后，我加载了一张新的企鹅图片而不是我使用的原始测试图片，我意识到我的主要错误。企鹅图片工作得很好，我想，这到底是怎么回事？！然后我看了看我的测试图像，这是一张黑白图像！！！（哑，哑哑哑）。不得不发布这个“解决方案”的耻辱有望防止我再次犯这样的错误。感谢您的帮助@Nico Schertler。
