Merge branch 'cNori-RadialMenu-and-material-nodes'

This commit is contained in:
Wojtek Figat
2024-06-11 09:49:00 +02:00
3 changed files with 625 additions and 0 deletions

View File

@@ -936,6 +936,142 @@ namespace FlaxEditor.Surface.Archetypes
NodeElementArchetype.Factory.Output(0, string.Empty, typeof(float), 2),
}
},
new NodeArchetype
{
TypeID = 43,
Title = "Rotate UV",
Description = "Rotates 2D vector by given angle around (0,0) origin",
Flags = NodeFlags.MaterialGraph,
Size = new Float2(250, 40),
ConnectionsHints = ConnectionsHint.Vector,
DefaultValues =
[
0.0f,
],
Elements =
[
NodeElementArchetype.Factory.Input(0, "UV", true, typeof(Float2), 0),
NodeElementArchetype.Factory.Input(1, "Angle", true, typeof(float), 1, 0),
NodeElementArchetype.Factory.Output(0, string.Empty, typeof(Float2), 2),
]
},
new NodeArchetype
{
TypeID = 44,
Title = "Cone Gradient",
Description = "Creates cone gradient around normalized UVs (range [-1; 1]), angle is in radians (range [0; TwoPi])",
Flags = NodeFlags.MaterialGraph,
Size = new Float2(175, 40),
ConnectionsHints = ConnectionsHint.Vector,
DefaultValues =
[
0.0f,
],
Elements =
[
NodeElementArchetype.Factory.Input(0, "UV", true, typeof(Float2), 0),
NodeElementArchetype.Factory.Input(1, "Angle", true, typeof(float), 1, 0),
NodeElementArchetype.Factory.Output(0, string.Empty, typeof(float), 2),
]
},
new NodeArchetype
{
TypeID = 45,
Title = "Cycle Gradient",
Description = "Creates 2D sphere mask gradient around normalized UVs (range [-1; 1])",
Flags = NodeFlags.MaterialGraph,
Size = new Float2(175, 20),
ConnectionsHints = ConnectionsHint.Vector,
Elements =
[
NodeElementArchetype.Factory.Input(0, "UV", true, typeof(Float2), 0),
NodeElementArchetype.Factory.Output(0, string.Empty, typeof(float), 1),
]
},
new NodeArchetype
{
TypeID = 46,
Title = "Falloff and Offset",
Description = "",
Flags = NodeFlags.MaterialGraph,
Size = new Float2(175, 60),
ConnectionsHints = ConnectionsHint.Numeric,
DefaultValues =
[
0.0f,
0.9f
],
Elements =
[
NodeElementArchetype.Factory.Input(0, "Value", true, typeof(float), 0),
NodeElementArchetype.Factory.Input(1, "Offset", true, typeof(float), 1, 0),
NodeElementArchetype.Factory.Input(2, "Falloff", true, typeof(float), 2, 1),
NodeElementArchetype.Factory.Output(0, string.Empty, typeof(float), 3),
]
},
new NodeArchetype
{
TypeID = 47,
Title = "Linear Gradient",
Description = "x = Gradient along X axis, y = Gradient along Y axis",
Flags = NodeFlags.MaterialGraph,
Size = new Float2(175, 60),
ConnectionsHints = ConnectionsHint.Vector,
DefaultValues =
[
0.0f,
false
],
Elements =
[
NodeElementArchetype.Factory.Input(0, "UV", true, typeof(Float2), 0),
NodeElementArchetype.Factory.Input(1, "Angle", true, typeof(float), 1, 0),
NodeElementArchetype.Factory.Input(2, "Mirror", true, typeof(bool), 2, 1),
NodeElementArchetype.Factory.Output(0, string.Empty, typeof(Float2), 3),
]
},
new NodeArchetype
{
TypeID = 48,
Title = "Radial Gradient",
Description = "",
Flags = NodeFlags.MaterialGraph,
Size = new Float2(175, 40),
ConnectionsHints = ConnectionsHint.Vector,
DefaultValues =
[
0.0f,
],
Elements =
[
NodeElementArchetype.Factory.Input(0, "UV", true, typeof(Float2), 0),
NodeElementArchetype.Factory.Input(1, "Angle", true, typeof(float), 1, 0),
NodeElementArchetype.Factory.Output(0, string.Empty, typeof(float), 2),
]
},
new NodeArchetype
{
TypeID = 49,
Title = "Ring Gradient",
Description = "x = InnerMask,y = OuterMask,z = Mask",
Flags = NodeFlags.MaterialGraph,
Size = new Float2(175, 80),
ConnectionsHints = ConnectionsHint.Vector,
DefaultValues =
[
1.0f,
0.8f,
0.05f,
],
Elements =
[
NodeElementArchetype.Factory.Input(0, "UV", true, typeof(Float2), 0),
NodeElementArchetype.Factory.Input(1, "OuterBounds", true, typeof(float), 1, 0),
NodeElementArchetype.Factory.Input(2, "InnerBounds", true, typeof(float), 2, 1),
NodeElementArchetype.Factory.Input(3, "Falloff", true, typeof(float), 3, 2),
NodeElementArchetype.Factory.Output(0, string.Empty, typeof(Float3), 4),
]
},
};
}
}

