Unity中使用贝塞尔曲线

阳光穿透心脏的1/2处 2022-05-14 12:41 410阅读 0赞

**鼎鼎大名的贝塞尔曲线相信大家都耳熟能详。这两天因为工作的原因需要将贝塞尔曲线加在工程中，那么MOMO迅速的研究了一下成果就分享给大家了哦。贝塞尔曲线的原理是由两个点构成的任意角度的曲线，这两个点一个是起点，一个是终点。在这条曲线之上还会有两个可以任意移动的点来控制贝塞尔曲线的角度。如下图所示，点1 和点4 就是起点和终点，点2 和点3 就是控制曲线角度的两个动态点。**

**[![屏幕快照 2012-08-03 下午10.17.08][2012-08-03 _10.17.08]][2012-08-03 _10.17.08]**

**如下图所示。使用拖动条来让曲线发生旋转，大家会看的更加清晰。目前我们看到的被塞尔曲线是在平面中完成的，其实贝塞尔曲线是完全支持3D中完成，这里是为了让大家看的更加清楚MOMO将忽略Z曲线的Z轴。UnityAPI文档中有贝塞尔曲线的方法，可是只支持编辑器中使用，也就是说无法在程序中使用。那么本篇文章我们利用贝塞尔曲线的数学原理以及LineRenderer组件来完成在Unity中使用贝塞尔曲线。**

[![屏幕快照 2012-08-03 下午10.21.56][2012-08-03 _10.21.56]][2012-08-03 _10.21.56]

**创建一个U3D的工程，创建一个新游戏对象，绑定LineRenderer组件。**

**Bezier.cs 这里是贝塞尔曲线的公式C＃版本**

[view source][]

<table> 
 <tbody> 
  <tr> 
   <td><code>001</code></td> 
   <td><code>using</code> <code> UnityEngine; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>003</code></td> 
   <td><code>[System.Serializable] </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>005</code></td> 
   <td><code>public</code> <code> class</code> <code>Bezier : System.Object </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>009</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>Vector3 p0; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>011</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>Vector3 p1; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>013</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>Vector3 p2; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>015</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>Vector3 p3; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>017</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>float</code> <code>ti = 0f; </code> </td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>019</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>Vector3 b0 = Vector3.zero; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>021</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>Vector3 b1 = Vector3.zero; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>023</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>Vector3 b2 = Vector3.zero; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>025</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>Vector3 b3 = Vector3.zero; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>027</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>float</code> <code>Ax; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>029</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>float</code> <code>Ay; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>031</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>float</code> <code>Az; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>033</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>float</code> <code>Bx; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>035</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>float</code> <code>By; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>037</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>float</code> <code>Bz; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>039</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>float</code> <code>Cx; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>041</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>float</code> <code>Cy; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>043</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>float</code> <code>Cz; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>045</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>// Init function v0 = 1st point, v1 = handle of the 1st point , v2 = handle of the 2nd point, v3 = 2nd point </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>047</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>// handle1 = v0 + v1 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>049</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>// handle2 = v3 + v2 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>051</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>Bezier( Vector3 v0, Vector3 v1, Vector3 v2, Vector3 v3 ) </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>067</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>Vector3 GetPointAtTime( </code><code>float</code> <code>t ) </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>071</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>this</code><code>.CheckConstant(); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>073</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>float</code> <code>t2 = t * t; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>075</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>float</code> <code>t3 = t * t * t; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>077</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>float</code> <code>x = </code><code>this</code><code>.Ax * t3 + </code><code>this</code><code>.Bx * t2 + </code><code>this</code><code>.Cx * t + p0.x; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>079</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>float</code> <code>y = </code><code>this</code><code>.Ay * t3 + </code><code>this</code><code>.By * t2 + </code><code>this</code><code>.Cy * t + p0.y; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>081</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>float</code> <code>z = </code><code>this</code><code>.Az * t3 + </code><code>this</code><code>.Bz * t2 + </code><code>this</code><code>.Cz * t + p0.z; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>083</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>return</code> <code>new</code> <code>Vector3( x, y, z ); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>087</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>void</code> <code>SetConstant() </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>111</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>// Check if p0, p1, p2 or p3 have changed </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>113</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>void</code> <code>CheckConstant() </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>121</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>this</code><code>.SetConstant(); </code></td> 
  </tr> 
 </tbody> 
</table>

**MyBezier.cs 把它直接挂在摄像机上 ，控制拖动条来控制贝塞尔曲线、**

[view source][]

