feat: gradation feature

close #277

Author: mob-sakai

Packages/src/Editor/UIEffectEditor.cs

@@ -58,6 +58,11 @@ public class UIEffect2Editor : Editor
         private SerializedProperty _shadowEffectOnOrigin;
         private SerializedProperty _shadowMirrorScale;
 
+        private SerializedProperty _gradationMode;
+        private SerializedProperty _gradationColor1;
+        private SerializedProperty _gradationColor2;
+        private SerializedProperty _gradationGradient;
+
         private void OnEnable()
         {
             if (target == null) return;
@@ -104,6 +109,11 @@ private void OnEnable()
             _shadowFade = serializedObject.FindProperty("m_ShadowFade");
             _shadowEffectOnOrigin = serializedObject.FindProperty("m_ShadowEffectOnOrigin");
             _shadowMirrorScale = serializedObject.FindProperty("m_ShadowMirrorScale");
+
+            _gradationMode = serializedObject.FindProperty("m_GradationMode");
+            _gradationColor1 = serializedObject.FindProperty("m_GradationColor1");
+            _gradationColor2 = serializedObject.FindProperty("m_GradationColor2");
+            _gradationGradient = serializedObject.FindProperty("m_GradationGradient");
         }
 
         public override void OnInspectorGUI()
@@ -233,6 +243,26 @@ public void DrawProperties()
                 EditorGUILayout.PropertyField(_shadowEffectOnOrigin);
                 EditorGUI.indentLevel--;
             }
+
+            // Gradient
+            DrawSeparator();
+            if (DrawHeaderPopup(_gradationMode))
+            {
+                EditorGUI.indentLevel++;
+                switch ((GradationMode)_gradationMode.intValue)
+                {
+                    case GradationMode.HorizontalGradient:
+                    case GradationMode.VerticalGradient:
+                        EditorGUILayout.PropertyField(_gradationGradient);
+                        break;
+                    default:
+                        EditorGUILayout.PropertyField(_gradationColor1);
+                        EditorGUILayout.PropertyField(_gradationColor2);
+                        break;
+                }
+
+                EditorGUI.indentLevel--;
+            }
         }
 
         private static void DrawColor(SerializedProperty filter, SerializedProperty color, ColorFilter prevFilter)

Packages/src/Runtime/Enums.cs

@@ -76,6 +76,18 @@ public enum ShadowMode
         Mirror
     }
 
+    public enum GradationMode
+    {
+        None = 0,
+        Horizontal,
+        HorizontalGradient,
+        Vertical,
+        VerticalGradient,
+        Radial,
+        DiagonalLeftTopToRightBottom,
+        DiagonalRightTopToLeftBottom
+    }
+
     public enum PreferSamplingSize
     {
         None = 0,

Packages/src/Runtime/UIEffect.cs

@@ -127,6 +127,18 @@ public class UIEffect : UIEffectBase
         [SerializeField]
         protected float m_ShadowMirrorScale = 0.5f;
 
+        [SerializeField]
+        protected GradationMode m_GradationMode = GradationMode.None;
+
+        [SerializeField]
+        protected Color m_GradationColor1 = Color.white;
+
+        [SerializeField]
+        protected Color m_GradationColor2 = Color.white;
+
+        [SerializeField]
+        private Gradient m_GradationGradient = new Gradient();
+
         public ToneFilter toneFilter
         {
             get => m_ToneFilter;
@@ -521,6 +533,50 @@ public float shadowMirrorScale
             }
         }
 
+        public GradationMode gradationMode
+        {
+            get => m_GradationMode;
+            set
+            {
+                if (m_GradationMode == value) return;
+                context.gradationMode = m_GradationMode = value;
+                SetVerticesDirty();
+            }
+        }
+
+        public Color gradationColor1
+        {
+            get => m_GradationColor1;
+            set
+            {
+                if (m_GradationColor1 == value) return;
+                context.gradationColor1 = m_GradationColor1 = value;
+                SetVerticesDirty();
+            }
+        }
+
+        public Color gradationColor2
+        {
+            get => m_GradationColor2;
+            set
+            {
+                if (m_GradationColor2 == value) return;
+                context.gradationColor2 = m_GradationColor2 = value;
+                SetVerticesDirty();
+            }
+        }
+
+        public Gradient gradationGradient
+        {
+            get => m_GradationGradient;
+            set
+            {
+                if (m_GradationGradient == value) return;
+                context.gradationGradient = m_GradationGradient = value;
+                SetVerticesDirty();
+            }
+        }
+
         public List<UIEffectReplica> replicas => _replicas ??= ListPool<UIEffectReplica>.Rent();
         private List<UIEffectReplica> _replicas;
 
@@ -604,6 +660,10 @@ protected override void UpdateContext(UIEffectContext c)
             c.shadowFade = m_ShadowFade;
             c.shadowEffectOnOrigin = m_ShadowEffectOnOrigin;
             c.shadowMirrorScale = m_ShadowMirrorScale;
+            c.gradationMode = m_GradationMode;
+            c.gradationColor1 = m_GradationColor1;
+            c.gradationColor2 = m_GradationColor2;
+            c.gradationGradient = m_GradationGradient;
         }
 
         public override void ApplyContextToMaterial()
@@ -749,6 +809,11 @@ internal void CopyFrom(UIEffectContext c)
             m_ShadowEffectOnOrigin = c.shadowEffectOnOrigin;
             m_ShadowMirrorScale = c.shadowMirrorScale;
 
+            m_GradationMode = c.gradationMode;
+            m_GradationColor1 = c.gradationColor1;
+            m_GradationColor2 = c.gradationColor2;
+            m_GradationGradient = c.gradationGradient;
+
             UpdateContext(context);
             ApplyContextToMaterial();
             SetVerticesDirty();

Packages/src/Runtime/UIEffectContext.cs

@@ -132,6 +132,10 @@ public class UIEffectContext
         public float shadowFade = 0.9f;
         public bool shadowEffectOnOrigin = false;
         public float shadowMirrorScale = 0.5f;
+        public GradationMode gradationMode;
+        public Color gradationColor1;
+        public Color gradationColor2;
+        public Gradient gradationGradient;
 
         public bool willModifyMaterial => samplingFilter != SamplingFilter.None
                                           || transitionFilter != TransitionFilter.None
@@ -184,6 +188,11 @@ public void CopyFrom(UIEffectContext preset)
             shadowIteration = preset.shadowIteration;
             shadowFade = preset.shadowFade;
             shadowEffectOnOrigin = preset.shadowEffectOnOrigin;
+
+            gradationMode = preset.gradationMode;
+            gradationColor1 = preset.gradationColor1;
+            gradationColor2 = preset.gradationColor2;
+            gradationGradient = preset.gradationGradient;
         }
 
         public void ApplyToMaterial(Material material, float actualSamplingScale = 1f)
@@ -385,6 +394,10 @@ public void ModifyMesh(Graphic graphic, RectTransform transitionRoot, VertexHelp
                 }
             }
 
+            // Apply gradation.
+            GradientUtil.DoGradient(gradationMode, verts, gradationColor1, gradationColor2, gradationGradient,
+                transitionRoot.rect);
+
             // Apply shadow.
             switch (shadowMode)
             {