View File

@@ -569,6 +569,106 @@ void MaterialGenerator::ProcessGroupMaterial(Box* box, Node* node, Value& value)
// Do the inverse interpolation and saturate it
value = writeLocal(ValueType::Float, String::Format(TEXT("saturate((({0} - {1}) / ({2} - {1})))"), gradient.Value, lowerEdge.Value, upperEdge.Value), node);
}
// Rotate UV [Rotator Simple]
case 43:
{
//cosine = cos(rotation);
//sine = sin(rotation);
//float2 out = float2(cosine * uv.x + sine * uv.y,cosine * uv.y - sine * uv.x);
const auto uv = tryGetValue(node->GetBox(0), getUVs).AsFloat2();
const auto rotationAngle = tryGetValue(node->GetBox(1), node->Values[0].AsFloat).AsFloat();
auto c = writeLocal(ValueType::Float, String::Format(TEXT("cos({0})"), rotationAngle.Value), node);
auto s = writeLocal(ValueType::Float, String::Format(TEXT("sin({0})"), rotationAngle.Value), node);
value = writeLocal(ValueType::Float2, String::Format(TEXT("float2({1} * {0}.x + {2} * {0}.y, {1} * {0}.y - {2} * {0}.x)"), uv.Value, c.Value, s.Value), node);
break;
}
// Cone Gradient
case 44:
{
//float gradient = angle - abs(atan2(uv.x,uv.y));
const auto uv = tryGetValue(node->GetBox(0), getUVs).AsFloat2();
const auto rotationAngle = tryGetValue(node->GetBox(1), node->Values[0].AsFloat).AsFloat();
value = writeLocal(ValueType::Float, String::Format(TEXT("{1} - abs(atan2({0}.x, {0}.y))"), uv.Value, rotationAngle.Value), node);
break;
}
// Cycle Gradient
case 45:
{
//float gradient = 1 - length(uv * 2);
const auto uv = tryGetValue(node->GetBox(0), getUVs).AsFloat2();
value = writeLocal(ValueType::Float, String::Format(TEXT("1 - length({0} * 2.0)"), uv.Value), node);
break;
}
// Falloff and Offset
case 46:
{
//float out = clamp((((Value - (1 - Offset)) + Falloff) / Falloff),0,1)
const auto in = tryGetValue(node->GetBox(0), ShaderGraphValue::Zero);
const auto graphValue = tryGetValue(node->GetBox(1), node->Values[0].AsFloat);
const auto falloff = tryGetValue(node->GetBox(2), node->Values[1].AsFloat);
value = writeLocal(ValueType::Float, String::Format(TEXT("saturate(((({0} - (1.0 - {1})) + {2}) / {2}))"), in.Value, graphValue.Value, falloff.Value), node);
break;
}
// Linear Gradient
case 47:
{
// float2 uv = Input0.xy;
// float r = Input0.z;
// float2 A = 1.0 - float2(cos(r) * uv.x + sin(r) * uv.y, cos(r) * uv.y - sin(r) * uv.x);
// float2 out = float2(Mirror ? abs(A.x < 1.0 ? (A.x - 0.5) * 2 : (2 - ((A.x - 0.5) * 2)) * -1) : A.x < 1.0 ? (A.x - 0.5) * 2 : 1,Mirror ? abs(A.y < 1.0 ? (A.y - 0.5) * 2 : (2 - ((A.y - 0.5) * 2)) * -1) : A.y < 1.0 ? (A.y - 0.5) * 2 : 1);
const auto uv = tryGetValue(node->GetBox(0), getUVs).AsFloat2();
const auto rotationAngle = tryGetValue(node->GetBox(1), node->Values[0].AsFloat).AsFloat();
const auto mirror = tryGetValue(node->GetBox(2), node->Values[1].AsBool).AsBool();
auto c = writeLocal(ValueType::Float, String::Format(TEXT("cos({0})"), rotationAngle.Value), node);
auto s = writeLocal(ValueType::Float, String::Format(TEXT("sin({0})"), rotationAngle.Value), node);
auto a = writeLocal(ValueType::Float2, String::Format(TEXT("1.0 - float2({1} * {0}.x + {2} * {0}.y, {1} * {0}.y - {2} * {0}.x)"), uv.Value, c.Value, s.Value), node);
value = writeLocal(
ValueType::Float2, String::Format(TEXT
(
"float2({0} ? abs({1}.x < 1.0 ? ({1}.x - 0.5) * 2 : (2 - (({1}.x - 0.5) * 2)) * -1) : {1}.x < 1.0 ? ({1}.x - 0.5) * 2 : 1,{0} ? abs({1}.y < 1.0 ? ({1}.y - 0.5) * 2 : (2 - (({1}.y - 0.5) * 2)) * -1) : {1}.y < 1.0 ? ({1}.y - 0.5) * 2 : 1)"
), mirror.Value, a.Value),
node);
break;
}
// Radial Gradient
case 48:
{
//float gradient = clamp(atan2(uv.x,uv.y) - angle,0.0,1.0);
const auto uv = tryGetValue(node->GetBox(0), getUVs).AsFloat2();
const auto rotationAngle = tryGetValue(node->GetBox(1), node->Values[0].AsFloat).AsFloat();
value = writeLocal(ValueType::Float, String::Format(TEXT("saturate(atan2({0}.x, {0}.y) - {1})"), uv.Value, rotationAngle.Value), node);
break;
}
// Ring Gradient
case 49:
{
// Nodes:
// float c = CycleGradient(uv)
// float InnerMask = FalloffAndOffset(c,(OuterBounds - Falloff),Falloff)
// float OuterMask = FalloffAndOffset(1-c,1-InnerBounds,Falloff)
// float Mask = OuterMask * InnerMask;
// TODO: check if there is some useless operators
//expanded
//float cycleGradient = 1 - length(uv * 2);
//float InnerMask = clamp((((c - (1 - (OuterBounds - Falloff))) + Falloff) / Falloff),0,1)
//float OuterMask = clamp(((((1-c) - (1 - (1-InnerBounds))) + Falloff) / Falloff),0,1)
//float Mask = OuterMask * InnerMask;
const auto uv = tryGetValue(node->GetBox(0), getUVs).AsFloat2();
const auto outerBounds = tryGetValue(node->GetBox(1), node->Values[0].AsFloat).AsFloat();
const auto innerBounds = tryGetValue(node->GetBox(2), node->Values[1].AsFloat).AsFloat();
const auto falloff = tryGetValue(node->GetBox(3), node->Values[2].AsFloat).AsFloat();
auto c = writeLocal(ValueType::Float, String::Format(TEXT("1 - length({0} * 2.0)"), uv.Value), node);
auto innerMask = writeLocal(ValueType::Float, String::Format(TEXT("saturate(((({0} - (1.0 - ({1} - {2}))) + {2}) / {2}))"), c.Value, outerBounds.Value, falloff.Value), node);
auto outerMask = writeLocal(ValueType::Float, String::Format(TEXT("saturate(((((1.0 - {0}) - (1.0 - (1.0 - {1}))) + {2}) / {2}))"), c.Value, innerBounds.Value, falloff.Value), node);
auto mask = writeLocal(ValueType::Float, String::Format(TEXT("{0} * {1}"), innerMask.Value, outerMask.Value), node);
value = writeLocal(ValueType::Float3, String::Format(TEXT("float3({0}, {1}, {2})"), innerMask.Value, outerMask.Value, mask.Value), node);
break;
}
default:
break;
}

