UGUI實現(xiàn)圖片拖拽功能
這一篇博客我們來使用UGUI實現(xiàn)圖片的拖拽功能。
說到拖拽,那必然離不開坐標,UGUI 的坐標有點不一樣,它有兩種坐標,一種是屏幕坐標,還有一種就是 UI 在Canvas內(nèi)的坐標(暫時叫做ugui坐標。),這兩個坐標是不一樣的,所以拖拽是就需要轉換。因為鼠標的移動是屏幕坐標,而 UI 的移動是ugui坐標。轉換的方法:
RectTransformUtility.ScreenPointToLocalPointInRectangle ( … );這個方法可以把屏幕坐標轉換成 ugui 坐標。至于屏幕坐標和 UGUI 坐標的區(qū)別、轉換之類的我就不講了,因為我也是一頭霧水,怕我說了你們直接關瀏覽器了。
這里我們只需要知道 UI 的坐標和鼠標的坐標是不一樣的,他們之間的相互移動需要轉換就行了。
既然需要轉換,就少不了使用方法。所以這里有一些官方的 UGUI監(jiān)聽事件:
(我就不獻丑翻譯了,英語還是有點渣。)
要給控件添加以上的監(jiān)聽事件,有三種方法:
1、編寫一個類,實現(xiàn)上面的接口(用哪個,實現(xiàn)哪個),給空間添加此腳本。
2、添加EventTrigger這個組件
添加想要添加的監(jiān)聽
然后就像給Buttong添加監(jiān)聽一樣添加方法就行。
3、程序動態(tài)添加
這里我使用第一種方法,后面兩種有機會的話就講一下。
現(xiàn)在我們就正式開始實現(xiàn)功能。新建一個 2D項目。場景中添加一張圖片(不一定要圖片,其他控件也行),然后給圖片添加腳本,名為MyDrag,編輯:
using UnityEngine; using UnityEngine.EventSystems; using System.Collections; using System; //給空間添加監(jiān)聽事件要實現(xiàn)的一些接口 public class MyDrag : MonoBehaviour, IPointerDownHandler, IDragHandler, IPointerUpHandler, IEndDragHandler, IPointerEnterHandler, IPointerExitHandler { public RectTransform canvas; //得到canvas的ugui坐標 private RectTransform imgRect; //得到圖片的ugui坐標 Vector2 offset = new Vector3(); //用來得到鼠標和圖片的差值 Vector3 imgReduceScale = new Vector3(0.8f, 0.8f, 1); //設置圖片縮放 Vector3 imgNormalScale = new Vector3(1, 1, 1); //正常大小 // Use this for initialization void Start () { imgRect = GetComponent<RectTransform>(); } //當鼠標按下時調(diào)用 接口對應 IPointerDownHandler public void OnPointerDown(PointerEventData eventData) { Vector2 mouseDown = eventData.position; //記錄鼠標按下時的屏幕坐標 Vector2 mouseUguiPos = new Vector2(); //定義一個接收返回的ugui坐標 //RectTransformUtility.ScreenPointToLocalPointInRectangle():把屏幕坐標轉化成ugui坐標 //canvas:坐標要轉換到哪一個物體上,這里img父類是Canvas,我們就用Canvas //eventData.enterEventCamera:這個事件是由哪個攝像機執(zhí)行的 //out mouseUguiPos:返回轉換后的ugui坐標 //isRect:方法返回一個bool值,判斷鼠標按下的點是否在要轉換的物體上 bool isRect = RectTransformUtility.ScreenPointToLocalPointInRectangle(canvas, mouseDown, eventData.enterEventCamera, out mouseUguiPos); if (isRect) //如果在 { //計算圖片中心和鼠標點的差值 offset = imgRect.anchoredPosition - mouseUguiPos; } } //當鼠標拖動時調(diào)用 對應接口 IDragHandler public void OnDrag(PointerEventData eventData) { Vector2 mouseDrag = eventData.position; //當鼠標拖動時的屏幕坐標 Vector2 uguiPos = new Vector2(); //用來接收轉換后的拖動坐標 //和上面類似 bool isRect = RectTransformUtility.ScreenPointToLocalPointInRectangle(canvas, mouseDrag, eventData.enterEventCamera, out uguiPos); if (isRect) { //設置圖片的ugui坐標與鼠標的ugui坐標保持不變 imgRect.anchoredPosition = offset + uguiPos; } } //當鼠標抬起時調(diào)用 對應接口 IPointerUpHandler public void OnPointerUp(PointerEventData eventData) { offset = Vector2.zero; } //當鼠標結束拖動時調(diào)用 對應接口 IEndDragHandler public void OnEndDrag(PointerEventData eventData) { offset = Vector2.zero; } //當鼠標進入圖片時調(diào)用 對應接口 IPointerEnterHandler public void OnPointerEnter(PointerEventData eventData) { imgRect.localScale = imgReduceScale; //縮小圖片 } //當鼠標退出圖片時調(diào)用 對應接口 IPointerExitHandler public void OnPointerExit(PointerEventData eventData) { imgRect.localScale = imgNormalScale; //回復圖片 } }
現(xiàn)在就實現(xiàn)了簡單的拖放功能。
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持我們。
上一篇:Unity3D動態(tài)生成平面網(wǎng)格
欄 目:C#教程
下一篇:Unity制作小地圖和方向導航
本文標題:UGUI實現(xiàn)圖片拖拽功能
本文地址:http://mengdiqiu.com.cn/a1/C_jiaocheng/4889.html
您可能感興趣的文章
- 01-10C#實現(xiàn)txt定位指定行完整實例
- 01-10WinForm實現(xiàn)仿視頻 器左下角滾動新聞效果的方法
- 01-10C#實現(xiàn)清空回收站的方法
- 01-10C#實現(xiàn)讀取注冊表監(jiān)控當前操作系統(tǒng)已安裝軟件變化的方法
- 01-10C#實現(xiàn)多線程下載文件的方法
- 01-10C#實現(xiàn)Winform中打開網(wǎng)頁頁面的方法
- 01-10C#實現(xiàn)遠程關閉計算機或重啟計算機的方法
- 01-10C#自定義簽名章實現(xiàn)方法
- 01-10C#文件斷點續(xù)傳實現(xiàn)方法
- 01-10winform實現(xiàn)創(chuàng)建最前端窗體的方法


