1
0
mirror of https://github.com/Siccity/xNode.git synced 2026-02-04 22:34:54 +08:00

Added gradients to connection noodles (#191)

Upgrade notice: Override GetNoodleGradient instead of GetNoodleColor
This commit is contained in:
Igor Vasiak 2019-10-15 12:13:55 -03:00 committed by Thor Brigsted
parent ceb4700eda
commit 63b0bf428b
3 changed files with 104 additions and 35 deletions

View File

@ -471,8 +471,7 @@ namespace XNodeEditor {
/// <summary> Draw a connection as we are dragging it </summary> /// <summary> Draw a connection as we are dragging it </summary>
public void DrawDraggedConnection() { public void DrawDraggedConnection() {
if (IsDraggingPort) { if (IsDraggingPort) {
Color col = NodeEditorPreferences.GetTypeColor(draggedOutput.ValueType); Gradient gradient = graphEditor.GetNoodleGradient(draggedOutput, null);
col.a = draggedOutputTarget != null ? 1.0f : 0.6f;
Rect fromRect; Rect fromRect;
if (!_portConnectionPoints.TryGetValue(draggedOutput, out fromRect)) return; if (!_portConnectionPoints.TryGetValue(draggedOutput, out fromRect)) return;
@ -484,10 +483,10 @@ namespace XNodeEditor {
if (draggedOutputTarget != null) gridPoints.Add(portConnectionPoints[draggedOutputTarget].center); if (draggedOutputTarget != null) gridPoints.Add(portConnectionPoints[draggedOutputTarget].center);
else gridPoints.Add(WindowToGridPosition(Event.current.mousePosition)); else gridPoints.Add(WindowToGridPosition(Event.current.mousePosition));
DrawNoodle(col, gridPoints); DrawNoodle(gradient, gridPoints);
Color bgcol = Color.black; Color bgcol = Color.black;
Color frcol = col; Color frcol = gradient.colorKeys[0].color;
bgcol.a = 0.6f; bgcol.a = 0.6f;
frcol.a = 0.6f; frcol.a = 0.6f;

View File

@ -117,39 +117,64 @@ namespace XNodeEditor {
} }
/// <summary> Draw a bezier from output to input in grid coordinates </summary> /// <summary> Draw a bezier from output to input in grid coordinates </summary>
public void DrawNoodle(Color col, List<Vector2> gridPoints) { public void DrawNoodle(Gradient gradient, List<Vector2> gridPoints) {
Vector2[] windowPoints = gridPoints.Select(x => GridToWindowPosition(x)).ToArray(); Vector2[] windowPoints = gridPoints.Select(x => GridToWindowPosition(x)).ToArray();
Handles.color = col; Handles.color = gradient.Evaluate(0f);
int length = gridPoints.Count; int length = gridPoints.Count;
switch (NodeEditorPreferences.GetSettings().noodleType) { switch (NodeEditorPreferences.GetSettings().noodleType) {
case NodeEditorPreferences.NoodleType.Curve: case NodeEditorPreferences.NoodleType.Curve:
Vector2 outputTangent = Vector2.right; Vector2 outputTangent = Vector2.right;
for (int i = 0; i < length - 1; i++) { for (int i = 0; i < length - 1; i++) {
Vector2 inputTangent = Vector2.left; Vector2 inputTangent = Vector2.left;
// Cached most variables that repeat themselves here to avoid so many indexer calls :p
if (i == 0) outputTangent = Vector2.right * Vector2.Distance(windowPoints[i], windowPoints[i + 1]) * 0.01f * zoom; Vector2 point_a = windowPoints[i];
Vector2 point_b = windowPoints[i + 1];
float dist_ab = Vector2.Distance(point_a, point_b);
if (i == 0) outputTangent = Vector2.right * dist_ab * 0.01f * zoom;
if (i < length - 2) { if (i < length - 2) {
Vector2 ab = (windowPoints[i + 1] - windowPoints[i]).normalized; Vector2 point_c = windowPoints[i + 2];
Vector2 cb = (windowPoints[i + 1] - windowPoints[i + 2]).normalized; Vector2 ab = (point_b - point_a).normalized;
Vector2 ac = (windowPoints[i + 2] - windowPoints[i]).normalized; Vector2 cb = (point_b - point_c).normalized;
Vector2 ac = (point_c - point_a).normalized;
Vector2 p = (ab + cb) * 0.5f; Vector2 p = (ab + cb) * 0.5f;
float tangentLength = (Vector2.Distance(windowPoints[i], windowPoints[i + 1]) + Vector2.Distance(windowPoints[i + 1], windowPoints[i + 2])) * 0.005f * zoom; float tangentLength = (dist_ab + Vector2.Distance(point_b, point_c)) * 0.005f * zoom;
float side = ((ac.x * (windowPoints[i + 1].y - windowPoints[i].y)) - (ac.y * (windowPoints[i + 1].x - windowPoints[i].x))); float side = ((ac.x * (point_b.y - point_a.y)) - (ac.y * (point_b.x - point_a.x)));
p = new Vector2(-p.y, p.x) * Mathf.Sign(side) * tangentLength; p = new Vector2(-p.y, p.x) * Mathf.Sign(side) * tangentLength;
inputTangent = p; inputTangent = p;
} } else {
else { inputTangent = Vector2.left * dist_ab * 0.01f * zoom;
inputTangent = Vector2.left * Vector2.Distance(windowPoints[i], windowPoints[i + 1]) * 0.01f * zoom;
} }
Handles.DrawBezier(windowPoints[i], windowPoints[i + 1], windowPoints[i] + ((outputTangent * 50) / zoom), windowPoints[i + 1] + ((inputTangent * 50) / zoom), col, null, 4); // Calculates the tangents for the bezier's curves.
Vector2 tangent_a = point_a + outputTangent * 50 / zoom;
Vector2 tangent_b = point_b + inputTangent * 50 / zoom;
// Hover effect.
int bezier_width = 4;
int division = Mathf.RoundToInt(.1f * dist_ab) + 3;
Vector3[] points = Handles.MakeBezierPoints(point_a, point_b, tangent_a, tangent_b, division);
// Coloring and bezier drawing.
for (int j = 0; j < points.Length - 1; j++) {
if (i == gridPoints.Count - 2) Handles.color = gradient.Evaluate((j + 1f) / points.Length);
Handles.DrawAAPolyLine(bezier_width, points[j], points[j + 1]);
}
outputTangent = -inputTangent; outputTangent = -inputTangent;
} }
break; break;
case NodeEditorPreferences.NoodleType.Line: case NodeEditorPreferences.NoodleType.Line:
for (int i = 0; i < length - 1; i++) { for (int i = 0; i < length - 1; i++) {
Handles.DrawAAPolyLine(5, windowPoints[i], windowPoints[i + 1]); Vector2 point_a = windowPoints[i];
Vector2 point_b = windowPoints[i + 1];
// Hover effect.
int line_width = 5;
// Draws the line with the coloring.
Vector2 prev_point = point_a;
for (float j = 0; j < 1; j += 10f / Vector2.Distance(point_a, point_b)) {
Vector2 lerp = Vector2.Lerp(point_a, point_b, j);
if (i == gridPoints.Count - 2) Handles.color = gradient.Evaluate(j);
Handles.DrawAAPolyLine(line_width, prev_point, lerp);
prev_point = lerp;
}
} }
break; break;
case NodeEditorPreferences.NoodleType.Angled: case NodeEditorPreferences.NoodleType.Angled:
@ -161,9 +186,17 @@ namespace XNodeEditor {
Vector2 end_1 = windowPoints[i + 1]; Vector2 end_1 = windowPoints[i + 1];
start_1.x = midpoint; start_1.x = midpoint;
end_1.x = midpoint; end_1.x = midpoint;
Handles.DrawAAPolyLine(5, windowPoints[i], start_1); if (i == gridPoints.Count - 2) {
Handles.DrawAAPolyLine(5, start_1, end_1); Handles.DrawAAPolyLine(5, windowPoints[i], start_1);
Handles.DrawAAPolyLine(5, end_1, windowPoints[i + 1]); Handles.color = gradient.Evaluate(0.5f);
Handles.DrawAAPolyLine(5, start_1, end_1);
Handles.color = gradient.Evaluate(1f);
Handles.DrawAAPolyLine(5, end_1, windowPoints[i + 1]);
} else {
Handles.DrawAAPolyLine(5, windowPoints[i], start_1);
Handles.DrawAAPolyLine(5, start_1, end_1);
Handles.DrawAAPolyLine(5, end_1, windowPoints[i + 1]);
}
} else { } else {
float midpoint = (windowPoints[i].y + windowPoints[i + 1].y) * 0.5f; float midpoint = (windowPoints[i].y + windowPoints[i + 1].y) * 0.5f;
Vector2 start_1 = windowPoints[i]; Vector2 start_1 = windowPoints[i];
@ -174,11 +207,23 @@ namespace XNodeEditor {
Vector2 end_2 = end_1; Vector2 end_2 = end_1;
start_2.y = midpoint; start_2.y = midpoint;
end_2.y = midpoint; end_2.y = midpoint;
Handles.DrawAAPolyLine(5, windowPoints[i], start_1); if (i == gridPoints.Count - 2) {
Handles.DrawAAPolyLine(5, start_1, start_2); Handles.DrawAAPolyLine(5, windowPoints[i], start_1);
Handles.DrawAAPolyLine(5, start_2, end_2); Handles.color = gradient.Evaluate(0.25f);
Handles.DrawAAPolyLine(5, end_2, end_1); Handles.DrawAAPolyLine(5, start_1, start_2);
Handles.DrawAAPolyLine(5, end_1, windowPoints[i + 1]); Handles.color = gradient.Evaluate(0.5f);
Handles.DrawAAPolyLine(5, start_2, end_2);
Handles.color = gradient.Evaluate(0.75f);
Handles.DrawAAPolyLine(5, end_2, end_1);
Handles.color = gradient.Evaluate(1f);
Handles.DrawAAPolyLine(5, end_1, windowPoints[i + 1]);
} else {
Handles.DrawAAPolyLine(5, windowPoints[i], start_1);
Handles.DrawAAPolyLine(5, start_1, start_2);
Handles.DrawAAPolyLine(5, start_2, end_2);
Handles.DrawAAPolyLine(5, end_2, end_1);
Handles.DrawAAPolyLine(5, end_1, windowPoints[i + 1]);
}
} }
} }
break; break;
@ -202,10 +247,11 @@ namespace XNodeEditor {
Rect fromRect; Rect fromRect;
if (!_portConnectionPoints.TryGetValue(output, out fromRect)) continue; if (!_portConnectionPoints.TryGetValue(output, out fromRect)) continue;
Color portColor = graphEditor.GetPortColor(output);
for (int k = 0; k < output.ConnectionCount; k++) { for (int k = 0; k < output.ConnectionCount; k++) {
XNode.NodePort input = output.GetConnection(k); XNode.NodePort input = output.GetConnection(k);
Color noodleColor = graphEditor.GetNoodleColor(output, input); Gradient noodleGradient = graphEditor.GetNoodleGradient(output, input);
// Error handling // Error handling
if (input == null) continue; //If a script has been updated and the port doesn't exist, it is removed and null is returned. If this happens, return. if (input == null) continue; //If a script has been updated and the port doesn't exist, it is removed and null is returned. If this happens, return.
@ -219,7 +265,7 @@ namespace XNodeEditor {
gridPoints.Add(fromRect.center); gridPoints.Add(fromRect.center);
gridPoints.AddRange(reroutePoints); gridPoints.AddRange(reroutePoints);
gridPoints.Add(toRect.center); gridPoints.Add(toRect.center);
DrawNoodle(noodleColor, gridPoints); DrawNoodle(noodleGradient, gridPoints);
// Loop through reroute points again and draw the points // Loop through reroute points again and draw the points
for (int i = 0; i < reroutePoints.Count; i++) { for (int i = 0; i < reroutePoints.Count; i++) {
@ -235,7 +281,7 @@ namespace XNodeEditor {
GUI.DrawTexture(rect, NodeEditorResources.dotOuter); GUI.DrawTexture(rect, NodeEditorResources.dotOuter);
} }
GUI.color = noodleColor; GUI.color = portColor;
GUI.DrawTexture(rect, NodeEditorResources.dot); GUI.DrawTexture(rect, NodeEditorResources.dot);
if (rect.Overlaps(selectionBox)) selection.Add(rerouteRef); if (rect.Overlaps(selectionBox)) selection.Add(rerouteRef);
if (rect.Contains(mousePos)) hoveredReroute = rerouteRef; if (rect.Contains(mousePos)) hoveredReroute = rerouteRef;

View File

@ -64,10 +64,34 @@ namespace XNodeEditor {
} }
/// <summary> Returned color is used to color noodles </summary> /// <summary> Returned color is used to color noodles </summary>
public virtual Color GetNoodleColor(XNode.NodePort output, XNode.NodePort input) { /// <param name="output"> The output this noodle comes from. Never null. </param>
Color col = GetTypeColor(output.ValueType); /// <param name="input"> The output this noodle comes from. Can be null if we are dragging the noodle. </param>
if (window.hoveredPort == output || window.hoveredPort == input) return Color.Lerp(col, Color.white, 0.8f); public virtual Gradient GetNoodleGradient(XNode.NodePort output, XNode.NodePort input) {
return col; Gradient grad = new Gradient();
// If dragging the noodle, draw solid, slightly transparent
if (input == null) {
Color a = GetTypeColor(output.ValueType);
grad.SetKeys(
new GradientColorKey[] { new GradientColorKey(a, 0f) },
new GradientAlphaKey[] { new GradientAlphaKey(0.6f, 0f) }
);
}
// If normal, draw gradient fading from one input color to the other
else {
Color a = GetTypeColor(output.ValueType);
Color b = GetTypeColor(input.ValueType);
// If any port is hovered, tint white
if (window.hoveredPort == output || window.hoveredPort == input) {
a = Color.Lerp(a, Color.white, 0.8f);
b = Color.Lerp(b, Color.white, 0.8f);
}
grad.SetKeys(
new GradientColorKey[] { new GradientColorKey(a, 0f), new GradientColorKey(b, 1f) },
new GradientAlphaKey[] { new GradientAlphaKey(1f, 0f), new GradientAlphaKey(1f, 1f) }
);
}
return grad;
} }
/// <summary> Returned color is used to color ports </summary> /// <summary> Returned color is used to color ports </summary>