在這個程序裡對5個2D控件界面應用了垂直倒影，邊緣模糊化和模型變換，在本例中，這5個2D控件為Border, 各包含了一幅Image,界面 如下圖所示，源碼從這裡（http://files.cnblogs.com/5460600/DropShadow.rar）下載
本例中使用Viewport2DVisual3D來呈現2D的Border,Border中包含了Image，對 Viewport2DVisual3D使用了RotateTransform3D模型變換 ，以使Viewport2DVisual3D向左或者向右傾斜 45度角，為使處於左右兩端的Image能和背景圖融為一體，使用LinearGradientBrush為這兩 幅Image設置了漸變的透明蒙板 OpacityMask，
設置垂直倒影主要使用了VisualBrush和ScaleTransform3D，VisualBrush用來反射Image的圖像，並將圖像填充到 GeometryModel3D的 Material屬性，通過設置ScaleTransform3D元素的屬性ScaleY="-1"，可變換模型以X軸為坐標向下180度倒置，由於對Image使用了 RotateTransform3D變換，因此對反射Image圖像的GeometryModel3D也需使用相同的RotateTransform3D變換 ，另外對控件的倒影設置了 0.8個值的透明度，以便能清晰的顯示2D控件界面並模糊控件界面的倒影
在呈現2D控件的時候，多次使用了Viewport2DVisual3D，但在反射控件界面倒影的時候，僅使用了一個ModelVisual3D元素， ModelVisual3D元素的Content屬性值被設置為一個Model3DGroup元素，Model3DGroup是一個集合類，用來打包 GeometryModel3D ，而2D Image的界面倒影圖像最終填充到GeometryModel3D的Material屬性上，因此在反射2D控件界面倒影的時候，使過 Model3DGroup來組合 GeometryModel3D ,只需要定義一個ModelVisual3D則成.
呈現2D控件
1 <Viewport3D x:Name="viewPort3D" IsHitTestVisible="False" RenderOptions.EdgeMode="Aliased"
2 ClipToBounds="False" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
3 <Viewport3D.Camera>
4 <PerspectiveCamera Position="- 0.3,-0.5,9" />
5 </Viewport3D.Camera>
6 <ModelVisual3D>
7 <ModelVisual3D.Content>
8 <AmbientLight Color="White"/>
9 </ModelVisual3D.Content>
10 </ModelVisual3D>
11 <Viewport2DVisual3D x:Name="viewport2DVisual3D0" Geometry="{StaticResource geometry1}"
12 Material="{StaticResource material}">
13 <Viewport2DVisual3D.Transform>
14 <Transform3DGroup>
15 <Transform3DGroup>
16 <RotateTransform3D>
17 <RotateTransform3D.Rotation>
18 <AxisAngleRotation3D Axis="0,1.,0" Angle="-45"/>
19 </RotateTransform3D.Rotation>
20 </RotateTransform3D>
21 <TranslateTransform3D OffsetX="-2.12" OffsetY="0" OffsetZ="0" />
22 </Transform3DGroup>
23 </Transform3DGroup>
24 </Viewport2DVisual3D.Transform>
25 <Viewport2DVisual3D.Visual>
26 <Border Style="{StaticResource border}">
27 <Image Source="Images\050817goodfeng14.jpg" Opacity="1" />
28 </Border>
29 </Viewport2DVisual3D.Visual>
30 </Viewport2DVisual3D>
31 <Viewport2DVisual3D x:Name="viewport2DVisual3D1"
32 Geometry="{StaticResource geometry1}" Material="{StaticResource material}">
33 <Viewport2DVisual3D.Transform>
34 <Transform3DGroup>
35 <RotateTransform3D>
36 <RotateTransform3D.Rotation>
37 <AxisAngleRotation3D Axis="0,1.,0" Angle="45"/>
38 </RotateTransform3D.Rotation>
39 </RotateTransform3D>
40 <TranslateTransform3D OffsetX="0.71" OffsetY="0" OffsetZ="0" />
41 </Transform3DGroup>
42 </Viewport2DVisual3D.Transform>
43 <Viewport2DVisual3D.Visual>
44 <Border Style="{StaticResource border}">
45 <Image Source="Images\051027nature10.jpg" Opacity="1"/>
46 </Border>
47 </Viewport2DVisual3D.Visual>
48 </Viewport2DVisual3D>
49 <Viewport2DVisual3D x:Name="viewport2DVisual3D2"
50 Geometry="{StaticResource geometry1}" Material="{StaticResource material}">
51 <Viewport2DVisual3D.Transform>
52 <Transform3DGroup>
53 <RotateTransform3D>
54 <RotateTransform3D.Rotation>
55 <AxisAngleRotation3D Axis="0,1.,0" Angle="-45"/>
56 </RotateTransform3D.Rotation>
57 </RotateTransform3D>
58 <TranslateTransform3D OffsetX="0.71" OffsetY="0" OffsetZ="0" />
59 </Transform3DGroup>
60 </Viewport2DVisual3D.Transform>
61 <Viewport2DVisual3D.Visual>
62 <Border Style="{StaticResource border}" >
63 <Image Source="Images\051027nature11.jpg" Opacity="1" />
64 </Border>
65 </Viewport2DVisual3D.Visual>
66 </Viewport2DVisual3D>
67 <Viewport2DVisual3D x:Name="viewport2DVisual3D3"
68 Geometry="{StaticResource geometry1}" Material="{StaticResource material}">
69 <Viewport2DVisual3D.Transform>
70 <Transform3DGroup>
71 <RotateTransform3D>
72 <RotateTransform3D.Rotation>
73 <AxisAngleRotation3D Axis="0,1.,0" Angle="45"/>
74 </RotateTransform3D.Rotation>
75 </RotateTransform3D>
76 <TranslateTransform3D OffsetX="3.54" OffsetY="0" OffsetZ="0" />
77 </Transform3DGroup>
78 </Viewport2DVisual3D.Transform>
79 <Viewport2DVisual3D.Visual>
80 <Border Style="{StaticResource border}" >
81 <Image Source="Images\051123Webshots16.jpg" Opacity="1">
82 <Image.OpacityMask>
83 <LinearGradientBrush EndPoint="0.012,0.5" StartPoint="0.994,0.5">
84 <GradientStop Color="#00000000" Offset="0"/>
85 <GradientStop Color="#FFFFFFFF" Offset="1"/>
86 </LinearGradientBrush>
87 </Image.OpacityMask>
88 </Image>
89 </Border>
90 </Viewport2DVisual3D.Visual>
91 </Viewport2DVisual3D>
92 <Viewport2DVisual3D x:Name="viewport2DVisual3D4"
93 Geometry="{StaticResource geometry1}" Material="{StaticResource material}">
94 <Viewport2DVisual3D.Transform>
95 <Transform3DGroup>
96 <RotateTransform3D>
97 <RotateTransform3D.Rotation>
98 <AxisAngleRotation3D Axis="0,1,0" Angle="45"/>
99 </RotateTransform3D.Rotation>
100 </RotateTransform3D>
101 <TranslateTransform3D OffsetX="- 2.12" OffsetY="0" OffsetZ="-0" />
102 </Transform3DGroup>
103 </Viewport2DVisual3D.Transform>
104 <Viewport2DVisual3D.Visual>
105 <Border Style="{StaticResource border}">
106 <Image Source="Images\050817goodfeng15.jpg" Opacity="1" >
107 <Image.OpacityMask>
108 <LinearGradientBrush EndPoint="0.994,0.5" StartPoint="0.012,0.5">
109 <GradientStop Color="#00000000" Offset="0"/>
110 <GradientStop Color="#FFFFFFFF" Offset="1"/>
111 </LinearGradientBrush>
112 </Image.OpacityMask>
113 </Image>
114 </Border>
115 </Viewport2DVisual3D.Visual>
116 </Viewport2DVisual3D>
117 </Viewport3D>
界面倒影
1 <Viewport3D x:Name="reflectionViewPort3D" Opacity="0.8" IsHitTestVisible="False"
2 RenderOptions.EdgeMode="Aliased" ClipToBounds="False"
3 HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
4 <Viewport3D.Camera>
5 <PerspectiveCamera Position="-0.3,-0.5,9" />
6 </Viewport3D.Camera>
7 <Viewport3D.OpacityMask>
8 <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
9 <GradientStop Color="#00000000" Offset="0.55"/>
10 <GradientStop Color="#FFFFFFFF" Offset="0.01"/>
11 </LinearGradientBrush>
12 </Viewport3D.OpacityMask>
13 <ModelVisual3D>
14 <ModelVisual3D.Content>
15 <AmbientLight Color="White"/>
16 </ModelVisual3D.Content>
17 </ModelVisual3D>
18 <ModelVisual3D >
19 <ModelVisual3D.Content>
20 <Model3DGroup x:Name="reflctionRoom">
21 <Model3DGroup.Children>
22 <GeometryModel3D x:Name="reflctionChild0"
23 Geometry="{StaticResource geometry1}" >
24 <GeometryModel3D.Material>
25 <DiffuseMaterial>
26 <DiffuseMaterial.Brush>
27 <VisualBrush Visual="{Binding ElementName=viewport2DVisual3D0, Path=Visual}"/>
28 </DiffuseMaterial.Brush>
29 </DiffuseMaterial>
30 </GeometryModel3D.Material>
31 <GeometryModel3D.Transform>
32 <Transform3DGroup>
33 <RotateTransform3D>
34 <RotateTransform3D.Rotation>
35 <AxisAngleRotation3D Axis="0,1.,0" Angle="-45"/>
36 </RotateTransform3D.Rotation>
37 </RotateTransform3D>
38 <TranslateTransform3D OffsetX="-2.12" OffsetY="2" OffsetZ="0" />
39 <ScaleTransform3D ScaleY="-1"/>
40 </Transform3DGroup>
41 </GeometryModel3D.Transform>
42 </GeometryModel3D>
43 <GeometryModel3D x:Name="reflctionChild1" Geometry="{StaticResource geometry1}" >
44 <GeometryModel3D.Material>
45 <DiffuseMaterial>
46 <DiffuseMaterial.Brush>
47 <VisualBrush Visual="{Binding ElementName=viewport2DVisual3D1, Path=Visual}"/>
48 </DiffuseMaterial.Brush>
49 </DiffuseMaterial>
50 </GeometryModel3D.Material>
51 <GeometryModel3D.Transform>
52 <Transform3DGroup>
53 <RotateTransform3D>
54 <RotateTransform3D.Rotation>
55 <AxisAngleRotation3D Axis="0,1.,0" Angle="45"/>
56 </RotateTransform3D.Rotation>
57 </RotateTransform3D>
58 <TranslateTransform3D OffsetX="0.71" OffsetY="2" OffsetZ="0" />
59 <ScaleTransform3D ScaleY="-1"/>
60 </Transform3DGroup>
61 </GeometryModel3D.Transform>
62 </GeometryModel3D>
63 <GeometryModel3D x:Name="reflctionChild2" Geometry="{StaticResource geometry1}" >
64 <GeometryModel3D.Material>
65 <DiffuseMaterial>
66 <DiffuseMaterial.Brush>
67 <VisualBrush Visual="{Binding ElementName=viewport2DVisual3D2, Path=Visual}"/>
68 </DiffuseMaterial.Brush>
69 </DiffuseMaterial>
70 </GeometryModel3D.Material>
71 <GeometryModel3D.Transform>
72 <Transform3DGroup>
73 <RotateTransform3D>
74 <RotateTransform3D.Rotation>
75 <AxisAngleRotation3D Axis="0,1.,0" Angle="-45"/>
76 </RotateTransform3D.Rotation>
77 </RotateTransform3D>
78 <TranslateTransform3D OffsetX="0.71" OffsetY="2" OffsetZ="0" />
79 <ScaleTransform3D ScaleY="-1"/>
80 </Transform3DGroup>
81 </GeometryModel3D.Transform>
82 </GeometryModel3D>
83 <GeometryModel3D x:Name="reflctionChild3" Geometry="{StaticResource geometry1}" >
84 <GeometryModel3D.Material>
85 <DiffuseMaterial>
86 <DiffuseMaterial.Brush>
87 <VisualBrush Visual="{Binding ElementName=viewport2DVisual3D3, Path=Visual}"/>
88 </DiffuseMaterial.Brush>
89 </DiffuseMaterial>
90 </GeometryModel3D.Material>
91 <GeometryModel3D.Transform>
92 <Transform3DGroup>
93 <RotateTransform3D>
94 <RotateTransform3D.Rotation>
95 <AxisAngleRotation3D Axis="0,1.,0" Angle="45"/>
96 </RotateTransform3D.Rotation>
97 </RotateTransform3D>
98 <TranslateTransform3D OffsetX="3.54" OffsetY="2" OffsetZ="0" />
99 <ScaleTransform3D ScaleY="-1"/>
100 </Transform3DGroup>
101 </GeometryModel3D.Transform>
102 </GeometryModel3D>
103 <GeometryModel3D x:Name="reflctionChild4" Geometry="{StaticResource geometry1}" >
104 <GeometryModel3D.Material>
105 <DiffuseMaterial>
106 <DiffuseMaterial.Brush>
107 <VisualBrush Visual="{Binding ElementName=viewport2DVisual3D4, Path=Visual}"/>
108 </DiffuseMaterial.Brush>
109 </DiffuseMaterial>
110 </GeometryModel3D.Material>
111 <GeometryModel3D.Transform>
112 <Transform3DGroup>
113 <RotateTransform3D>
114 <RotateTransform3D.Rotation>
115 <AxisAngleRotation3D Axis="0,1,0" Angle="45"/>
116 </RotateTransform3D.Rotation>
117 </RotateTransform3D>
118 <TranslateTransform3D OffsetX="-2.12" OffsetY="2" OffsetZ="- 0" />
119 <ScaleTransform3D ScaleY="-1"/>
120 </Transform3DGroup>
121 </GeometryModel3D.Transform>
122 </GeometryModel3D>
123 </Model3DGroup.Children>
124 </Model3DGroup>
125 </ModelVisual3D.Content>
126 </ModelVisual3D>
127 </Viewport3D>