閱讀排行
本欄相關
- 01-10C#通過反射獲取當前工程中所有窗體并
- 01-10關于ASP網(wǎng)頁無法打開的解決方案
- 01-10WinForm限制窗體不能移到屏幕外的方法
- 01-10WinForm繪制圓角的方法
- 01-10C#實現(xiàn)txt定位指定行完整實例
- 01-10WinForm實現(xiàn)仿視頻 器左下角滾動新
- 01-10C#停止線程的方法
- 01-10C#實現(xiàn)清空回收站的方法
- 01-10C#通過重寫Panel改變邊框顏色與寬度的
- 01-10C#實現(xiàn)讀取注冊表監(jiān)控當前操作系統(tǒng)已
隨機閱讀
- 04-02jquery與jsp,用jquery
- 01-10delphi制作wav文件的方法
- 01-11ajax實現(xiàn)頁面的局部加載
- 01-11Mac OSX 打開原生自帶讀寫NTFS功能(圖文
- 08-05DEDE織夢data目錄下的sessions文件夾有什
- 08-05織夢dedecms什么時候用欄目交叉功能?
- 01-10SublimeText編譯C開發(fā)環(huán)境設置
- 01-10使用C語言求解撲克牌的順子及n個骰子
- 01-10C#中split用法實例總結
- 08-05dedecms(織夢)副欄目數(shù)量限制代碼修改