WFP之位图效果
在“第一步”这个按钮周围,有一转红色,这个效果就是用WPF的位图效果实现的。
位图效果(BitmapEffect 对象)是简单的像素处理操作。位图效果将 BitmapSource 作为输入并在应用效果(如模糊或投影)之后生成新的 BitmapSource。每个位图效果都公开了控制筛选属性的属性,如 BlurBitmapEffect 的 Radius。(摘录MSDN)
从上面的MSDN中看出一种效果的处理,主要有如果几种位图效果:
发光效果,投影效果,模糊效果,凹凸效果,浮雕效果五种,今天的例子中应用到两种效果,一个是发光效果,一个是投影效果。下面先看一下这个例子的XAML代码:
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
2
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
3
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
4
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
5
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
6
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
7
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
8
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
9
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
10
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
11
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
12
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
13
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
14
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
15
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
16
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
17
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
18
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
19
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
20
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
21
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
22
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
23
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
24
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
25
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
26
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
27
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
28
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
29
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
30
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
31
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
32
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
33
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
34
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
35
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
36
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
37
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
38
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
39
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
40
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
41
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
42
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
43
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
44
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
这是例子中摘出来的关键呈现位图效果的代码,其中OuterGlowBitmapEffect标签是实现发光的效果,DropShadowBitmapEffect是实现投影效果。下面具体看一下。
发光效果:
<OuterGlowBitmapEffect GlowColor="Red" GlowSize="20" Noise="20" Opacity="0.3" />
GlowColor="Red"是设置发光的颜色
GlowSize="20",是发光的边缘的大小,其类型为Double,如果不设置,默认值是20,它的值的范围是从 1 到 199。单位是与设备无关的单位(每个单位 1/96 英寸)为度量单位
Noise="1",是发光的边缘是来为杂点,0为没有杂点,1为最大限度杂点,其类型为Double,取值范围是0到1。
Opacity="0.3",是透明度,这个属性很通用,类型为Double,取值范围是0到1。
投影效果:
<DropShadowBitmapEffect Color="Blue" Direction="320" ShadowDepth="20" Softness="1" Opacity="0.5"/>
Color="Blue"是设置投影的颜色
Direction="320",是投影的角度,是Double类型,角度是以逆时针方式增加
ShadowDepth="20",类型是Double,投影平面与阴影平面之间的距离,单位是与设备无关的单位(每个单位 1/96 英寸)为度量单位。值的有效范围从 0 到 300。默认值为 5
Softness="1",阴影的柔和度。值的有效范围从 0 到 1。默认值为 0.5。
Opacity="0.5",是透明度,这个属性很通用,类型为Double,取值范围是0到1。
本例中的其他效果不在这里多说了!
本例的代码文件:
Effectsdemo例子
其他位图效果雷同,可参数MSDN学习。
《asp.net core精要讲解》 https://ke.qq.com/course/265696
《asp.net core 3.0》 https://ke.qq.com/course/437517
《asp.net core项目实战》 https://ke.qq.com/course/291868
《基于.net core微服务》 https://ke.qq.com/course/299524