如何使用WPF实现一个平面三角形3D运动效果?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。
实现效果如下:
思路:封装三角形三个顶点和路径的三角形类,图形渲染时同步更新公共顶点三角形的顶点位置。
步骤:
1、三角形类Triangle.cs
public Point A, B, C;//初始三个顶点 public Point VA, VB, VC;//运动的三个顶点 public Path trianglePath;//三角形路径 public Color triangleColor;//填充 public double ColorIndex;//颜色深度 public Triangle(Point a, Point b, Point c, Color co, double z) { A = VA = a; B = VB = b; C = VC = c; triangleColor = co; ColorIndex = z; trianglePath = new Path(); Draw(); } /// <summary> /// 绘制三角形 /// </summary> public void Draw() { var g = new StreamGeometry(); using (StreamGeometryContext context = g.Open()) { context.BeginFigure(VA, true, true); context.LineTo(VB, true, false); context.LineTo(VC, true, false); } trianglePath.Data = g; trianglePath.Fill = new SolidColorBrush(triangleColor); }
2、 三角形系统类TriangleSystem.cs
public class TriangleSystem { /// <summary> /// 三角形列表 /// </summary> private List<Triangle> triangles; /// <summary> /// 点和与其对应三角形字典 /// </summary> public Dictionary<Point, PointClass> pointTriangles; /// <summary> /// 容器 /// </summary> private Canvas containerCanvas; /// <summary> /// 三角形宽 /// </summary> private int triangleWidth = 100; /// <summary> /// 三角形高 /// </summary> private int triangleHeight = 100; /// <summary> /// 三角形横向数量 /// </summary> private int horizontalCount = 10; /// <summary> /// 三角形纵向数量 /// </summary> private int verticalCount = 5; /// <summary> /// X坐标运动范围 /// </summary> private int XRange = 100; /// <summary> /// Y坐标运动范围 /// </summary> private int YRange = 10; /// <summary> /// 坐标运动速度 /// </summary> private int speed = 10; /// <summary> /// 三角形颜色深度 /// </summary> private double zIndex = 10.0; /// <summary> /// 随机数 /// </summary> private Random random; public TriangleSystem(Canvas ca) { containerCanvas = ca; random = new Random(); triangles = new List<Triangle>(); pointTriangles = new Dictionary<Point, PointClass>(); SpawnTriangle(); } /// <summary> /// 三角形初始化 /// </summary> private void SpawnTriangle() { //清空队列 triangles.Clear(); for (int i = 0; i < horizontalCount; i++) { for (int j = 0; j < verticalCount; j++) { Point A = new Point(i * triangleWidth, j * triangleHeight); Point B = new Point(i * triangleWidth, (j + 1) * triangleHeight); Point C = new Point((i + 1) * triangleWidth, (j + 1) * triangleHeight); Point D = new Point((i + 1) * triangleWidth, j * triangleHeight); double index = (i * horizontalCount / zIndex + j * verticalCount / zIndex ) / zIndex; index = index > 1 ? 1 : index < 0.1 ? 0.1 : index; Triangle t1 = new Triangle(A, B, C, GetTriangleColor(index), index); Triangle t2 = new Triangle(A, D, C, GetTriangleColor(index - 0.1), index - 0.1); //公共点和三角形集合键值对 AddPointTriangles(A, t1, t2); AddPointTriangles(B, t1, t2); AddPointTriangles(C, t1, t2); AddPointTriangles(D, t1, t2); //添加三角形 this.containerCanvas.Children.Add(t1.trianglePath); this.containerCanvas.Children.Add(t2.trianglePath); this.triangles.Add(t1); this.triangles.Add(t2); } } } /// <summary> /// 添加公共点和三角形集合键值对 /// </summary> private void AddPointTriangles(Point p, Triangle t1, Triangle t2) { if (!this.pointTriangles.Keys.Contains(p)) { List<Triangle> ts = new List<Triangle>(); ts.Add(t1); ts.Add(t2); PointClass pc = new PointClass { triangles = ts, vector = new Vector(random.Next(-speed, speed) * 0.05, random.Next(-speed, speed) * 0.05), }; this.pointTriangles.Add(p, pc); } else { if (!this.pointTriangles[p].triangles.Contains(t1)) this.pointTriangles[p].triangles.Add(t1); if (!this.pointTriangles[p].triangles.Contains(t2)) this.pointTriangles[p].triangles.Add(t2); } } /// <summary> /// 获取三角形颜色 /// </summary> private Color GetTriangleColor(double index) { return Color.FromArgb((byte)(255 * index), 230, 18, 65); } /// <summary> /// 更新三角形 /// </summary> public void Update() { foreach (var pt in pointTriangles) { foreach (var t in pt.Value.triangles) { if (t.A == pt.Key) t.VA = GetPointValue(t.VA, t.A, ref pt.Value.vector, ref t.triangleColor, ref t.ColorIndex); if (t.B == pt.Key) t.VB = GetPointValue(t.VB, t.B, ref pt.Value.vector, ref t.triangleColor, ref t.ColorIndex); if (t.C == pt.Key) t.VC = GetPointValue(t.VC, t.C, ref pt.Value.vector, ref t.triangleColor, ref t.ColorIndex); t.Draw(); } } } /// <summary> /// 计算顶点值 /// </summary> private Point GetPointValue(Point p1, Point p2, ref Vector v, ref Color c, ref double index) { Point getPoint = new Point(); if (p1.X + v.X < p2.X + XRange && p1.X + v.X > p2.X - XRange) getPoint.X = p1.X + v.X; else { v.X = -v.X; index = index > 1 ? index - 0.01 : index < 0.01 ? index + 0.01 : index - 0.01; c = GetTriangleColor(index); getPoint.X = p1.X + v.X; } if (p1.Y + v.Y < p2.Y + YRange && p1.Y + v.Y > p2.Y - YRange) getPoint.Y = p1.Y + v.Y; else { v.Y = -v.Y; getPoint.Y = p1.Y + v.Y; } return getPoint; } }
3、PointClass.cs
public class PointClass { public List<Triangle> triangles; public Vector vector; }
4、主窗体交互逻辑
private TriangleSystem ts; public MainWindow() { InitializeComponent(); ts = new TriangleSystem(this.mainCanvas); CompositionTarget.Rendering += CompositionTarget_Rendering; } /// <summary> /// 帧渲染事件 /// </summary> private void CompositionTarget_Rendering(object sender, EventArgs e) { ts.Update(); }
不足:其中颜色渲染方式不够完善,无法完全模仿3D起伏的效果
关于如何使用WPF实现一个平面三角形3D运动效果问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注亿速云行业资讯频道了解更多相关知识。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。