前段时间在JavaEye上风风雨雨的
1 group.IsExpanded = true;
2 group.SetStyle(Styles.BODY_ALPHA, 0.8);
3 group.SetStyle(Styles.GROUP_FILL_COLOR, color);
4 group.SetStyle(Styles.GROUP_GRADIENT, Consts.GRADIENT_LINEAR_NORTHE
01 double angle = group.Angle;
02 double deep = group.Deep;
03 double gap = bounds.Height / Math.Tan(angle * Math.PI / 180);
04 PointCollection points = new PointCollection();
05 Point p1 = new Point(bounds.X - gap, bounds.Y + bounds.Height);
06 points.Add(p1);
07 Point p2 = new Point(bounds.X + bounds.Width, bounds.Y + bounds.Height);
08 points.Add(p2);
09 Point p3 = new Point(bounds.X + bounds.Width + gap, bounds.Y);
10 points.Add(p3);
11 points.Add(new Point(bounds.X, bounds.Y));
12 // Add
13 path.Data = this.CreateGeometry(points);
14 this.AddComponent(path);
15 this.AddBodyBounds(path.Data.Bounds);
接下来我们就需要绘制下面和右边那种3D的效果了，下方画一个小的平行四边形，这个我们只要计算好这个四边形的四个点就很容易绘制。这四个点可以通过大的大的平行四边形的下面两个点和高度得到：
01 // Add Bottom Rectangle
02 path = new Path();
03 // Set Fill
04 path.Fill = Utils.CreateSolidColorBrush(fillColor);
05 // Set Outline
06 this.SetStroke(path);
07 // Set Data
08 RectangleGeometry rectangleGeometry = new RectangleGeometry();
09 rectangleGeometry.Rect = new Rect(p1.X, p1.Y, p2.X-p1.X, deep);
10 // Add
11 path.Data = rectangleGeometry;
12 this.AddComponent(path);
13 this.AddBodyBounds(path.Data.Bounds);
右边的平行四边形也类似，这里就不详解了。看看运行后的效果
接下来我们就要实现这个Demo中的亮点：穿透效果。就是上层节点和下层节点有关联时，不同层之间的连线怎么去穿越group，这个就涉及到TWaver中
01 private void CreateCrossLayerLink(object fromID, object toID, bool left)
02 {
03 Node from = (Node)this.box.GetDataByID(fromID);
04 Node to = (Node)this.box.GetDataByID(toID);
05 if (from == null || to == null)
06 {
07 return;
08 }
09 ConnectPoint point = new ConnectPoint();
10 point.LayerID = from.LayerID;
11 double xOffset = -from.Width / 2 - 15;
12 if (left)
13 {
14 xOffset = from.Width / 2 + 15;
15 }
16 double yOffset = from.Height / 2 + 20;
17 double x = from.CenterLocation.X + xOffset;
18 double y = from.CenterLocation.Y + yOffset;
19 point.SetCenterLocation(x, y);
20 point.Parent = from.Parent;
21 this.box.Add(point);
22
23 LayerLink upLink = new LayerLink(from, point, true);
24 upLink.LayerID = from.LayerID;
25 upLink.Parent = from.Parent;
26 this.box.Add(upLink);
27
28 LayerLink downLink = new LayerLink(point, to, false);
29 downLink.LayerID = to.LayerID;
30 downLink.Parent = to.Parent;
31 this.box.Add(downLink);
32 }
下面附上工程的源码，有兴趣的朋友可以继续实现连接的弯曲和告警效果。 LayerDemo
