Hi, today I will provide you with a simple backpack drag-and-drop function implementation. The code is very simple and the idea is also very simple. First, create an empty project, create a panel, create several images, and rename it to "cell", basically as shown in the figure below Show:
Add a few more, and add a Grid Layout Group component to the panel, so that these image components will be arranged in sequence. My settings are as shown in the figure:
Add a few more image components named: Item as the equipment in the backpack;
the appearance after completion is as follows:
Select all item components, and set the Canvas Group component in this component. See the picture for the specific settings:
image
This is the last step. Create a new c# script. I will post the code here and mark it with comments, so that everyone can paste the test and
upload the code. . . . .
using UnityEngine;
using System.Collections;
using UnityEngine.UI;
using UnityEngine.EventSystems;
public class ItemScript : MonoBehaviour,IBeginDragHandler,IDragHandler,IEndDragHandler {
//item原始的父物体（未拖拽时）
Transform originalParent;
//拖拽时的父物体
Transform dragParent;
//组件
CanvasGroup canvasGroup;
//标志位，是否在拖拽
bool isDrag;
void Start () {
dragParent = GameObject.FindWithTag ("Finish").transform;
canvasGroup = GetComponent<CanvasGroup>();
}
#region IBeginDragHandler implementation//开始拖拽
public void OnBeginDrag (PointerEventData eventData)
{
//开始拖拽时拿到item的父物体
originalParent = transform.parent;
//把item的父物体设置成canvas，这样item就会在最后渲染，它会显示在所有控件的最上方。
transform.SetParent(dragParent);
//可以向下检测其它的控件
canvasGroup.blocksRaycasts = false;
}
#endregion
#region IDragHandler implementation//拖拽中
public void OnDrag (PointerEventData eventData)
{
//拖拽中鼠标的位置即为item的位置。
transform.position = Input.mousePosition;
isDrag = true;
}
#endregion
#region IEndDragHandler implementation//拖拽结束
GameObject pointerEnterObject;
//GameObject tempPosition;
public void OnEndDrag (PointerEventData eventData)
{
//得到鼠标进入的物体
pointerEnterObject = eventData.pointerEnter;
//鼠标不能向下检测
canvasGroup.blocksRaycasts = true;
//1.检测鼠标是否拖拽到背包选择框的外部
if (pointerEnterObject==null) {
transform.position = originalParent.position;
transform.SetParent (originalParent);
isDrag = false;
return;
}
//2.如果不是在拖拽中，什么都不执行
if (isDrag==false) {
return;
}
//3.如果在拖拽中，并且鼠标在某个控件上
switch (pointerEnterObject.tag) {
//如果鼠标进入cell中
case "cell":
transform.position = pointerEnterObject.transform.position;
//设置父物体
transform.SetParent (pointerEnterObject.transform);
break;
//如果鼠标进入item中。交换两个item。
case "item":
//定义一个中间变量来存放交换的父物体
Transform temp=pointerEnterObject.transform.parent;
//设置另一个item的父物体
pointerEnterObject.transform.SetParent(originalParent);
//拖拽的item父物体
transform.SetParent(temp);
//设置另一个item的位置
pointerEnterObject.transform.position=originalParent.position;
//设置所拖拽item的位置
transform.position=temp.position;
break;
default:
transform.SetParent (originalParent);
transform.position = originalParent.position;
break;
}
isDrag = false;
}
#endregion
}
Then change the tag value of the canvas to "finish". All cell component tag values are changed to "cell".
Mount the script for each item component, and you can drag and drop the backpack. very simple