unity实现触摸摇杆的个人实践体会

    自己做了很多摇杆，但都需要写好多代码，调试起来也很麻烦。最近在网上看到别人利用unity自带的scroll view来制作摇杆，确实十分简单。自己也进行了尝试，这里记录一下自己的一些体会。

    首先，scroll view其实就是一个浏览窗口，窗户的大小定义为view port，字面意思就是“可视端口”，也就是我们能看到屋子里面的一扇窗户。你想呈现给浏览者的东西定义为content，就是内容喽，这个因人而异，可以是文本，供人滑动浏览，也可以是图片，今天我们就是利用图片来制作摇杆。闲话少叙，开工。

    首先创建一个canvas（creat  ->  UI  ->  canvas），而后在canvas中创建一个scroll view，把其中的Scrollbar Horizontal、Scrollbar Vertical都删除，只留下viewport。给摇杆一个底图，就是摇杆的边缘图喽，随便来个圆圈或者圆环都可以。将图片拖拽到scroll view的image当中。

                   

 

而后在scrollview的viewport下的content下面创建一个image（creat  ->  UI  ->  image），把摇杆的图片拖进image属性的source image当中去。

                  

                   


好了，基本图形就做好了。下面先把viewport的大小和你的圆圈大小调一致，为什么？因为你想让你的摇杆出现在圆圈里面呀，也就是content的内容会在viewport的大小之内。

然后把你的content大小调大，反正就是你移动content的位置，摇杆正好出现在摇杆范围的圆圈内。最后，把对齐的中心点选好，让摇杆开始就处于圆环当中吧。

好了可以运行试一试了。运行后，你会发现2个问题，一是摇杆不会自动回到中心去，拖到哪里就留在哪里，二是摇杆是和正方形对应的滑动，跟实际的滑动有所区别。因为我们做的viewport和content都是正方形呀。

为了解决这两个问题，只好上两段代码了。

建立一个scrollcircle 把scroll rect的内容重写。代码如下：

using UnityEngine;

using System.Collections;

using UnityEngine.UI;

public class scrollcircle :ScrollRect 

{
protected float mRadius=0f;

        public Gameobject   content;

protected override void Start()
{
base.Start();
//计算摇杆块的半径
mRadius = (transform as RectTransform).sizeDelta.x * 0.5f;
}

public override void OnDrag (UnityEngine.EventSystems.PointerEventData eventData)
{
base.OnDrag (eventData);
var contentPostion = this.content.anchoredPosition;
if (contentPostion.magnitude > mRadius){
contentPostion = contentPostion.normalized * mRadius ;
SetContentAnchoredPosition(contentPostion);
}
}

       public void  back_to_begain(){

       Vector3 vz=new Vector3 (22.56f,0,0);

      content.GetComponent <RectTransform >().anchoredPosition  = vz;

      }

}

把scroll view绑定的scroll rect去掉，换上我们的 scroll circle ，viewport和content还拖拽进去，对应好。把content拖拽到对应Gameobject当中去。这里写的vector 3是我的位置，自己看看content开始的位置是多少，填上就行。

然后给scroll view加一个event trigger（add component->  event -> event trigger），event trigger中选择Enddrag，把我们的back_to_begain()函数选中，就是说当拖拽结束后，执行这个函数。

           

 

效果

          


试一试吧，至于具体怎么控制你制作的人物或者汽车，那就自己写代码吧！