<table> 
 <tbody> 
  <tr> 
   <td><code>01</code></td> 
   <td><code>using</code> <code> UnityEngine; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>03</code></td> 
   <td><code>public</code> <code> class</code> <code>MyBezier : MonoBehaviour </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>07</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//贝塞尔曲线算法类 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>08</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>Bezier myBezier; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>10</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//曲线的对象 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>11</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>GameObject Yellowline; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>13</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//曲线对象的曲线组件 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>14</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>LineRenderer YellowlineRenderer; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>16</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//拖动条用来控制贝塞尔曲线的两个点 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>17</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>float</code> <code>hSliderValue0; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>18</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>float</code> <code>hSliderValue1; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>20</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>void</code> <code>Start() </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>22</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//得到曲线组件 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>23</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>YellowlineRenderer = Yellowline.GetComponent&lt;LineRenderer&gt;(); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>24</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//为了让曲线更加美观，设置曲线由100个点来组成 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>25</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>YellowlineRenderer.SetVertexCount(100); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>28</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>void</code> <code>OnGUI() </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>30</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//拖动条得出 -5.0 - 5.0之间的一个数值 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>31</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>hSliderValue0 = GUI.HorizontalSlider(</code><code>new</code> <code>Rect(25, 25, 100, 30), hSliderValue0, -5.0F, 5.0F); </code> </td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>32</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>hSliderValue1 = GUI.HorizontalSlider(</code><code>new</code> <code>Rect(25, 70, 100, 30), hSliderValue1, -5.0F, 5.0F); </code> </td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>35</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>void</code> <code>Update() </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>37</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//在这里来计算贝塞尔曲线 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>38</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//四个参数 表示当前贝塞尔曲线上的4个点 第一个点和第四个点 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>39</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//我们是不需要移动的，中间的两个点是由拖动条来控制的。 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>40</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>myBezier = </code><code>new</code> <code>Bezier( </code><code>new</code> <code>Vector3( -5f, 0f, 0f ),&nbsp; </code><code>new</code> <code>Vector3( hSliderValue1, hSliderValue0 , 0f ),&nbsp; </code><code>new</code> <code>Vector3( hSliderValue1, hSliderValue0, 0f ), </code><code>new</code> <code>Vector3( 5f, 0f, 0f ) ); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>42</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//循环100遍来绘制贝塞尔曲线每个线段 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>45</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//参数的取值范围 0 - 1 返回曲线没一点的位置 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>46</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//为了精确这里使用i * 0.01 得到当前点的坐标 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>47</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>Vector3 vec = myBezier.GetPointAtTime( (</code><code>float</code><code>)(i *0.01) ); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>48</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//把每条线段绘制出来 完成白塞尔曲线的绘制 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>49</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>YellowlineRenderer.SetPosition(i -1,vec); </code></td> 
  </tr> 
 </tbody> 
</table>

**OK 这里贝塞尔曲线的原理就已经完毕。下面我们学习在NGUI中如何使用贝塞尔曲线。刚刚我们说过贝塞尔曲线是由2个固定点 加两个动态点来完成的，其实我们在开发中往往只需要3个点。1 起点 2 中间点 3 结束点 拖动这三个点都可以重新计算曲线的轨迹这样才比较完美。如下图所示，这三个点都是可以任意拖动的，拖动结束后，黑色的线为用户拖拽点连接的直角线段，我们根据这三个点组成的直角线段计算它们之间的贝塞尔曲线，也就是图中黄色的线段。**

[![屏幕快照 2012-08-03 下午10.44.22][2012-08-03 _10.44.22]][2012-08-03 _10.44.22]

**简单的进行拖拽一下，是不是感觉贝塞尔曲线很酷炫呢？哇咔咔。**

[![屏幕快照 2012-08-03 下午10.44.36][2012-08-03 _10.44.36]][2012-08-03 _10.44.36]

**我们来看看代码实现的部分，其实原理和上面完全一样。**

**BallMove.cs绑定在这三个可以拖拽的点上，让拖动小球后小球可跟随手指移动。**

[view source][]

<table> 
 <tbody> 
  <tr> 
   <td><code>01</code></td> 
   <td><code>using</code> <code> UnityEngine; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>02</code></td> 
   <td><code>using</code> <code> System.Collections; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>04</code></td> 
   <td><code>public</code> <code> class</code> <code>BallMove : MonoBehaviour </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>07</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>void</code> <code>OnDrag (Vector2 delta) </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>10</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>float</code> <code>movex = transform.localPosition.x + (delta.x / 3); </code> </td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>11</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>float</code> <code>movey = transform.localPosition.y + (delta.y / 3); </code> </td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>12</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//避免越界操作，这里可以进行一些判断 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>13</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>transform.localPosition = </code><code>new</code> <code>Vector3(movex,movey ,transform.localPosition.z); </code></td> 
  </tr> 
 </tbody> 
