欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

WPF 3D和光照学习1

程序员文章站 2024-02-21 14:32:46
...

使用 Kaxaml工具;

WPF 3D和光照学习1

1 两个相交面的直射光

首先来参阅网上一段代码;

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">  
  <Viewport3D>
    <Viewport3D.Camera>
        <PerspectiveCamera Position="0 0.5 3" LookDirection="0 0 -1"/>
    </Viewport3D.Camera>
    <ModelVisual3D>
        <ModelVisual3D.Content>
            <Model3DGroup>
                <DirectionalLight Direction="1 0 -2"
                                  Color="White"/>
                <GeometryModel3D>
                    <GeometryModel3D.Geometry>
                        <MeshGeometry3D Positions="-1 1 0, 0 1 1, -1 0 0, 0 0 1, 0 1 1, 1 1 0, 0 0 1, 1 0 0"
                                        TriangleIndices="2 1 0, 2 3 1, 6 5 4, 6 7 5"/>
                    </GeometryModel3D.Geometry>
                    <GeometryModel3D.Material>
                        <DiffuseMaterial Brush="Green"/>
                    </GeometryModel3D.Material>
                </GeometryModel3D>
            </Model3DGroup>
        </ModelVisual3D.Content>
    </ModelVisual3D>
</Viewport3D>  
</Page>

下面是三种不同的情形;差别只在 MeshGeometry3D 标签里面;

定义两个简单的相交面,和直射光;

 

第一个方法就是用最简单的方法,一次性定义所有的点,两个面四个三角形一共12个点,TriangleIndices是从0到11;

<MeshGeometry3D Positions="-1 0 0, 0 0 1, 0 1 1, -1 0 0, 0 1 1, -1 1 0, 0 0 1, 1 0 0, 1 1 0, 0 0 1, 1 1 0, 0 1 1"
                TriangleIndices="0 1 2 3 4 5 6 7 8 9 10 11"/>

WPF 3D和光照学习1

        四个三角形组成两个相交的面;定义的是直射光,DirectionalLight,所以如图看不到什么变化;

 

由于WPF计算光照会根据整个平面的方向向量,所以如果在不同面上使用同一个点可能会达到不同的光照效果;
两个面总共6个点,只定义这6个点,在TriangleIndices中重复利用,代码:
<MeshGeometry3D Positions="-1 1 0, 0 1 1, 1 1 0, -1 0 0, 0 0 1, 1 0 0"
                TriangleIndices="3 1 0, 3 4 1, 4 2 1, 4 5 2"/>

WPF 3D和光照学习1

        并没有得到直射光照效果,使用DirectionalLight;由于顶点被重复利用,同一平面的光照会被不同顶点混合而成了上面的效果;

 

另一种办法是不在不同面上重复利用顶点,但在相同面上可以重复利用;
这样两个面每个面固定4个点一共8个点(介于方法一12个点和方法二6个点之间);
<MeshGeometry3D Positions="-1 1 0, 0 1 1, -1 0 0, 0 0 1, 0 1 1, 1 1 0, 0 0 1, 1 0 0"
                TriangleIndices="2 1 0, 2 3 1, 6 5 4, 6 7 5"/>
可以达到和方法一同样的直射光照效果,同时定义更少的点;

WPF 3D和光照学习1

你也可以改变光的颜色,例如 Color="#884433" ,则如下;

WPF 3D和光照学习1

2 MeshGeometry3D

Viewport3D控件:这是三维对象元素的上层容器,是相机对象元素Camera、三维图形呈现对象元素ModelVisual3D的集合;

<PerspectiveCamera Position="0 0.5 3" LookDirection="0 0 -1"/>

        这是定义摄像机对象的位置和观看的方向;

 

MeshGeometry3D四个属性的含义如下图,主要的东西在这个控件里面;

 

WPF 3D和光照学习1

Positions,是顶点位置的集合;

下图是一个三维坐标系,里面有四个坐标点,也就是顶点位置,都已标出,也就组成了集合(Positions);

WPF 3D和光照学习1

TriangleIndices,字面意思是三角形索引的集合;

举个例子:
TriangleIndices="0 1 2 2 3 0"
    按照图片显示的可以翻译成 “P0 P1 P2,P2 P3 P0”,或者 0 对应 (-1,1,0),1 对应 (-1,-1,0),以此类推。

三角形呈现的是有正反面区分的;WPF采用逆时针的环绕方式来显示正面;
或者用右手定则:握住右手,伸出拇指,四指为逆时针方向,拇指指向正面;

 

那么前面代码中类似这样的,

<MeshGeometry3D Positions="-1 1 0, 0 1 1, -1 0 0, 0 0 1, 0 1 1, 1 1 0, 0 0 1, 1 0 0"
                                        TriangleIndices="2 1 0, 2 3 1, 6 5 4, 6 7 5"/>

就定义了 顶点位置的集合 和 三角形索引的集合

3 wpf 主要的3D类

如下;

WPF 3D和光照学习1