Skip to content

Commit

Permalink
feat: add GradationMode.Diagonal with 4 colors
Browse files Browse the repository at this point in the history 
close #308
  • Loading branch information
@mob-sakai
mob-sakai committed Feb 12, 2025
1 parent fc09152 commit b72a1c0
Show file tree
Hide file tree
Showing 5 changed files with 111 additions and 27 deletions.
59 changes: 42 additions & 17 deletions Packages/src/Editor/UIEffectEditor.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,8 @@ public class UIEffect2Editor : Editor
private SerializedProperty _gradationMode;
private SerializedProperty _gradationColor1;
private SerializedProperty _gradationColor2;
private SerializedProperty _gradationColor3;
private SerializedProperty _gradationColor4;
private SerializedProperty _gradationGradient;
private SerializedProperty _gradationOffset;
private SerializedProperty _gradationScale;
Expand Down Expand Up @@ -163,6 +165,8 @@ private void OnEnable()
_gradationMode = serializedObject.FindProperty("m_GradationMode");
_gradationColor1 = serializedObject.FindProperty("m_GradationColor1");
_gradationColor2 = serializedObject.FindProperty("m_GradationColor2");
_gradationColor3 = serializedObject.FindProperty("m_GradationColor3");
_gradationColor4 = serializedObject.FindProperty("m_GradationColor4");
_gradationGradient = serializedObject.FindProperty("m_GradationGradient");
_gradationOffset = serializedObject.FindProperty("m_GradationOffset");
_gradationScale = serializedObject.FindProperty("m_GradationScale");
Expand Down Expand Up @@ -340,22 +344,19 @@ public void DrawProperties()
case GradationMode.AngleGradient:
DrawGradientField(_gradationGradient);
break;
case GradationMode.Diagonal:
DrawColorPickerField("Top", _gradationColor1, _gradationColor2);
DrawColorPickerField("Bottom", _gradationColor3, _gradationColor4);
break;
default:
DrawColorPickerField(_gradationColor1);
DrawColorPickerField(EditorGUILayout.GetControlRect(), _gradationColor1, true);
var r = EditorGUILayout.GetControlRect();
r.width -= 24;
r.height = EditorGUIUtility.singleLineHeight;
DrawColorPickerField(r, _gradationColor2);
DrawColorPickerField(r, _gradationColor2, true);

r.x += r.width + 4;
r.width = 20;
// Swap colors
if (GUI.Button(r, EditorGUIUtility.IconContent("preaudioloopoff"), "iconbutton"))
{
(_gradationColor1.colorValue, _gradationColor2.colorValue)
= (_gradationColor2.colorValue, _gradationColor1.colorValue);
}

SwapColorsButton(r, _gradationColor1, _gradationColor2);
break;
}

Expand Down Expand Up @@ -405,17 +406,35 @@ public void DrawProperties()
}
}

private static void DrawColorPickerField(SerializedProperty color, bool showAlpha = true)
private static void DrawColorPickerField(string label, SerializedProperty color1, SerializedProperty color2)
{
var labelWidth = EditorGUIUtility.labelWidth;
var r = EditorGUILayout.GetControlRect();
r.height = EditorGUIUtility.singleLineHeight;
DrawColorPickerField(r, color, showAlpha);
r.width -= 24;
EditorGUI.PrefixLabel(new Rect(r.x, r.y, labelWidth, r.height), EditorGUIUtility.TrTempContent(label));

var indentLevel = EditorGUI.indentLevel;
EditorGUI.indentLevel = 0;
var rPos = new Rect(r.x + labelWidth, r.y, (r.width - labelWidth) / 2, r.height);
DrawColorPickerField(rPos, GUIContent.none, color1, true);

rPos.x += rPos.width;
DrawColorPickerField(rPos, GUIContent.none, color2, true);

// Swap colors button
SwapColorsButton(new Rect(r.x + r.width + 4, r.y, 20, 20), color1, color2);
EditorGUI.indentLevel = indentLevel;
}

private static void DrawColorPickerField(Rect rect, SerializedProperty color, bool showAlpha = true)
private static void DrawColorPickerField(Rect rect, SerializedProperty color, bool showAlpha)
{
var label = EditorGUIUtility.TrTempContent(color.displayName);
label.tooltip = color.tooltip;
DrawColorPickerField(rect, label, color, showAlpha);
}

