原文:
使用WPF实现3D场景[一]
在这篇文章里,将介绍如何实现一个简单的三维场景,一个三维的空间,包括空间内的三维物体的组合.
首先介绍一下一个三维场景里的基本元素:
先是定义一个简单的三维的场景环境
代码如下:
<
Viewport3D
Name
="myViewport"
>
</ Viewport3D >
</ Viewport3D >
以上是定义了一个名称叫做 myViewport 的的三维场景,接下来可以在这个三位场景里添加一些元素:
元素一:照相机
照相机是三维场景内用户的视角,当然照相机也是唯一的。
来看如何定义一个简单的照相机代码:
<
Viewport3D
.Camera
>
< PerspectiveCamera FarPlaneDistance ="3000" NearPlaneDistance ="0.25" FieldOfView ="90" Position ="1800,0,0" LookDirection ="-1,0,0" UpDirection ="0,1,0" ></ PerspectiveCamera >
</ Viewport3D.Camera >
< PerspectiveCamera FarPlaneDistance ="3000" NearPlaneDistance ="0.25" FieldOfView ="90" Position ="1800,0,0" LookDirection ="-1,0,0" UpDirection ="0,1,0" ></ PerspectiveCamera >
</ Viewport3D.Camera >
这里面描述了照相机在三维场景里的位置,包括它观察的角度,最远的视线,等等这样信息和属性。如果想灵活的使用照相机改变视角会在第二讲和第三讲里详尽的介绍。
元素一:三维模型
三维模型是三维场景内的物体,也就是模型中的元素,不唯一,可以组合,重叠。
来看如何定义一个简单的三维模型组合的代码:
<
ModelVisual3D
x:Name
="topModelVisual3D"
>
< ModelVisual3D .Children >
< ModelVisual3D >
< ModelVisual3D .Content >
< DirectionalLight Color ="#FFFFFFFF" Direction ="-3,-4,-5" />
</ ModelVisual3D.Content >
</ ModelVisual3D >
< ModelVisual3D >
< ModelVisual3D .Content >
< GeometryModel3D Geometry ="{StaticResource chair}" >
< GeometryModel3D .Material >
< DiffuseMaterial >
< DiffuseMaterial .Brush >
< SolidColorBrush Color ="Yellow" Opacity ="1.0" />
</ DiffuseMaterial.Brush >
</ DiffuseMaterial >
</ GeometryModel3D.Material >
< GeometryModel3D .Transform >
< TranslateTransform3D OffsetX ="0" OffsetY ="-200" OffsetZ ="-600" />
</ GeometryModel3D.Transform >
</ GeometryModel3D >
</ ModelVisual3D.Content >
</ ModelVisual3D >
< ModelVisual3D >
< ModelVisual3D .Content >
< GeometryModel3D Geometry ="{StaticResource table}" >
< GeometryModel3D .Material >
< DiffuseMaterial >
< DiffuseMaterial .Brush >
< SolidColorBrush Color ="Yellow" Opacity ="1.0" />
</ DiffuseMaterial.Brush >
</ DiffuseMaterial >
</ GeometryModel3D.Material >
< GeometryModel3D .Transform >
< TranslateTransform3D OffsetX ="0" OffsetY ="20" OffsetZ ="60" />
</ GeometryModel3D.Transform >
</ GeometryModel3D >
</ ModelVisual3D.Content >
</ ModelVisual3D >
< ModelVisual3D >
< ModelVisual3D .Content >
< GeometryModel3D Geometry ="{StaticResource man}" >
< GeometryModel3D .Material >
< DiffuseMaterial >
< DiffuseMaterial .Brush >
< SolidColorBrush Color ="black" Opacity ="1.0" />
</ DiffuseMaterial.Brush >
</ DiffuseMaterial >
</ GeometryModel3D.Material >
< GeometryModel3D .Transform >
< TranslateTransform3D OffsetX ="75" OffsetY ="20" OffsetZ ="0" />
</ GeometryModel3D.Transform >
</ GeometryModel3D >
</ ModelVisual3D.Content >
< ModelVisual3D .Transform >
< Transform3DGroup >
< ScaleTransform3D ScaleX ="10" ScaleY ="10" ScaleZ ="10" x:Name ="scaleTransform" />
< MatrixTransform3D />
< RotateTransform3D >
< RotateTransform3D .Rotation >
< AxisAngleRotation3D Angle ="275" Axis ="0,0,1" x:Name ="myAngleRotationMan" />
</ RotateTransform3D.Rotation >
</ RotateTransform3D >
</ Transform3DGroup >
</ ModelVisual3D.Transform >
</ ModelVisual3D >
</ ModelVisual3D.Children >
< ModelVisual3D .Transform >
< Transform3DGroup >
< MatrixTransform3D />
< RotateTransform3D >
< RotateTransform3D .Rotation >
< AxisAngleRotation3D Angle ="0" Axis ="0,10,0" x:Name ="myAngleRotationChair" />
</ RotateTransform3D.Rotation >
</ RotateTransform3D >
</ Transform3DGroup >
</ ModelVisual3D.Transform >
</ ModelVisual3D >
< ModelVisual3D .Children >
< ModelVisual3D >
< ModelVisual3D .Content >
< DirectionalLight Color ="#FFFFFFFF" Direction ="-3,-4,-5" />
</ ModelVisual3D.Content >
</ ModelVisual3D >
< ModelVisual3D >
< ModelVisual3D .Content >
< GeometryModel3D Geometry ="{StaticResource chair}" >
< GeometryModel3D .Material >
< DiffuseMaterial >
< DiffuseMaterial .Brush >
< SolidColorBrush Color ="Yellow" Opacity ="1.0" />
</ DiffuseMaterial.Brush >
</ DiffuseMaterial >
</ GeometryModel3D.Material >
< GeometryModel3D .Transform >
< TranslateTransform3D OffsetX ="0" OffsetY ="-200" OffsetZ ="-600" />
</ GeometryModel3D.Transform >
</ GeometryModel3D >
</ ModelVisual3D.Content >
</ ModelVisual3D >
< ModelVisual3D >
< ModelVisual3D .Content >
< GeometryModel3D Geometry ="{StaticResource table}" >
< GeometryModel3D .Material >
< DiffuseMaterial >
< DiffuseMaterial .Brush >
< SolidColorBrush Color ="Yellow" Opacity ="1.0" />
</ DiffuseMaterial.Brush >
</ DiffuseMaterial >
</ GeometryModel3D.Material >
< GeometryModel3D .Transform >
< TranslateTransform3D OffsetX ="0" OffsetY ="20" OffsetZ ="60" />
</ GeometryModel3D.Transform >
</ GeometryModel3D >
</ ModelVisual3D.Content >
</ ModelVisual3D >
< ModelVisual3D >
< ModelVisual3D .Content >
< GeometryModel3D Geometry ="{StaticResource man}" >
< GeometryModel3D .Material >
< DiffuseMaterial >
< DiffuseMaterial .Brush >
< SolidColorBrush Color ="black" Opacity ="1.0" />
</ DiffuseMaterial.Brush >
</ DiffuseMaterial >
</ GeometryModel3D.Material >
< GeometryModel3D .Transform >
< TranslateTransform3D OffsetX ="75" OffsetY ="20" OffsetZ ="0" />
</ GeometryModel3D.Transform >
</ GeometryModel3D >
</ ModelVisual3D.Content >
< ModelVisual3D .Transform >
< Transform3DGroup >
< ScaleTransform3D ScaleX ="10" ScaleY ="10" ScaleZ ="10" x:Name ="scaleTransform" />
< MatrixTransform3D />
< RotateTransform3D >
< RotateTransform3D .Rotation >
< AxisAngleRotation3D Angle ="275" Axis ="0,0,1" x:Name ="myAngleRotationMan" />
</ RotateTransform3D.Rotation >
</ RotateTransform3D >
</ Transform3DGroup >
</ ModelVisual3D.Transform >
</ ModelVisual3D >
</ ModelVisual3D.Children >
< ModelVisual3D .Transform >
< Transform3DGroup >
< MatrixTransform3D />
< RotateTransform3D >
< RotateTransform3D .Rotation >
< AxisAngleRotation3D Angle ="0" Axis ="0,10,0" x:Name ="myAngleRotationChair" />
</ RotateTransform3D.Rotation >
</ RotateTransform3D >
</ Transform3DGroup >
</ ModelVisual3D.Transform >
</ ModelVisual3D >
来看一下效果:
到这里就完成了整个的三维场景的建立。
补充元素:动画效果
如果想让整体的三维模型都能动起来,就需要为三维场景添加动画效果。
看一段可以让三维场景按纵轴(中心轴)旋转的代码:
<
Viewport3D
.Triggers
>
< EventTrigger RoutedEvent ="Viewport3D.Loaded" >
< BeginStoryboard >
< Storyboard >
< DoubleAnimation
Storyboard.TargetName ="myAngleRotationChair"
Storyboard.TargetProperty ="Angle"
From ="0" To ="360" Duration ="0:0:10"
RepeatBehavior ="Forever" />
</ Storyboard >
</ BeginStoryboard >
</ EventTrigger >
</ Viewport3D.Triggers >
< EventTrigger RoutedEvent ="Viewport3D.Loaded" >
< BeginStoryboard >
< Storyboard >
< DoubleAnimation
Storyboard.TargetName ="myAngleRotationChair"
Storyboard.TargetProperty ="Angle"
From ="0" To ="360" Duration ="0:0:10"
RepeatBehavior ="Forever" />
</ Storyboard >
</ BeginStoryboard >
</ EventTrigger >
</ Viewport3D.Triggers >
填写如上代码之后就完成了一个最简单的三维动画的处理。
好的~如果您对更多的三维场景变成想有所了解,请关注第二讲。
如果您想下载源代码或收听语音教程,请访问:微软webcast
再次感谢您的关注,谢谢!