Direct2D处理几何图形之间的碰撞检测（上）

最近发现D2D除了可以绘制不同类型的几何图形之外，还有一个很强大的功能：可以对几何图形进行关系判断（也就是我们常说的碰撞检测）。也是本篇文章和大家介绍的关于几何图形的碰撞检测。

一、概述

Direct2D中支持以下几种类型的几何图形：

　　a.简单几何图形(Simple Geometry)：矩形、圆角矩形、椭圆；

　　b.路径图形(Path Geometry)；

　　c.复合图形(Composite Geometry)：图形组、变换图形。

 这里首先介绍一个D2D的一个接口类ID2D1Geometry。它用来表示一个几何对象资源，并定义一组用于处理和测量几何形状的帮助器方法。从 ID2D1Geometry 继承的接口将定义特定形状。上面提到的所有图形类都是ID2D1Geometry的子类。

二、几何图形与点的碰撞检测

1.函数介绍

这里首先要介绍ID2D1Geometry接口的两个成员函数FillContainsPoint和StrokeContainsPoint，这两个函数涉及到我们将要进行的几何图形和点的碰撞检测，（这两个函数都有4个重载，这里由于篇幅原因只分别介绍重载中的一个，其实原理都一样，其他的重载大家可以去msdn官网了解）：

（1）ID2D1Geometry::FillContainsPoint函数介绍

　　功能：指示由该几何对象填充的区域是否包含指定点。
　　参数 
　　　　point           　　  要测试的点。
　　　　worldTransform    进行包含测试前应用到该几何对象的转换。 
　　　　contains              此方法返回时将包含一个布尔值，表示几何图形是否包含point。必须为此参数分配存储空间。
　　返回值：如果该方法成功，返回 S_OK；否则，将返回错误代码。 

 

（2）ID2D1Geometry::StrokeContainsPoint函数介绍

　　功能：确定几何对象的笔画是否包含指定的点。 

　　参数 　　　　

　　　　point           　　  要测试的点。

　　　　strokeWidth　　　要应用的笔画粗细。

　　　　strokeStyle　　　 要应用的笔画样式。

　　　　worldTransform   进行包含测试前应用到该几何对象的转换。 　　　　

　　　　contains              此方法返回时将包含一个布尔值，表示几何图形的笔画（边框）包含point。必须为此参数分配存储空间。

　　返回值：如果该方法成功，返回 S_OK；否则，将返回错误代码。 

 

2.代码实现

接下来我们就可以使用这个函数进行几何图形和点的碰撞检测工作了。我在代码中封装了两个函数PtInGeometry和PtInGeometryBorder，分别用来判断"点是否在几何图形内"和"点是否在几何图形（画笔）边框上"。

1 2 3 4 5 6 7 8 9 10 11 12 13 14

// 检测点是否在几何图形内 bool PtInGeometry(ID2D1Geometry* pGeometry, D2D1_MATRIX_3X2_F& transMatrix, D2D1_POINT_2F& pt) {     BOOL contain = FALSE;     HRESULT hr = S_OK;       hr = pGeometry->FillContainsPoint( pt, &transMatrix, &contain);     if (SUCCEEDED(hr) && contain)     {         return true;     }       return false; }

 

1 2 3 4 5 6 7 8 9 10 11 12 13 14

// 检测点是否在几何图形边框上 bool PtInGeometryBorder(ID2D1Geometry* pGeometry, float strokeWidth, D2D1_MATRIX_3X2_F& transMatrix, D2D1_POINT_2F& pt) {     BOOL contain = FALSE;     HRESULT hr = S_OK;       hr = pGeometry->StrokeContainsPoint( pt, strokeWidth, NULL, &transMatrix, &contain);          if (SUCCEEDED(hr) && contain)     {         return true;     }       return false; }

 

这样我们就可以确定点和几何图形之间的三种关系了：

　　a.点在几何图形里面

　　b.点在几何图形边框上

　　c.点在几何图形外面

 

现在开始我们的测试，为了证明Direct2D可以判断任何几何图形和点的位置关系，使用一个五角星（路径几何图形）用当作检测的几何图形。这样做的想法是：既然复杂的路径几何图形都可以作这种判断，那么其他简单的几何图形当然也就没有任何问题啦！

在测试代码中，在窗口绘制的函数中绘制一个五角星（路径几何图形）用当作检测的几何图形，这里需要注意的是，为了让点和五角星之间的三种位置关系在演示效果中比较直观和明显，我将五角星填充色设置为银灰色；画两次边框（画笔），第一个边框（画笔）宽度设置为1，边框颜色设置为黑色；第二个边框（画笔）宽度设置为50，边框颜色设置为粉色并设为半透明。这样五角星的轮廓和边框就显而易见了，在黑色框内就是在五角星内，在粉色范围内就是在五角星边框上，在粉色边框外就是在五角星外。

之后绘制3个不同位置的点（注：由于Direct2D中没有直接绘制点的方法，使用边长为0的矩形代替点；为了我们的演示更清晰，这个边长为0的矩形绘制时画笔宽度为5，但是判断时仍然为点），在绘制点之前判断点和五角星的关系。如果点在五角星内部，绘制成红色；点在五角星边框上，绘制成紫色；点在五角星外面，绘制成绿色。这样在绘制结果中，我们就可以根据点的颜色来识别五角星和点的位置关系了。

最后贴一张测试Demo的效果图：

 

如上图中，三个点的位置和五角星之间的关系就一目了然了。

 

3.讨论

其实看到上面的演示图之后大家也能想到，其实点和几何图形的位置关系还有一种。这种比较特殊，就是在银灰色范围和粉色范围之间，有一个范围区域是银灰色和粉色叠加而成的深粉色（？感觉是这个颜色，怀疑自己是不是色弱...），这个区域就是我要说的第4种位置关系：既在五角星边框上，也在五角星内。如下图所示：

这是由于绘制边框的画笔是以边框为中心的，画笔的宽度不为0时，就会有一半的宽度覆盖到几何图形内，也就造成了这种特殊的位置关系。当然，如果几何图形在绘制时直接使用填充方式，而不绘制边框，那么我们就可以忽略这种特殊情况了。

还有一点需要注意的是，对五角星（几何对象）做变换之后，再和点作位置关系判断也是可以的。只是在我代码例子中，没有对五角星做变换。

 

在这里完整代码代码就不贴出了，有兴趣的朋友可以点击此处下载Demo源码，Demo源码是Direct2DTests目录下的D2DGeometryCollisionDetectionWithPt文件。

 

三、结语

几何图形与点的碰撞检测到这里就介绍完了，下一篇文章我们将介绍几何图形之间的碰撞检测。