From 7b3e41efae5f024e18295bbf8f31b2faf7e10063 Mon Sep 17 00:00:00 2001 From: Saas Date: Fri, 31 Oct 2025 18:02:22 +0100 Subject: [PATCH 1/4] change how to the actor transform editor looks --- .../Editors/ActorTransformEditor.cs | 43 ++++++++++--------- Source/Editor/GUI/Input/ValueBox.cs | 11 +++++ 2 files changed, 33 insertions(+), 21 deletions(-) diff --git a/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs b/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs index 02f5ca7ec..7dfea232c 100644 --- a/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs +++ b/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs @@ -26,11 +26,6 @@ namespace FlaxEditor.CustomEditors.Editors /// public static Color AxisColorZ = new Color(0.0f, 0.0235294f, 1.0f, 1.0f); - /// - /// The axes colors grey out scale when input field is not focused. - /// - public static float AxisGreyOutFactor = 0.6f; - /// /// Custom editor for actor position property. /// @@ -43,18 +38,20 @@ namespace FlaxEditor.CustomEditors.Editors base.Initialize(layout); if (XElement.ValueBox.Parent is UniformGridPanel ug) + { + ug.SlotPadding = new Margin(3.0f, 0.0f, 0.0f, 0.0f); CheckLayout(ug); + } // Override colors - var back = FlaxEngine.GUI.Style.Current.TextBoxBackground; - XElement.ValueBox.BorderColor = Color.Lerp(AxisColorX, back, AxisGreyOutFactor); XElement.ValueBox.BorderSelectedColor = AxisColorX; - XElement.ValueBox.Category = Utils.ValueCategory.Distance; - YElement.ValueBox.BorderColor = Color.Lerp(AxisColorY, back, AxisGreyOutFactor); YElement.ValueBox.BorderSelectedColor = AxisColorY; - YElement.ValueBox.Category = Utils.ValueCategory.Distance; - ZElement.ValueBox.BorderColor = Color.Lerp(AxisColorZ, back, AxisGreyOutFactor); ZElement.ValueBox.BorderSelectedColor = AxisColorZ; + XElement.ValueBox.HighlightColor = AxisColorX; + XElement.ValueBox.Category = Utils.ValueCategory.Distance; + YElement.ValueBox.HighlightColor = AxisColorY; + YElement.ValueBox.Category = Utils.ValueCategory.Distance; + ZElement.ValueBox.HighlightColor = AxisColorZ; ZElement.ValueBox.Category = Utils.ValueCategory.Distance; } } @@ -71,18 +68,20 @@ namespace FlaxEditor.CustomEditors.Editors base.Initialize(layout); if (XElement.ValueBox.Parent is UniformGridPanel ug) + { + ug.SlotPadding = new Margin(3.0f, 0.0f, 0.0f, 0.0f); CheckLayout(ug); + } // Override colors - var back = FlaxEngine.GUI.Style.Current.TextBoxBackground; - XElement.ValueBox.BorderColor = Color.Lerp(AxisColorX, back, AxisGreyOutFactor); XElement.ValueBox.BorderSelectedColor = AxisColorX; - XElement.ValueBox.Category = Utils.ValueCategory.Angle; - YElement.ValueBox.BorderColor = Color.Lerp(AxisColorY, back, AxisGreyOutFactor); YElement.ValueBox.BorderSelectedColor = AxisColorY; - YElement.ValueBox.Category = Utils.ValueCategory.Angle; - ZElement.ValueBox.BorderColor = Color.Lerp(AxisColorZ, back, AxisGreyOutFactor); ZElement.ValueBox.BorderSelectedColor = AxisColorZ; + XElement.ValueBox.HighlightColor = AxisColorX; + XElement.ValueBox.Category = Utils.ValueCategory.Angle; + YElement.ValueBox.HighlightColor = AxisColorY; + YElement.ValueBox.Category = Utils.ValueCategory.Angle; + ZElement.ValueBox.HighlightColor = AxisColorZ; ZElement.ValueBox.Category = Utils.ValueCategory.Angle; } } @@ -129,17 +128,19 @@ namespace FlaxEditor.CustomEditors.Editors } if (XElement.ValueBox.Parent is UniformGridPanel ug) + { + ug.SlotPadding = new Margin(3.0f, 0.0f, 0.0f, 0.0f); CheckLayout(ug); + } // Override colors var back = FlaxEngine.GUI.Style.Current.TextBoxBackground; - var grayOutFactor = 0.6f; - XElement.ValueBox.BorderColor = Color.Lerp(AxisColorX, back, grayOutFactor); XElement.ValueBox.BorderSelectedColor = AxisColorX; - YElement.ValueBox.BorderColor = Color.Lerp(AxisColorY, back, grayOutFactor); YElement.ValueBox.BorderSelectedColor = AxisColorY; - ZElement.ValueBox.BorderColor = Color.Lerp(AxisColorZ, back, grayOutFactor); ZElement.ValueBox.BorderSelectedColor = AxisColorZ; + XElement.ValueBox.HighlightColor = AxisColorX; + YElement.ValueBox.HighlightColor = AxisColorY; + ZElement.ValueBox.HighlightColor = AxisColorZ; } /// diff --git a/Source/Editor/GUI/Input/ValueBox.cs b/Source/Editor/GUI/Input/ValueBox.cs index 674ee0697..e619ac2e3 100644 --- a/Source/Editor/GUI/Input/ValueBox.cs +++ b/Source/Editor/GUI/Input/ValueBox.cs @@ -89,6 +89,11 @@ namespace FlaxEditor.GUI.Input /// public bool IsSliding => _isSliding; + /// + /// The color of the highlight to the left of the value box. + /// + public Color HighlightColor; + /// /// Occurs when sliding starts. /// @@ -206,6 +211,12 @@ namespace FlaxEditor.GUI.Input Render2D.DrawRectangle(bounds, style.SelectionBorder); } } + + if (HighlightColor != Color.Transparent) + { + var highlightRect = new Rectangle(-3.0f, 0.0f, 3.0f, Height); + Render2D.FillRectangle(highlightRect, HighlightColor); + } } /// From c1738bcb0a4cab0e16cd4652519573bf765a509a Mon Sep 17 00:00:00 2001 From: Saas Date: Fri, 31 Oct 2025 18:02:35 +0100 Subject: [PATCH 2/4] make the ui editor look like the actor transform editor --- Source/Editor/CustomEditors/Dedicated/UIControlEditor.cs | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/Source/Editor/CustomEditors/Dedicated/UIControlEditor.cs b/Source/Editor/CustomEditors/Dedicated/UIControlEditor.cs index 614d2c160..90873e2b2 100644 --- a/Source/Editor/CustomEditors/Dedicated/UIControlEditor.cs +++ b/Source/Editor/CustomEditors/Dedicated/UIControlEditor.cs @@ -701,8 +701,7 @@ namespace FlaxEditor.CustomEditors.Dedicated { valueBox = floatEditorElement.ValueBox; var back = FlaxEngine.GUI.Style.Current.TextBoxBackground; - valueBox.BorderColor = Color.Lerp(borderColor, back, ActorTransformEditor.AxisGreyOutFactor); - valueBox.BorderSelectedColor = borderColor; + valueBox.HighlightColor = borderColor; } return grid; } From 316e5b2845da6b9d92305a532986be1b8811d05d Mon Sep 17 00:00:00 2001 From: Saas Date: Fri, 31 Oct 2025 18:10:00 +0100 Subject: [PATCH 3/4] also apply color to border if focused/ selected in ui editor --- Source/Editor/CustomEditors/Dedicated/UIControlEditor.cs | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/Source/Editor/CustomEditors/Dedicated/UIControlEditor.cs b/Source/Editor/CustomEditors/Dedicated/UIControlEditor.cs index 90873e2b2..1628f69ec 100644 --- a/Source/Editor/CustomEditors/Dedicated/UIControlEditor.cs +++ b/Source/Editor/CustomEditors/Dedicated/UIControlEditor.cs @@ -690,7 +690,7 @@ namespace FlaxEditor.CustomEditors.Dedicated return grid; } - private CustomElementsContainer UniformPanelCapsuleForObjectWithText(LayoutElementsContainer el, string text, ValueContainer values, Color borderColor, out FloatValueBox valueBox) + private CustomElementsContainer UniformPanelCapsuleForObjectWithText(LayoutElementsContainer el, string text, ValueContainer values, Color highlightColor, out FloatValueBox valueBox) { valueBox = null; var grid = UniformGridTwoByOne(el); @@ -701,7 +701,8 @@ namespace FlaxEditor.CustomEditors.Dedicated { valueBox = floatEditorElement.ValueBox; var back = FlaxEngine.GUI.Style.Current.TextBoxBackground; - valueBox.HighlightColor = borderColor; + valueBox.HighlightColor = highlightColor; + valueBox.BorderSelectedColor = highlightColor; } return grid; } From b6696564f56aa8c07ab04306fd660dc0c701e969 Mon Sep 17 00:00:00 2001 From: Saas Date: Fri, 31 Oct 2025 18:22:30 +0100 Subject: [PATCH 4/4] tweak colors to be less bright --- Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs b/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs index 7dfea232c..c1179e393 100644 --- a/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs +++ b/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs @@ -14,17 +14,17 @@ namespace FlaxEditor.CustomEditors.Editors /// /// The X axis color. /// - public static Color AxisColorX = new Color(1.0f, 0.0f, 0.02745f, 1.0f); + public static Color AxisColorX = new Color(0.8f, 0.0f, 0.027f, 1.0f); /// /// The Y axis color. /// - public static Color AxisColorY = new Color(0.239215f, 1.0f, 0.047058f, 1.0f); + public static Color AxisColorY = new Color(0.239215f, 0.65f, 0.047058f, 1.0f); /// /// The Z axis color. /// - public static Color AxisColorZ = new Color(0.0f, 0.0235294f, 1.0f, 1.0f); + public static Color AxisColorZ = new Color(0.0f, 0.0235294f, 0.9f, 1.0f); /// /// Custom editor for actor position property.