> For the complete documentation index, see [llms.txt](https://yapi-plugin.gitbook.io/easy-drag-and-drop/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://yapi-plugin.gitbook.io/easy-drag-and-drop/quick-start/2d-demo-scene.md).

# 2D Demo Scene

Play around with the simple demo scene to quickly understand the drag and drop function.

### 1. Open The DemoScene and Play It\~

 **Path = \[Assets/DragAndDrop/DemoScene/Simple Drag and Drop/DemoScene.unity]**

![DemoScene.unity](https://561724012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fnd69P9wF3EfYE8LjrgZj%2Fuploads%2FHY7DMoTpEAwCyTF7eKwv%2Fimage.png?alt=media\&token=4a7c8ae9-1539-400b-95eb-c85c726ebed6)

### **2. Demo Video - How To Add a Dragable Object**

{% embed url="<https://www.youtube.com/watch?t=1s&v=RapRP0iHV5I>" %}
[**https://www.youtube.com/watch?v=RapRP0iHV5I**](https://www.youtube.com/watch?v=RapRP0iHV5I)
{% endembed %}

### **3.  Demo Video - How To Add a DropSlot Object**

{% embed url="<https://www.youtube.com/watch?v=1fZ-WWdhdV4>" %}
[**https://www.youtube.com/watch?v=1fZ-WWdhdV4**](https://www.youtube.com/watch?v=1fZ-WWdhdV4)
{% endembed %}

### - Drag and Drop Event Description -

![](https://561724012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fnd69P9wF3EfYE8LjrgZj%2Fuploads%2FoPvgKQENarlrd9VHE2og%2FDragEvent.PNG?alt=media\&token=ab2a894e-5b87-448f-b4b8-296126f40f4c)

![](https://561724012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fnd69P9wF3EfYE8LjrgZj%2Fuploads%2Fg7DYAATthyNwoXyzkiPH%2FDropEvent.PNG?alt=media\&token=d9aa950f-8462-4ccf-93c7-3640d39a48cc)

**You can simply add a new custom Drag and Drop Event in the inspector! Yeah!**

**Example Function Usage:**

```csharp
public void ShowDragInfo(DragObj dragObj){    
    Debug.Log("ObjName:" + dragObj.name + " | Status:" + dragObj.m_DragState);
}
```

### - DropSlotDemo Inherient Description -

For more advance usage, you can write your own drop function by simply inherient the **DropSlot** script.&#x20;

For example in the demo scene, we write a **DropSlotDemo** script which inherent the **DropSlot**, then override the OnDrop function.&#x20;

```csharp
public class DropSlotDemo : DropSlot
    {
        public DataInfoDemo dataInfoDemo;
        public bool isOverrideOnDrop = true;
        public override void OnDrop(PointerEventData eventData)
        {
            base.OnDrop(eventData);
            if (!isOverrideOnDrop) return;
            var model = (DataInfoDemo) DropObj.m_ObjInfoComponent;
            dataInfoDemo.Initialize(model);
        }
    }
```

You can get the info of the drag object by casting the **DropObj.m\_ObjInfoComponent.**

Then, **do whatever you want.**&#x20;

For example, we call an Initialize function which replace the slot image to the draggable object image.&#x20;