private static void DrawColorPickerField(Rect rect, GUIContent label, SerializedProperty color, bool showAlpha)
{
var hdr = UIEffectProjectSettings.useHdrColorPicker;
EditorGUI.showMixedValue = color.hasMultipleDifferentValues;

Expand All @@ -430,8 +449,6 @@ private static void DrawColorPickerField(Rect rect, SerializedProperty color, bo
private static void DrawGradientField(SerializedProperty gradient)
{
var r = EditorGUILayout.GetControlRect();
r.height = EditorGUIUtility.singleLineHeight;

var label = EditorGUIUtility.TrTempContent(gradient.displayName);
label.tooltip = gradient.tooltip;
var hdr = UIEffectProjectSettings.useHdrColorPicker;
Expand Down Expand Up @@ -480,7 +497,7 @@ private static void DrawColor(SerializedProperty color, ColorFilter filter, Colo
color.colorValue = Color.white;
}

DrawColorPickerField(color, showAlpha);
DrawColorPickerField(EditorGUILayout.GetControlRect(), color, showAlpha);
}
}

Expand All @@ -502,6 +519,14 @@ private static void DrawColor(SerializedProperty filter, SerializedProperty colo
EditorGUI.indentLevel--;
}

private static void SwapColorsButton(Rect rect, SerializedProperty color1, SerializedProperty color2)
{
if (GUI.Button(rect, EditorGUIUtility.IconContent("preaudioloopoff"), "iconbutton"))
{
(color1.colorValue, color2.colorValue) = (color2.colorValue, color1.colorValue);
}
}

private static bool DrawHeaderPopup(SerializedProperty sp)
{
var r = EditorGUILayout.GetControlRect();
Expand Down
21 changes: 11 additions & 10 deletions Packages/src/Runtime/Enums.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -94,16 +94,17 @@ public enum PatternArea
public enum GradationMode
{
None = 0,
Horizontal,
HorizontalGradient,
Vertical,
VerticalGradient,
RadialFast,
RadialDetail,
DiagonalToRightBottom,
DiagonalToLeftBottom,
Angle,
AngleGradient
Horizontal = 1,
HorizontalGradient = 2,
Vertical = 3,
VerticalGradient = 4,
RadialFast = 5,
RadialDetail = 6,
Diagonal = 11,
DiagonalToRightBottom = 7,
DiagonalToLeftBottom = 8,
Angle = 9,
AngleGradient = 10
}

internal static class BlendTypeConverter
Expand Down
36 changes: 36 additions & 0 deletions Packages/src/Runtime/UIEffect.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -163,6 +163,12 @@ public class UIEffect : UIEffectBase
[SerializeField]
protected Color m_GradationColor2 = Color.white;

[SerializeField]
protected Color m_GradationColor3 = Color.white;

[SerializeField]
protected Color m_GradationColor4 = Color.white;

[SerializeField]
private Gradient m_GradationGradient = new Gradient();

Expand Down Expand Up @@ -854,6 +860,28 @@ public Color gradationColor2
}
}

public Color gradationColor3
{
get => m_GradationColor3;
set
{
if (m_GradationColor3 == value) return;
context.gradationColor3 = m_GradationColor3 = value;
SetVerticesDirty();
}
}

public Color gradationColor4
{
get => m_GradationColor4;
set
{
if (m_GradationColor4 == value) return;
context.gradationColor4 = m_GradationColor4 = value;
SetVerticesDirty();
}
}