View File

@@ -0,0 +1,389 @@
// Copyright (c) 2012-2024 Wojciech Figat. All rights reserved.
using System;
namespace FlaxEngine.GUI
{
/// <summary>
/// Radial menu control that arranges child controls (of type Image) in a circle.
/// </summary>
/// <seealso cref="FlaxEngine.GUI.ContainerControl" />
public class RadialMenu : ContainerControl
{
private bool _materialIsDirty = true;
private float _angle;
private float _selectedSegment;
private int _highlightSegment = -1;
private MaterialBase _material;
private MaterialInstance _materialInstance;
private int _segmentCount;
private Color _highlightColor;
private Color _foregroundColor;
private Color _selectionColor;
private float _edgeOffset;
private float _thickness = 0.2f;
private float USize => Size.X < Size.Y ? Size.X : Size.Y;
private bool ShowMatProp => _material != null;
/// <summary>
/// The material to use for menu background drawing.
/// </summary>
[EditorOrder(1)]
public MaterialBase Material
{
get => _material;
set
{
if (_material == value)
return;
_material = value;
Object.DestroyNow(_materialInstance);
_materialInstance = null;
_materialIsDirty = true;
}
}
/// <summary>
/// Gets or sets the edge offset.
/// </summary>
[EditorOrder(2), Range(0, 1)]
public float EdgeOffset
{
get => _edgeOffset;
set
{
_edgeOffset = Math.Clamp(value, 0, 1);
_materialIsDirty = true;
PerformLayout();
}
}
/// <summary>
/// Gets or sets the thickness.
/// </summary>
[EditorOrder(3), Range(0, 1), VisibleIf(nameof(ShowMatProp))]
public float Thickness
{
get => _thickness;
set
{
_thickness = Math.Clamp(value, 0, 1);
_materialIsDirty = true;
PerformLayout();
}
}
/// <summary>
/// Gets or sets control background color (transparent color (alpha=0) means no background rendering).
/// </summary>
[VisibleIf(nameof(ShowMatProp))]
public new Color BackgroundColor
{
get => base.BackgroundColor;
set
{
_materialIsDirty = true;
base.BackgroundColor = value;
}
}
/// <summary>
/// Gets or sets the color of the highlight.
/// </summary>
[VisibleIf(nameof(ShowMatProp))]
public Color HighlightColor
{
get => _highlightColor;
set
{
_materialIsDirty = true;
_highlightColor = value;
}
}
/// <summary>
/// Gets or sets the color of the foreground.
/// </summary>
[VisibleIf(nameof(ShowMatProp))]
public Color ForegroundColor
{
get => _foregroundColor;
set
{
_materialIsDirty = true;
_foregroundColor = value;
}
}
/// <summary>
/// Gets or sets the color of the selection.
/// </summary>
[VisibleIf(nameof(ShowMatProp))]
public Color SelectionColor
{
get => _selectionColor;
set
{
_materialIsDirty = true;
_selectionColor = value;
}
}
/// <summary>
/// The selected callback
/// </summary>
[HideInEditor]
public Action<int> Selected;
/// <summary>
/// The allow change selection when inside
/// </summary>
[VisibleIf(nameof(ShowMatProp))]
public bool AllowChangeSelectionWhenInside;
/// <summary>
/// The center as button
/// </summary>
[VisibleIf(nameof(ShowMatProp))]
public bool CenterAsButton;
/// <summary>
/// Initializes a new instance of the <see cref="RadialMenu"/> class.
/// </summary>
public RadialMenu()
: this(0, 0)
{
}
/// <summary>
/// Initializes a new instance of the <see cref="RadialMenu"/> class.
/// </summary>
/// <param name="x">Position X coordinate</param>
/// <param name="y">Position Y coordinate</param>
/// <param name="width">Width</param>
/// <param name="height">Height</param>
public RadialMenu(float x, float y, float width = 100, float height = 100)
: base(x, y, width, height)
{
var style = Style.Current;
if (style != null)
{
BackgroundColor = style.BackgroundNormal;
HighlightColor = style.BackgroundSelected;
ForegroundColor = style.BackgroundHighlighted;
SelectionColor = style.BackgroundSelected;
}
}
/// <summary>
/// Initializes a new instance of the <see cref="RadialMenu"/> class.
/// </summary>
/// <param name="location">Position</param>
/// <param name="size">Size</param>
public RadialMenu(Float2 location, Float2 size)
: this(location.X, location.Y, size.X, size.Y)
{
}
/// <inheritdoc/>
public override void DrawSelf()
{
if (_materialInstance == null && Material != null)
{
_materialInstance = Material.CreateVirtualInstance();
_materialIsDirty = true;
}
if (_materialInstance != null)
{
if (_materialIsDirty)
{
_materialInstance.SetParameterValue("RadialMenu_EdgeOffset", Math.Clamp(1 - _edgeOffset, 0, 1));
_materialInstance.SetParameterValue("RadialMenu_Thickness", Math.Clamp(_thickness, 0, 1));
_materialInstance.SetParameterValue("RadialMenu_Angle", (1.0f / _segmentCount) * Mathf.Pi);
_materialInstance.SetParameterValue("RadialMenu_SegmentCount", _segmentCount);
_materialInstance.SetParameterValue("RadialMenu_HighlightColor", _highlightColor);
_materialInstance.SetParameterValue("RadialMenu_ForegroundColor", _foregroundColor);
_materialInstance.SetParameterValue("RadialMenu_BackgroundColor", BackgroundColor);
_materialInstance.SetParameterValue("RadialMenu_Rotation", -_angle + Mathf.Pi);
UpdateSelectionColor();
_materialIsDirty = false;
}
Render2D.DrawMaterial(_materialInstance, new Rectangle(Float2.Zero, new Float2(Size.X < Size.Y ? Size.X : Size.Y)));
}
}
/// <inheritdoc/>
public override void OnMouseMove(Float2 location)
{
if (_materialInstance != null)
{
if (_highlightSegment == -1)
{
var min = ((1 - _edgeOffset) - _thickness) * USize * 0.5f;
var max = (1 - _edgeOffset) * USize * 0.5f;
var val = ((USize * 0.5f) - location).Length;
if (Mathf.IsInRange(val, min, max) || val < min && AllowChangeSelectionWhenInside)
{
UpdateAngle(ref location);
}
}
}
base.OnMouseMove(location);
}
/// <inheritdoc/>
public override bool OnMouseDown(Float2 location, MouseButton button)
{
if (_materialInstance == null)
return base.OnMouseDown(location, button);
var min = ((1 - _edgeOffset) - _thickness) * USize * 0.5f;
var max = (1 - _edgeOffset) * USize * 0.5f;
var val = ((USize * 0.5f) - location).Length;
var c = val < min && CenterAsButton;
var selected = (int)_selectedSegment;
selected++;
if (Mathf.IsInRange(val, min, max) || c)
{
_highlightSegment = c ? 0 : selected;
UpdateSelectionColor();
return true;
}
else
{
_highlightSegment = -1;
UpdateSelectionColor();
}
return base.OnMouseDown(location, button);
}
/// <inheritdoc/>
public override bool OnMouseUp(Float2 location, MouseButton button)
{
if (_materialInstance == null)
return base.OnMouseDown(location, button);
if (_highlightSegment >= 0)
{
Selected?.Invoke(_highlightSegment);
_highlightSegment = -1;
UpdateSelectionColor();
var min = ((1 - _edgeOffset) - _thickness) * USize * 0.5f;
var max = (1 - _edgeOffset) * USize * 0.5f;
var val = ((USize * 0.5f) - location).Length;
if (Mathf.IsInRange(val, min, max) || val < min && AllowChangeSelectionWhenInside)
{
UpdateAngle(ref location);
}
}
return base.OnMouseUp(location, button);
}
/// <inheritdoc/>
public override void OnMouseLeave()
{
if (_materialInstance == null)
return;
_selectedSegment = 0;
_highlightSegment = -1;
Selected?.Invoke(_highlightSegment);
UpdateSelectionColor();
}
/// <inheritdoc/>
public override void OnChildrenChanged()
{
_segmentCount = 0;
for (int i = 0; i < Children.Count; i++)
{
if (Children[i] is Image)
{
_segmentCount++;
}
}
_materialIsDirty = true;
base.OnChildrenChanged();
}
/// <inheritdoc/>
public override void PerformLayout(bool force = false)
{
var sa = -1.0f / _segmentCount * Mathf.TwoPi;
var midp = USize * 0.5f;
var mp = ((1 - _edgeOffset) - (_thickness * 0.5f)) * midp;
float f = 0;
if (_segmentCount % 2 != 0)
{
f += sa * 0.5f;
}
if (_materialInstance == null)
{
for (int i = 0; i < Children.Count; i++)
{
Children[i].Center = Rotate2D(new Float2(0, mp), f) + midp;
f += sa;
}
}
else
{
for (int i = 0; i < Children.Count; i++)
{
if (Children[i] is Image)
{
Children[i].Center = Rotate2D(new Float2(0, mp), f) + midp;
f += sa;
}
}
}
base.PerformLayout(force);
}
private void UpdateSelectionColor()
{
Color color;
if (_highlightSegment == -1)
{
color = _foregroundColor;
}
else
{
if (CenterAsButton)
{
color = _highlightSegment > 0 ? SelectionColor : _foregroundColor;
}
else
{
color = SelectionColor;
}
}
_materialInstance.SetParameterValue("RadialMenu_SelectionColor", color);
}
private void UpdateAngle(ref Float2 location)
{
var size = new Float2(USize);
var p = (size * 0.5f) - location;
var sa = (1.0f / _segmentCount) * Mathf.TwoPi;
_angle = Mathf.Atan2(p.X, p.Y);
_angle = Mathf.Ceil((_angle - (sa * 0.5f)) / sa) * sa;
_selectedSegment = _angle;
_selectedSegment = Mathf.RoundToInt((_selectedSegment < 0 ? Mathf.TwoPi + _selectedSegment : _selectedSegment) / sa);
if (float.IsNaN(_angle) || float.IsInfinity(_angle))
_angle = 0;
_materialInstance.SetParameterValue("RadialMenu_Rotation", -_angle + Mathf.Pi);
}
private static Float2 Rotate2D(Float2 point, float angle)
{
return new Float2(Mathf.Cos(angle) * point.X + Mathf.Sin(angle) * point.Y,
Mathf.Cos(angle) * point.Y - Mathf.Sin(angle) * point.X);
}
}
}