添加测试shader，抽象线路绘制功能

Runtime/UILineRenderer.cs

@@ -3,35 +3,69 @@ using UnityEngine.UI;
 
 namespace XericLibrary
 {
+    /// <summary>
+    /// UILineRenderer 是一个用于在 UI 上绘制连续线条的组件
+    /// 支持设置线条厚度、居中显示，并为线段之间添加斜角边缘
+    /// 继承自 MaskableGraphic，可与 UI 遮罩系统配合使用
+    /// </summary>
     [RequireComponent(typeof(CanvasRenderer))]
     public class UILineRenderer : MaskableGraphic
     {
+        /// <summary>
+        /// 线条的顶点数组，至少需要 2 个点才能绘制线条
+        /// 点的坐标基于本地空间，中心点由 center 属性控制
+        /// </summary>
         public Vector2[] points;
 
+        /// <summary>
+        /// 线条的厚度，单位为像素
+        /// </summary>
         public float thickness = 10f;
+        
+        /// <summary>
+        /// 是否将线条居中显示
+        /// true: 线条将以组件中心为原点
+        /// false: 线条将以组件左下角为原点
+        /// </summary>
         public bool center = true;
 
+        /// <summary>
+        /// 重写 MaskableGraphic 的方法，用于生成线条的网格
+        /// 当 UI 需要重建时会自动调用此方法
+        /// </summary>
+        /// <param name="vh">用于构建网格的 VertexHelper 对象</param>
         protected override void OnPopulateMesh(VertexHelper vh)
         {
+            // 清空现有的网格数据
             vh.Clear();
 
+            // 至少需要 2 个点才能绘制线条
             if (points.Length < 2)
                 return;
 
+            // 计算线路总长度
+            float totalLength = UILineRendererUtils.CalculateTotalLength(points);
+            float currentLength = 0f;
+
+            // 遍历所有点，创建线段并添加到网格中
             for (int i = 0; i < points.Length-1; i++)
             {
-                // Create a line segment between the next two points
-                CreateLineSegment(points[i], points[i+1], vh);
+                // 使用静态工具方法创建当前点与下一个点之间的线段
+                // 传递当前累积长度和总长度用于UV坐标计算
+                UILineRendererUtils.CreateLineSegment(points[i], points[i+1], thickness, center, rectTransform.sizeDelta, color, vh, currentLength, totalLength);
 
+                // 更新累积长度
+                currentLength += Vector2.Distance(points[i], points[i+1]);
+
+                // 计算当前线段的顶点索引（每个线段包含 5 个顶点）
                 int index = i * 5;
 
-                // Add the line segment to the triangles array
+                // 添加线段的两个三角形（构成矩形线段）
                 vh.AddTriangle(index, index+1, index+3);
                 vh.AddTriangle(index+3, index+2, index);
 
-                // These two triangles create the beveled edges
-                // between line segments using the end point of
-                // the last line segment and the start points of this one
+                // 为线段之间添加斜角边缘
+                // 使用上一个线段的终点和当前线段的起点创建过渡三角形
                 if (i != 0)
                 {
                     vh.AddTriangle(index, index-1, index-3);
@@ -39,53 +73,5 @@ namespace XericLibrary
                 }
             }
         }
-
-        /// <summary>
-        /// Creates a rect from two points that acts as a line segment
-        /// </summary>
-        /// <param name="point1">The starting point of the segment</param>
-        /// <param name="point2">The endint point of the segment</param>
-        /// <param name="vh">The vertex helper that the segment is added to</param>
-        private void CreateLineSegment(Vector3 point1, Vector3 point2, VertexHelper vh)
-        {
-            Vector3 offset = center ? (rectTransform.sizeDelta / 2) : Vector2.zero;
-
-            // Create vertex template
-            UIVertex vertex = UIVertex.simpleVert;
-            vertex.color = color;
-
-            // Create the start of the segment
-            Quaternion point1Rotation = Quaternion.Euler(0, 0, RotatePointTowards(point1, point2) + 90);
-            vertex.position = point1Rotation * new Vector3(-thickness / 2, 0);
-            vertex.position += point1 - offset;
-            vh.AddVert(vertex);
-            vertex.position = point1Rotation * new Vector3(thickness / 2, 0);
-            vertex.position += point1 - offset;
-            vh.AddVert(vertex);
-
-            // Create the end of the segment
-            Quaternion point2Rotation = Quaternion.Euler(0, 0, RotatePointTowards(point2, point1) - 90);
-            vertex.position = point2Rotation * new Vector3(-thickness / 2, 0);
-            vertex.position += point2 - offset;
-            vh.AddVert(vertex);
-            vertex.position = point2Rotation * new Vector3(thickness / 2, 0);
-            vertex.position += point2 - offset;
-            vh.AddVert(vertex);
-
-            // Also add the end point
-            vertex.position = point2 - offset;
-            vh.AddVert(vertex);
-        }
-
-        /// <summary>
-        /// Gets the angle that a vertex needs to rotate to face target vertex
-        /// </summary>
-        /// <param name="vertex">The vertex being rotated</param>
-        /// <param name="target">The vertex to rotate towards</param>
-        /// <returns>The angle required to rotate vertex towards target</returns>
-        private float RotatePointTowards(Vector2 vertex, Vector2 target)
-        {
-            return (float)(Mathf.Atan2(target.y - vertex.y, target.x - vertex.x) * (180 / Mathf.PI));
-        }
     }
-}
+}