{"id":21046247,"url":"https://github.com/alfredo1995/drag-and-drop","last_synced_at":"2026-05-22T07:02:22.797Z","repository":{"id":199626675,"uuid":"703352541","full_name":"alfredo1995/drag-and-drop","owner":"alfredo1995","description":"Drag and Drop to drag and drop UI elements in Unity","archived":false,"fork":false,"pushed_at":"2026-02-05T05:28:34.000Z","size":1551,"stargazers_count":1,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-02-05T17:50:02.428Z","etag":null,"topics":["csharp","dotween","unity"],"latest_commit_sha":null,"homepage":"https://www.youtube.com/watch?v=LryEhLlCeeo\u0026t=173s","language":"C#","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/alfredo1995.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-10-11T04:55:36.000Z","updated_at":"2026-02-05T05:28:38.000Z","dependencies_parsed_at":null,"dependency_job_id":"93c0cee8-48a3-40b6-816f-65d60931c2ef","html_url":"https://github.com/alfredo1995/drag-and-drop","commit_stats":null,"previous_names":["alfredo1995/drag-and-drop"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/alfredo1995/drag-and-drop","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alfredo1995%2Fdrag-and-drop","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alfredo1995%2Fdrag-and-drop/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alfredo1995%2Fdrag-and-drop/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alfredo1995%2Fdrag-and-drop/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alfredo1995","download_url":"https://codeload.github.com/alfredo1995/drag-and-drop/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alfredo1995%2Fdrag-and-drop/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33333305,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-21T12:23:38.849Z","status":"online","status_checked_at":"2026-05-22T02:00:06.671Z","response_time":265,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["csharp","dotween","unity"],"created_at":"2024-11-19T14:28:41.140Z","updated_at":"2026-05-22T07:02:22.791Z","avatar_url":"https://github.com/alfredo1995.png","language":"C#","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Drag and Drop to drag and drop UI elements in Unity \n\n\n\nhttps://github.com/user-attachments/assets/6fb74576-5c3c-4668-ab0a-772b73568c18\n\n\n\u003cbr\u003e \n\nIDropHandler\n\n    IDropHandler é uma interface usada para implementar funcionalidades de manipulação de arrasto e soltar (drag and drop) entre objetos da cena\n\n0° Criar Canvas do tipo imagem \n \n    Criar Canvas do tipo imagem \u003e Create Empty \u003e GameOject \u003e Image \u003e arrastar os sprites (apple and box)\n\n\n1° Capturar o evento de clique do mouse no objeto \n\n\t//Criar um script e anexar no GameOject apple (drag) que será arastado ate o GameOject box (drop)\n\n\t*Importar o sitstema de evento \n\t*Herdar a class IpointerDownHandler (manipulador de entrada do mouse precionado ou clicado)\n\t*Criar função que será chamada quando o mouse for precionado, enquanto estiver em cima do objeto\n\t*fazer um log de depuração para fins de test function\n\n\tusing UnityEngine.EventSystems;\n\n\tpublic class DragDrop : MonoBehaviour, IPointerDownHandler \n\t{\n\tpublic void OnPointerDown(PointerEventDate eventData)\n\t{\n\t\tDebug.Log(\"OnPointerDown\");\n\t}}\n\n\n2° Capturar o evento(Calling Funciton) de quando o mouse estiver iniciando o arrasto e terminando de arrastar o GameOject \n\n\n\t\n\t*Herdar a interface IBeginDragHandler  (manipulador de entrada do mouse quando começar arrastar)\n\t*Herdar a interface IEndDragHandler    (manipulador de entrada do mouse quando terminar de arrastar)\n\t*Herdar a interface IDragHandler       (manipulador de entrada do mouse para conseguir arrasta a cada frame)\n\n\n\n\tpublic class DragDrop : MonoBehaviour, IPointerDownHandler, IBeginDragHandler, IEndDragHandler, IDragHandler\n        {\n      \n        public void OnBeginDrag(PointerEventData eventData)\n        {\n     \t   Debug.Log(\"OnBeginDrag\");\n        }\n\n   \tpublic void OnEndDrag(PointerEventData eventData)\n   \t{\n  \t   Debug.Log(\"OnEndDrag\");\n  \t}\t\n\n   \tpublic void OnDrag(PointerEventData eventData)\n   \t{\n           Debug.Log(\"OnDrag\");\n        }\n\n   \tpublic void OnPointerDown(PointerEventData eventData)\n  \t{\n           Debug.Log(\"OnDownDrag\");\n        }}\n\n\n\n3° Manipular o movimento do objeto na função chamando o metodo de arrastar\n\n\t*referenciar o componente ReactTransform (moviment) \n\n\t*criar o metodo awake() para inicializar o objeto quando instaciado(criado)\n\t*manipular a posição acessando o componente - reactTransform = GetComponent\u003cReactTransform\u003e();\n\n\t*modificar a posição ancora e nos dados do evento pegar o delta (evento quando um objeto da UI está sendo arrastado)\n\n\t*ancora (a posição ancorada especifica onde um objeto sera posicionado em relação a um ponto específico)\n\t*delta  (mudança entre valores em quadros consecutivos, seja no tempo, posição, rotação, etc)\n\n\t*reactTransform.anchoredPosition += eventData.delta;\n\t\n\n\tpublic class DragDrop : MonoBehaviour, IPointerDownHandler, IBeginDragHandler, IEndDragHandler, IDragHandler\n\t{\n         \n        private RectTransform rectTransform;\n\n        private void Awake()\n        {\n\t   rectTransform = GetComponent\u003cRectTransform\u003e();\n        }\n\n        public void OnBeginDrag(PointerEventData eventData)\n        {\n           Debug.Log(\"OnBeginDrag\");\n        }\n\n   \tpublic void OnEndDrag(PointerEventData eventData)\n  \t{\n            Debug.Log(\"OnEndDrag\");\n        }\n\n        public void OnDrag(PointerEventData eventData)\n        {\n   \t     Debug.Log(\"OnDrag\");\n\t     rectTransform.anchoredPosition += eventData.delta;\n        }\n\n \tpublic void OnPointerDown(PointerEventData eventData)\n   \t{\n   \t     Debug.Log(\"OnDownDrag\");\n        }}\n\t\n\n4° Alterar o movimento exatamente na mesma taxa (proporcionalmente 1:1) que o ponteiro do mouse ou toque  (tamanho da tela ou da resolução)\n\n\t//Este método é chamado continuamente enquanto o usuário arrasta o objeto.\n        //Se você arrastar o ponteiro do mouse 10 pixels em uma direção, o objeto também se moverá 10 pixels nessa mesma direção.\n\t\n\t*referênciar o componente Canvas \t\n\n\t*atribuindo referência a um componente RectTransform do objeto da UI\n\t*anchoredPosition: É usado para mover o objeto mantendo sua relação com um ponto fixo.\n\t*+=: Significa que estamos adicionando um valor à posição ancorada atual do objeto.\n\t*eventData.delta: É a diferença entre a posição atual do arraste e a posição anterior do arraste. (vector q representa a quantidade de movimento que ocorreu.)\n\t*/ canvas.scaleFactor: Dividindo o eventData.delta pelo scaleFactor do objeto canvas. (Feito para levar em consideração a escala do canvas.)\n\n\t//ajustando a posição ancorada do objeto da UI com base na diferença de arrasto (movimento) do ponteiro do mouse ou toque, levando em consideração o fator de escala do canvas. \n\n\n        [SerializeField] private Canvas canvas;\n\n\tpublic void OnDrag(PointerEventData eventData)\n\t{\n \t   rectTransform.anchoredPosition += eventData.delta / canvas.scaleFactor;\n\t}\n\n\n5° Manipular componente CanvasGroup p/ controlar a visibilidade e a interatividade de um grupo de objetos dentro de um Canvas\n\n\t*Adicionar um novo componente do tipo \"canvas group\" no gameobject apple (drag)\n\n\t*referenciar componente CanvasGroup no script DragDrop.cs\n\n\t*Criar metodo Awake chamado quando o objeto ao qual o script está anexado é inicializado.\n\t*Acessar e manipular o componente CanvasGroup por meio da variável canvasGroup.\n\n\tprivate CanvasGroup canvasGroup;\n\n\tprivate void Awake()\n\t{\n\t   canvasGroup = GetComponent\u003cCanvasGroup\u003e();\n\t}\n\n\n6° Desabilitar o item arrastavel na captura dos eventos (começando e terminando o arrasto)\n\n\t//raycast é uma operação que permite detectar colisões e interações entre objetos.\n\n \t//quando começar arrastar, entraremos no CanvasGroup e desabilitar o raycast\t\n\tpublic void OnBeginDrag(PointerEventData eventData)\n\t{\n\t   //modificar a cor\n\t   canvasGroup.alpha = .6f;\n\t   canvasGroup.blocksRaycasts = false;\n\t}\n\t\n\t//quando terminar arrastar, entraremos no CanvasGroup e habilitar o raycast \n\tpublic void OnEndDrag(PointEventData eventData)\n\t{\n\t    canvasGroup.alpha = .1f;\n\t    canvasGroup.blocksRaycasts = true;\n\n\n7° Interface IDropHandler usada nos eventos de arrastar e soltar para manipular o comportamento quando um objeto é solto em um alvo de soltar.\n\n\n\t//A assinatura de um método em programação se refere à sua estrutura e formato (interface) \n\t//incluindo o nome do método, os parâmetros que ele recebe e o tipo de retorno (assinatura)\n\n\t\n\t*Criar um novo script ItemSlot.cs e anexar no gameobject box (slot) \t\n\t*Criar função OnDrop, que será chamada quando um objeto for inserido\n\n\tpublic class ItemSlot : MonoBehaviour, IDropHandler\n\n\tpublic void OnDrop(PointerEventData eventData)\n\t{\n           Debug.log(\"objeto e solto em um alvo de soltar\");\n\t}\n\n\n8° Posicionar o objeto arrastado no local do objeto de soltar (arrastado e liberado)\n\n\t\n\t//Acessar o metodo OnDrop quando um objeto é solto (arrastado e liberado) sobre um elemento que implementa a interface ID\n\n\t//if (Verificar se há um objeto arrastado válido.)\n\n\t//Depois obter o componente RectTransform do objeto arrastado. Permite que você acesse e modifique as propriedades do objeto arrastado.\n\n\t// atribuição (a posição do objeto arrastado será ajustada para ser a mesma que a posição do objeto onde ele foi solto.)\n\n\tpublic void OnDrop(PointerEventData eventData) \n        {\n           if (eventData.pointerDrag != null)\n           {\n              eventData.pointerDrag.GetComponent\u003cRectTransform\u003e().anchoredPosition = GetComponent\u003cRectTransform\u003e().anchoredPosition;\n           }\n        }\n\n\n  \u003cimg width=\"950\" height=\"750\" alt=\"image\" src=\"https://github.com/user-attachments/assets/486dd2f9-128d-4444-bcc2-165c3106a45f\" /\u003e\n\n \n \n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falfredo1995%2Fdrag-and-drop","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falfredo1995%2Fdrag-and-drop","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falfredo1995%2Fdrag-and-drop/lists"}