public float gradationOffset
{
get => m_GradationOffset;
Expand Down Expand Up @@ -1024,6 +1052,8 @@ protected override void UpdateContext(UIEffectContext c)
c.gradationMode = m_GradationMode;
c.gradationColor1 = m_GradationColor1;
c.gradationColor2 = m_GradationColor2;
c.gradationColor3 = m_GradationColor3;
c.gradationColor4 = m_GradationColor4;
c.gradationGradient = m_GradationGradient;
c.gradationOffset = m_GradationOffset;
c.gradationScale = m_GradationScale;
Expand Down Expand Up @@ -1168,8 +1198,11 @@ public void LoadPreset(UIEffect preset)
m_GradationMode = preset.m_GradationMode;
m_GradationColor1 = preset.m_GradationColor1;
m_GradationColor2 = preset.m_GradationColor2;
m_GradationColor3 = preset.m_GradationColor3;
m_GradationColor4 = preset.m_GradationColor4;
m_GradationGradient = new Gradient();
m_GradationGradient.SetKeys(preset.m_GradationGradient.colorKeys, preset.m_GradationGradient.alphaKeys);
m_GradationGradient.mode = preset.m_GradationGradient.mode;
m_GradationOffset = preset.m_GradationOffset;
m_GradationScale = preset.m_GradationScale;
m_GradationRotation = preset.m_GradationRotation;
Expand Down Expand Up @@ -1242,8 +1275,11 @@ internal void CopyFrom(UIEffectContext c)
m_GradationMode = c.gradationMode;
m_GradationColor1 = c.gradationColor1;
m_GradationColor2 = c.gradationColor2;
m_GradationColor3 = c.gradationColor3;
m_GradationColor4 = c.gradationColor4;
m_GradationGradient = new Gradient();
m_GradationGradient.SetKeys(c.gradationGradient.colorKeys, c.gradationGradient.alphaKeys);
m_GradationGradient.mode = c.gradationGradient.mode;
m_GradationOffset = c.gradationOffset;
m_GradationScale = c.gradationScale;
m_GradationRotation = c.gradationRotation;
Expand Down
7 changes: 7 additions & 0 deletions Packages/src/Runtime/UIEffectContext.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -222,6 +222,8 @@ public class UIEffectContext
public GradationMode gradationMode;
public Color gradationColor1;
public Color gradationColor2;
public Color gradationColor3;
public Color gradationColor4;
public Gradient gradationGradient;
public float gradationOffset;
public float gradationScale;
Expand Down Expand Up @@ -305,6 +307,8 @@ public void CopyFrom(UIEffectContext preset)
gradationMode = preset.gradationMode;
gradationColor1 = preset.gradationColor1;
gradationColor2 = preset.gradationColor2;
gradationColor3 = preset.gradationColor3;
gradationColor4 = preset.gradationColor4;
gradationGradient = preset.gradationGradient;
gradationOffset = preset.gradationOffset;
gradationScale = preset.gradationScale;
Expand Down Expand Up @@ -527,6 +531,9 @@ private void ApplyGradation(List<UIVertex> verts, Rect rect, Matrix4x4 m, bool c
case GradationMode.Vertical:
GradientUtil.DoVerticalGradient(verts, a, b, offset, scale, rect, m);
break;
case GradationMode.Diagonal:
GradientUtil.DoDiagonal(verts, a, b, gradationColor3, gradationColor4, offset, scale, rect, m);
break;
case GradationMode.DiagonalToRightBottom:
GradientUtil.DoDiagonalGradientToRightBottom(verts, a, b, offset, scale, rect, m);
break;
Expand Down
15 changes: 15 additions & 0 deletions Packages/src/Runtime/Utilities/GradientUtil.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -159,6 +159,21 @@ static Color Evaluate(Gradient gradient, Rect rect, float t, float offset, float
}
}

public static void DoDiagonal(List<UIVertex> verts, Color a, Color b, Color c, Color d, float offset,
float scale, Rect rect, Matrix4x4 m)
{
for (var i = 0; i < verts.Count; i++)
{
var vt = verts[i];
var x = Mathf.InverseLerp(rect.xMin, rect.xMax, m.MultiplyPoint3x4(vt.position).x);
var y = Mathf.InverseLerp(rect.yMin, rect.yMax, m.MultiplyPoint3x4(vt.position).y);
var tx = Mathf.Clamp01(offset + (x - 0.5f) * scale + 0.5f);
var ty = Mathf.Clamp01(offset + (0.5f - y) * scale + 0.5f);
vt.color *= Color.Lerp(Color.Lerp(a, b, tx), Color.Lerp(c, d, tx), ty);
verts[i] = vt;
}
}

public static void DoDiagonalGradientToRightBottom(List<UIVertex> verts, Color a, Color b, float offset,
float scale, Rect rect, Matrix4x4 m)
{
Expand Down

0 comments on commit b72a1c0

Please sign in to comment.