Friday, June 27, 2014

A Simple and Efficient Touch And Drag RigidBodies For Unity 3D (Beginner Friendly) - Part 1

Hi! Looking for a simple and efficient Touch and Drag RigidBodies scripts for developing for Android, iOS or any other phones? Here is the tutorial for you.
First of all make a new project or you can also work in an existing project beacuse it will work for any RigidBody.

 

You will see a clear empty scene with just a Camera. We will attach our script with that camera. Here is how it looks without anything-




But for now click on create menu in hierarchy and then on plane to add a plane to your scene. This plane is very useful because we will later use it for Raycasting (with masking) to know current touch position. You will understand about it after some time. Now click on Layers and then Add layer. You will see 8 builtin layers which are not important for us add a user Layer 8 with any name, i used the name 'plane'. Make sure the plane's rotation is exactly with the camera and then parent the plane to the camera.
If you have not done something wrong your scene will look like this. (except the parenting step because i edited that later)


Now Add a Ground and some cubes or anything you want for Testing Our scripts, Just ensure that a rigidbody is attached to that cube or whatever you have choosen. disable the mesh renderer of the plane we created earlier for Raycasting. And Last add a point light to the scene to make it look 'fancy'. And
Here is our final scene setup.



Now comes the scripting Part, for that make create a new C# script and name it 'Drag' (as usual, without quotes) or whatever you like Then, open that up, And you will get something like this 

If you are a Basic user you should know that what void start and update does for your convinience.
Our First  Step is to declare the Variables we will use for our purpose (we will understand about them Later) - Add this above all of methods but under the class otherwise unity will bring an error.

 public Transform plane;
 private Transform selection = null;
 private Vector3 dist;


The plane is the plane we created earliear. Just assign this variable with the plane which we make the child of camera via inspector.
The selection transform will be assigned to the object which the user wanted to drag.i'll explain that later.
The Vector3 dist calculates the distance between the hit point and the transform of the selected object
Now add a foreach loop with array input.touches. If you don't understand, here is what i mean (add this under void update)

foreach(Touch touch in Input.touches)
        {


        }

This type of loop execute the code inside for any touches that exist in Input.Touches. If you still don't understand i refer you to unity Documentation.
Inside the foreach loop, Declare these variables - 

  Ray ray = Camera.main.ScreenPointToRay(touch.position);
 RaycastHit hit;


The first variable is a ray which goes in the direction pointed by touch input and the second is a RaycastHit which will give us info ablout the Raycast such as colliding object etc. The camera.main.ScreenPointToRay converts the user's 2d input into a 3d line going into the direction pointed by user's input position.

Now, Add a switch under the foreach loop for Touch Phases. code - 

 switch (touch.phase) {
            case TouchPhase.Began:

                break;
            case TouchPhase.Moved:

                break;
            case TouchPhase.Ended:

                break;
            }


This switch switches whether the user has began the Touch movement, or he is still touching or he has ended. Truly I don't know very much about switches but it is enough for all of us.

 Add this line to void Start of your script

plane.collider.enabled = false;
This will make the collider disabled by start. You can ignore its explanation because you will automatically understand it later.

CheckPost - If you have reached here successfully, your script will look like this -



using UnityEngine;
using System.Collections;

public class Drag : MonoBehaviour {

    // Use this for initialization
    void Start () {
   
    }
   
    // Update is called once per frame
   void Update () {
        foreach(Touch touch in Input.touches)
        {
            Ray ray = Camera.main.ScreenPointToRay(touch.position);
            RaycastHit hit;
            switch (touch.phase)
            {
                case TouchPhase.Began:
               
                    break;
                case TouchPhase.Moved:
               
                    break;
                case TouchPhase.Ended:
               
                    break;
            }
        }
    }
}








If unity bring any error It means you done something wrong (Although it will give a warning about unused variables). Ok, So now the Setup is complete now w'll do some serious coding.
 Add these lines under case TouchPhase.Began: , TouchPhase.Moved:and TouchPhase.Ended: (actually replace the all code below with all the code in your script inside switch staement)


switch (touch.phase)
            {
                case TouchPhase.Began:


                if(Physics.Raycast(ray, out hit, 100))
                {

                 
                  if (hit.rigidbody !=null)
                    {
                      selection = hit.rigidbody.transform;
                      plane.transform.position = hit.point;
                    }
                }
                dist = new Vector3(hit.rigidbody.transform.position.x,hit.rigidbody.transform.position.y,hit.rigidbody.transform.position.z) -  hit.point ;
                plane.collider.enabled = true;
                    break;


                case TouchPhase.Moved:


                int layerMask = 1 << 8;
                if(Physics.Raycast(ray, out point, 100,layerMask))
                {

                   

                selection.rigidbody.constraints = RigidbodyConstraints.FreezePosition;
                selection.transform.position = point.point + dist;
                }
                    break;


                case TouchPhase.Ended:

                selection.rigidbody.constraints = RigidbodyConstraints.None;
                selection = null;
                plane.collider.enabled = false;
                    break;
            }


At First Sight, this looks like a mess of code but you will understand it. that's the reason i make the title Beginner friendly
I'll explain it step-by-step 

Under TouchPhase.Began 
We fire A raycast from the ray we created earliear which originates and move towards the direction of touch input.Then, If it hits on a rigidbody assign the selection variable to the transform of that rigidbody, and set the position of the plane for raycasting to the point where the raycast hit. Then we calculated the distance between the hit point and colliding rigidbody's transform. This offset(var dist) is very essential because if we will not use it The object center will always be at your finger's position even if you pulled it from the corner of object which will give jerky motion to object.
And at last plane collider is being enabled to detect touch position in Moved phase.

Under TouchPhase.Moved
Declaring a int for ignoring the raycast for all object except the plane (which we defined earlier in scene setup). Then raycast the current touch position which hit the plane and then assign the position of that point to the rigidbody the raycast hit(in Touchphase.began). Then we freezed the movement of Rigidbody To make it move according to the touch movement without falling with gravity.(actually this make dragging rigidbody very enjoyable as the rigidbody will only rotate in air but not fall).

Under TouchPhase.Ended
when user stopped touching the screen. We just rollback the changes we did like we disabled the freeze position constraint. And empty the selection variable. And also disabled the plane collider so that it will not come in the way when the user will again try to drag another rigidbody. (that's why we disable the collider in void start, I hope you guessed that earlier).

And hit the play button if you are using realtime debugging or build and play in your device (if you have one) or in a emulator and you will see the cube or the test rigidbody you choosed acording to your finger. At this point although it look very good but not totally realistic. We will add more realiatic effects to this in part 2. 
That is all for part 1. In Part 2 we will add some more physical effects to make it more real and enjoyable.

Here is The unitypackage of this project if you just want some instant Action or you feel comfortable to understand it better with source code. So here is the link from 4 shared - 

http://www.4shared.com/file/2DBk80hgce/Touch_n_Drag_part-1_source.html

Let me know if you have problems with download. I'll make the part as soon as i can. Thanks for reading the post. I'll hope you like it. bye 

[EDIT] The part 2 is complete you can check it out at this link - 
www.newtonians3d.blogspot.com/2014/06/a-simple-and-efficient-touch-and-drag_29.html

No comments:

Post a Comment