效果
![](https://i-blog.csdnimg.cn/direct/535c1790368b427ca727c7a990a4027e.gif)
1.界面设置
![](https://i-blog.csdnimg.cn/direct/b072866b58764f5aab32222b369dcf0b.png)
![](https://i-blog.csdnimg.cn/direct/ab9c836200a24eb48aa8fb77f021d239.png)
![](https://i-blog.csdnimg.cn/direct/12f63ce5adf8440b9533c58faafab79d.png)
2.涉及两个脚本UIDraw.cs和UIDrawLine.cs
UIDraw.cs
using System;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;
using UnityEngine.UI;
public class UIDraw : MonoBehaviour, IPointerEnterHandler, IPointerExitHandler , IPointerDownHandler, IPointerUpHandler
{
public Color DrawColor = Color.red;
[Range(3,10)]
public int DrawWidth = 3;
public Color BgColor = new Color(0, 0, 0, 0);
Vector2 lastPosition;
public UIDrawLine UIDrawLine;
List<Vector2> Vertics = new List<Vector2>();
List<List<Vector2>> CachVertics = new List<List<Vector2>>();
void Awake()
{
}
public RectTransform Drawer;
void Update()
{
if (canDraw)
{
Drawer.position = Input.mousePosition;
DrawPoint(Drawer.anchoredPosition);
#if UNITY_ANDROID||UNITY_IPHONE
#endif
}
}
public void OnPointerDown(PointerEventData eventData)
{
canDraw = true;
}
public void OnPointerUp(PointerEventData eventData)
{
canDraw = false;
//添加结尾
lastPosition = Vector2.zero;
AddPoint(lastPosition);
//添加到缓存
AddToCach();
}
bool canDraw;
public void OnPointerEnter(PointerEventData eventData)
{
}
public void OnPointerExit(PointerEventData eventData)
{
lastPosition = Vector2.zero;
AddPoint(lastPosition);
}
public void DrawPoint(Vector2 point)
{
if (lastPosition == Vector2.zero)
{
lastPosition = point;
}
UpdateColor(lastPosition, point, DrawWidth, DrawColor);
}
public void UpdateColor(Vector2 start_point, Vector2 end_point, int width, Color color)
{
float distance = Vector2.Distance(start_point, end_point);
if (distance < 0.1f) return;
AddPoint(end_point) ;
lastPosition = end_point;
}
void AddPoint(Vector2 v)
{
Vertics.Add(v);
UIDrawLine.Vertices.Add(v);
UIDrawLine.SetAllDirty();
}
private void AddToCach()
{
List<Vector2> list = new List<Vector2>();
list.AddRange(Vertics);
CachVertics.Add(list);
Vertics.Clear();
}
public void UnDo()
{
if (CachVertics.Count == 0) return;
CachVertics.RemoveAt(CachVertics.Count-1);
UIDrawLine.Vertices.Clear();
for (int i = 0; i < CachVertics.Count; i++)
{
UIDrawLine.Vertices.AddRange(CachVertics[i]);
}
UIDrawLine.SetAllDirty();
}
public void Send()
{
//UIDrawLine.Vertices;
Clear();
//gameObject.SetActive(false);
}
internal void Clear()
{
UIDrawLine.Vertices.Clear();
UIDrawLine.SetAllDirty();
Vertics.Clear();
CachVertics.Clear();
}
void OnDisable()
{
Clear();
}
}
UIDrawLine.cs
using System;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
[AddComponentMenu("UI/Extensions/UI Line")]
public class UIDrawLine : MaskableGraphic
{
[SerializeField]
Texture m_Texture;
public float thickness = 5;
public List<Vector2> Vertices=new List<Vector2> ();
private float size = 0;
public override Texture mainTexture
{
get
{
return m_Texture == null ? s_WhiteTexture : m_Texture;
}
}
public Texture texture
{
get
{
return m_Texture;
}
set
{
if (m_Texture == value) return;
m_Texture = value;
SetVerticesDirty();
SetMaterialDirty();
}
}
protected override void OnEnable()
{
Vertices.Clear();
}
void Update()
{
}
protected UIVertex[] SetVbo(Vector2[] vertices, Vector2[] uvs)
{
UIVertex[] vbo = new UIVertex[4];
for (int i = 0; i < vertices.Length; i++)
{
var vert = UIVertex.simpleVert;
vert.color = color;
vert.position = vertices[i];
vert.uv0 = uvs[i];
vbo[i] = vert;
}
return vbo;
}
//生成方格的四个点
protected override void OnPopulateMesh(VertexHelper vh)
{
vh.Clear();
Vector2 uv0 = new Vector2(0, 1);
Vector2 uv1 = new Vector2(1, 1);
Vector2 uv2 = new Vector2(1, 0);
Vector2 uv3 = new Vector2(0, 0);
Vector2 lastPos0 = Vector2.zero;
Vector2 lastPos1 = Vector2.zero;
Vector2 lastPos2 = Vector2.zero;
Vector2 lastPos3 = Vector2.zero;
for (int i = 1; i < Vertices.Count; i++)
{
//当有0是说明是结束点,开始下个画线
if (Vertices[i - 1]==Vector2.zero || Vertices[i]== Vector2.zero)
{
lastPos0 = Vector2.zero;
continue;
}
Vector2 v = Rotate90(Vertices[i] - Vertices[i - 1]).normalized;
Vector2 pos0 = Vertices[i - 1]- v * thickness * 0.5f;
Vector2 pos1 = Vertices[i]- v * thickness * 0.5f;
Vector2 pos2 = pos1 + v * thickness;
Vector2 pos3 = pos0 + v * thickness;
vh.AddUIVertexQuad(SetVbo(new[] { pos0, pos1, pos2, pos3 }, new[] { uv0, uv1, uv2, uv3 }));
//角
if (lastPos0!=Vector2.zero)
{
Vector2 p0 = pos0;
Vector2 p1 = lastPos1;
Vector2 p2 = pos3;
Vector2 p3 = lastPos2;
vh.AddUIVertexQuad(SetVbo(new[] { p0, p1, p2, p3 }, new[] { uv0, uv1, uv2, uv3 }));
}
lastPos0 = pos0;
lastPos1 = pos1;
lastPos2 = pos2;
lastPos3 = pos3;
}
}
private Vector2 Rotate90(Vector2 p)
{
return new Vector2(p.y, -p.x);
}
}