Handling drag of an UI element in a scroll view over the whole canvas

I’m trying to create a game for mobile devices. I have to say i searched a lot through the net and found a lot of things, but they were all confusing and different one from the other, so i tried myself to write a sort of code from what i learned.

I want to create an inventory that is stored in the content of a scrollView, the touch event of the scrollview is actually working perfectly, but now i want to handle also the touch & drag for elements inside it.
NB. there are two images composing a single element, the slot and the item, i want to drag only the item.

here is a pic to make it clearer

I initially created a script and added to the single item element trying to use the box collider to check my touch, i learned then that i needed to convert the touch from the screen to the space with the raycast and check if the ray actually hit the layer of the object i want to drag, so i tried with the layer and came up with a code like this :

using UnityEngine;
using System.Collections;

public class ItemTouchHandler : MonoBehaviour {

    public Transform itemT;
   // Collider itemcollider;
    LayerMask itemlayer;

	// Use this for initialization
	void Start () {
     //   itemcollider = itemT.GetComponent<Collider>() as Collider;
        itemlayer = itemT.GetComponent <LayerMask>();
	}
	
	// Update is called once per frame
	void Update () {
      
        
        if (Input.touchCount > 0)
        {
            Ray ray = GetComponent<Camera>().ScreenPointToRay(new Vector3(Input.GetTouch(0).position.x, Input.GetTouch(0).position.y, 0));
            RaycastHit hit;
            if (Physics.Raycast(ray, out hit, Mathf.Infinity, itemlayer ))
            {
             //   if (itemcollider.bounds.Contains(Input.GetTouch(0).position))
              //  {

                    if (Input.GetTouch(0).phase == TouchPhase.Began)
                    {
                        Debug.Log("Touch Began");
                    }
                    else if (Input.GetTouch(0).phase == TouchPhase.Moved)
                    {
                        Debug.Log("Touch Moved");
                    }
                    else if (Input.GetTouch(0).phase == TouchPhase.Ended)
                    {
                        Debug.Log("Touch Ended");
                    }

               // }
            }
        }

    }
}

but i get the error that is shown down below in the image i posted before.

Now, how should i modify the code to make the item move when i touch & drag it? and i also thought that when the touch begin is more than a time && hit the item element, I should disable the scrollmovement handler and enable the itemdrag one, but i’m stuck before that.
I think i’m missing something important about the layer and the raycasting and that the scrollview touch handler is somehow making my touch&drag not work.

Oh i forgot! i want to be able to drag the item also outside the content, the scrollview and also outside the panel, actually i want to be able to drag it in the whole canvas and in future to check if it’s been dragged in particular panels

Thank you for your answers!

Help me please!!

@Ghislo, I know this is about a year late but the “LayerMask” you are referring to is not a component, that is related to collision/lighting layers set on objects. In order to set a LayerMask in code, you have to convert it to an int and bit shift it like this:

itemlayer = 1 << (int)LayerMask.NameToLayer("YOUR_LAYER_NAME_HERE");

Then you pass ‘itemLayer’ into your raycast just like you are doing and it should only hit the objects that are set on the “YOUR_LAYER_NAME_HERE” layer (be sure this is named exactly like what is set in your TagManager!)

Hope this helps you, or someone with a similar issue.