Unity+SenseAR教程 | 用手势发射爱心2：加入发射方向【源码】

洪流学堂，让你快人几步。你好，我是你的技术探路者郑洪智，你可以叫我大智。这篇教程是为了填上一篇教程给你留的坑，上一篇《Unity+SenseAR教程：用手势发射爱心【源码】》如果你还没学习的话，先去学习哈！上一节最后给你挖的坑是：如何计算出手势的发射方向，让粒子的发射方向和手势一致呢？上一节只给你留了个思路，这节课咱们一起来把这个坑填一填。填坑后最终效果上节最后的效果是全屏显示心心：这节最后的效果

Unity官方开发者社区

39人浏览 · 2020-02-26 13:34:52

Unity官方开发者社区 · 2020-02-26 13:34:52 发布

洪流学堂，让你快人几步。你好，我是你的技术探路者郑洪智，你可以叫我大智。

这篇教程是为了填上一篇教程给你留的坑，上一篇《Unity+SenseAR教程：用手势发射爱心【源码】》如果你还没学习的话，先去学习哈！

上一节最后给你挖的坑是：如何计算出手势的发射方向，让粒子的发射方向和手势一致呢？

上一节只给你留了个思路，这节课咱们一起来把这个坑填一填。

填坑后最终效果

上节最后的效果是全屏显示心心：

这节最后的效果是这样的，定向发射你所有的爱哦：

这节咱们主要解决几个问题： 1、改造粒子让它朝着一个方向发射 2、计算GUN手势的枪口的位置和方向 3、隐藏手上的那些DEBUG的点(很多伙伴问如何隐藏掉，其实就一行代码哈哈哈) 4、发布

1、改造粒子让它朝着一个方向发射

默认的粒子系统创建出来其实就是朝着一个方向发射的，咱们主要需要改一改它的默认参数，让它发射的范围小一点，像是从指尖发射出来的。

注意下图中的几个属性：

为什么还要你注意Rotation呢？因为待会咱们要让粒子的发射方向和手的方向一致，粒子有旋转的话计算起来麻烦一些，所以最好给他清零。

2、计算GUN手势的枪口的位置和方向

接着上一节讲的，ARStandGuesturePainter.cs中，先放出代码：

    
    
     
     if
     
      
     
     (
     
     guestureInfo
     
     .
     
     HandGestureType 
     
     ==
     
      ArHandGestureType
     
     .
     
     GUN 
     
     ||
     
     
            guestureInfo
     
     .
     
     HandGestureType 
     
     ==
     
      ArHandGestureType
     
     .
     
     I_LOVE_YOU 
     
     ||
     
     
            guestureInfo
     
     .
     
     HandGestureType 
     
     ==
     
      ArHandGestureType
     
     .
     
     FINGER_HEART
     
     )
     
     
        
     
     {
     
     
            HeartParticles
     
     .
     
     SetActive
     
     (
     
     true
     
     )
     
     ;
     
     

            
     
     // m_Points中包含了手势识别出来的点的位置，食指的关节分别是4，5，6，7(指尖)
     
     
            
     
     if
     
      
     
     (
     
     m_Points
     
     .
     
     Count 
     
     >
     
      
     
     8
     
     )
     
     
            
     
     {
     
     
                
     
     // 使用SenseAR给的一个工具方法，转为viewport的坐标(0,1)
     
     
                
     
     // 注意在这旋转屏幕时有BUG，大智没有过多去调试，如果你想搞得完美一些，可以完善一下它的源码
     
     
                
     
     var
     
      startViewport 
     
     =
     
      ARStandGestureUtil
     
     .
     
     TrasnPosition2D
     
     (
     
     m_Points
     
     [
     
     4
     
     ]
     
     ,
     
      image
     
     .
     
     width
     
     ,
     
      image
     
     .
     
     height
     
     )
     
     ;
     
     
                
     
     var
     
      endViewport 
     
     =
     
      ARStandGestureUtil
     
     .
     
     TrasnPosition2D
     
     (
     
     m_Points
     
     [
     
     7
     
     ]
     
     ,
     
      image
     
     .
     
     width
     
     ,
     
      image
     
     .
     
     height
     
     )
     
     ;
     
     

                
     
     // 设置z值，下面转换为世界坐标时代表与相机的距离
     
     
                
     
     // 这个z其实是随便填的，但是会影响粒子距离相机的远近，填一个合适的值
     
     
                startViewport
     
     .
     
     z 
     
     =
     
      
     
     1f
     
     ;
     
     
                endViewport
     
     .
     
     z 
     
     =
     
      
     
     1f
     
     ;
     
     

                
     
     // 转为世界坐标
     
     
                
     
     var
     
      start 
     
     =
     
      m_camera
     
     .
     
     ViewportToWorldPoint
     
     (
     
     startViewport
     
     )
     
     ;
     
     
                
     
     var
     
      end 
     
     =
     
      m_camera
     
     .
     
     ViewportToWorldPoint
     
     (
     
     endViewport
     
     )
     
     ;
     
     

                
     
     // 设置粒子的位置和方向
     
     
                HeartParticles
     
     .
     
     transform
     
     .
     
     position 
     
     =
     
      end
     
     ;
     
     
                HeartParticles
     
     .
     
     transform
     
     .
     
     forward 
     
     =
     
      end 
     
     -
     
      start
     
     ;
     
     
            
     
     }
     
     
        
     
     }
     
     
        
     
     else
     
     
        
     
     {
     
     
            HeartParticles
     
     .
     
     SetActive
     
     (
     
     false
     
     )
     
     ;
     
     
        
     
     }

代码里注释写的很详细了，不过还有几点需要说明一下： 1、m_Points中的点与手关节的对应关系如下图：

图中是1-20，但是数组中是0-19，所以注意转换一下。可以看到咱们食指的之间是P8，数组中的索引是7。食指的根部是P5，数组中的索引是4。

2、为什么要设置startViewport和endViewport的z值呢？提前设置好z值后，在下面调用ViewportToWorldPoint后，就能直接得到与相机距离为z的世界坐标结果了。你要是还不清楚可以去看一下这个API的文档： https://docs.unity3d.com/ScriptReference/Camera.ViewportToScreenPoint.html

其实手势识别出来的手指关节位置本身是没有深度的，相当于是一张照片。我们只是让3D的粒子系统和2D的背景相机图像融合在一起看起来好像都是3D的。

3、 HeartParticles.transform.forward = end - start; 这句代码是啥意思？这句代码是个设置物体旋转的简便写法，可以将物体的transform的forward向量，设置为对应的方向。比如在这就是将粒子的forward(z轴)设置为食指指向的方向。

所以第一步制作粒子的时候让你最好不要有旋转，否则设置forward可能得不出来你想要的结果。