</table>

**如此一来触摸小球后，小球将跟随用户手指移动。下面我们将监听用户触摸小球后的坐标来计算它们三点之间的贝塞尔曲线。**

**BallInit.cs挂在摄像机上**

[view source][]

<table> 
 <tbody> 
  <tr> 
   <td><code>01</code></td> 
   <td><code>using</code> <code> UnityEngine; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>02</code></td> 
   <td><code>using</code> <code> System.Collections; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>04</code></td> 
   <td><code>public</code> <code> class</code> <code>BallInit : MonoBehaviour { </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>06</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//黑色直角线段 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>07</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>LineRenderer lineRenderer0; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>08</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>LineRenderer lineRenderer1; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>09</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//贝塞尔曲线 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>10</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>LineRenderer BezierRenderer; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>12</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//三个小球触摸对象 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>13</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>GameObject mark0; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>14</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>GameObject mark1; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>15</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code> <code>GameObject mark2; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>17</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//算法公式类 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>18</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>private</code> <code>Bezier myBezier; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>20</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>void</code> <code>Start () </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>22</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//分别得到黑色直角线段 与黄色贝塞尔曲线的 线段组件 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>23</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>lineRenderer0 = GameObject.Find(</code><code>"line0"</code><code>).GetComponent&lt;LineRenderer&gt;(); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>24</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>lineRenderer1 = GameObject.Find(</code><code>"line1"</code><code>).GetComponent&lt;LineRenderer&gt;(); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>25</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>BezierRenderer = GameObject.Find(</code><code>"Bezier"</code><code>).GetComponent&lt;LineRenderer&gt;(); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>26</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//黑色直角是有两个线段组成 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>27</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>lineRenderer0.SetVertexCount(2); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>28</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>lineRenderer1.SetVertexCount(2); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>29</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//为了让贝塞尔曲线细致一些 设置它有100个点组成 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>30</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>BezierRenderer.SetVertexCount(100); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>34</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>void</code> <code>Update () </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>37</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//mark0 表示中间的小球 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>38</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//mark1 表示右边的小球 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>39</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//mark2 表示左边的小球 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>41</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//中间的标志点分别减去左右两边的标志点，计算出曲线的X Y 的点 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>42</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>float</code> <code>y = (mark0.transform.position.y&nbsp; - mark2.transform.position.y)&nbsp; ; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>43</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>float</code> <code>x = (mark0.transform.position.x&nbsp; - mark2.transform.position.x) ;&nbsp; </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>45</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//因为我们是通过3个点来确定贝塞尔曲线， 所以参数3 设置为0 即可。 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>46</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//这样参数1 表示起点 参数2表示中间点 参数3 忽略 参数4 表示结束点 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>47</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>myBezier = </code><code>new</code> <code>Bezier( mark2.transform.position,&nbsp; </code><code>new</code> <code>Vector3(x,y,0f),&nbsp; </code><code>new</code> <code>Vector3(0f,0f,0f), mark1.transform.position ); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>49</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//绘制贝塞尔曲线 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>52</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>Vector3 vec = myBezier.GetPointAtTime( (</code><code>float</code><code>)(i * 0.01) ); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>53</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>BezierRenderer.SetPosition(i -1,vec); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>56</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>//绘制直角黑色标志线段 </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>57</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>lineRenderer0.SetPosition(0,mark0.transform.position); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>58</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>lineRenderer0.SetPosition(1,mark2.transform.position); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>59</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>lineRenderer1.SetPosition(0,mark0.transform.position); </code></td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td><code>60</code></td> 
   <td><code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>lineRenderer1.SetPosition(1,mark1.transform.position); </code></td> 
  </tr> 
 </tbody> 
</table>

[2012-08-03 _10.17.08]: /images/20220514/e5d5b629207d4e90b6010fd1f942f426.png
[2012-08-03 _10.21.56]: /images/20220514/0dd566409efe40428852335aa0ee430e.png
[view source]: http://www.xuanyusong.com/archives/1548#viewSource
[2012-08-03 _10.44.22]: /images/20220514/a89c822ee01a44a0be34c3a8376f8676.png
[2012-08-03 _10.44.36]: /images/20220514/a5dd6763b4c842cebf49de50e478d7e6.png