From 141555377b8198476880c6ec4f18e07e27c2941e Mon Sep 17 00:00:00 2001 From: Menotdan Date: Sun, 7 May 2023 22:58:57 -0400 Subject: [PATCH 1/4] Begin working on an IconButton class, and demoing the IconButton idea using the scale link icon. --- .../Editors/ActorTransformEditor.cs | 32 +++- Source/Engine/UI/GUI/Common/IconButton.cs | 167 ++++++++++++++++++ 2 files changed, 192 insertions(+), 7 deletions(-) create mode 100644 Source/Engine/UI/GUI/Common/IconButton.cs diff --git a/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs b/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs index 2612440a4..a824076f7 100644 --- a/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs +++ b/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs @@ -78,7 +78,8 @@ namespace FlaxEditor.CustomEditors.Editors /// public class ScaleEditor : Float3Editor { - private Image _linkImage; + private Button _linkButton; + private SpriteBrush _linkBrush; /// public override void Initialize(LayoutElementsContainer layout) @@ -87,18 +88,26 @@ namespace FlaxEditor.CustomEditors.Editors LinkValues = Editor.Instance.Windows.PropertiesWin.ScaleLinked; - _linkImage = new Image + // Add button with the link icon. + _linkBrush = new SpriteBrush(Editor.Instance.Icons.Link32); + _linkButton = new Button { Parent = LinkedLabel, Width = 18, Height = 18, - Brush = LinkValues ? new SpriteBrush(Editor.Instance.Icons.Link32) : new SpriteBrush(), + BackgroundBrush = _linkBrush, AnchorPreset = AnchorPresets.TopLeft, - TooltipText = "Scale values are linked together.", }; + + _linkButton.Clicked += ToggleLink; + _linkButton.BorderColor = Color.Transparent; + _linkButton.BorderColorSelected = Color.Transparent; + _linkButton.BorderColorHighlighted = Color.Transparent; + SetLinkStyle(); + var x = LinkedLabel.Text.Value.Length * 7 + 5; - _linkImage.LocalX += x; - _linkImage.LocalY += 1; + _linkButton.LocalX += x; + _linkButton.LocalY += 1; LinkedLabel.SetupContextMenu += (label, menu, editor) => { @@ -127,7 +136,16 @@ namespace FlaxEditor.CustomEditors.Editors { LinkValues = !LinkValues; Editor.Instance.Windows.PropertiesWin.ScaleLinked = LinkValues; - _linkImage.Brush = LinkValues ? new SpriteBrush(Editor.Instance.Icons.Link32) : new SpriteBrush(); + SetLinkStyle(); + } + + private void SetLinkStyle() + { + Color backgroundColor = LinkValues ? FlaxEngine.GUI.Style.Current.BackgroundSelected : FlaxEngine.GUI.Style.Current.ForegroundDisabled; + _linkButton.BackgroundColor = backgroundColor; + _linkButton.BackgroundColorHighlighted = backgroundColor.RGBMultiplied(0.9f); + _linkButton.BackgroundColorSelected = backgroundColor.RGBMultiplied(0.8f); + _linkButton.TooltipText = (LinkValues ? "Unlink" : "Link") + " values for uniform scaling."; } } } diff --git a/Source/Engine/UI/GUI/Common/IconButton.cs b/Source/Engine/UI/GUI/Common/IconButton.cs new file mode 100644 index 000000000..196b4b9c4 --- /dev/null +++ b/Source/Engine/UI/GUI/Common/IconButton.cs @@ -0,0 +1,167 @@ +// Copyright (c) 2012-2023 Wojciech Figat. All rights reserved. + +using System; + +namespace FlaxEngine.GUI +{ + /// + /// Button with an icon. + /// + public class IconButton : Button + { + /// + public override void ClearState() + { + base.ClearState(); + + if (_isPressed) + OnPressEnd(); + } + + /// + public override void DrawSelf() + { + // Cache data + Rectangle clientRect = new Rectangle(Float2.Zero, Size); + bool enabled = EnabledInHierarchy; + Color backgroundColor = BackgroundColor; + Color borderColor = BorderColor; + Color textColor = TextColor; + if (!enabled) + { + backgroundColor *= 0.5f; + borderColor *= 0.5f; + textColor *= 0.6f; + } + else if (_isPressed) + { + backgroundColor = BackgroundColorSelected; + borderColor = BorderColorSelected; + } + else if (IsMouseOver || IsNavFocused) + { + backgroundColor = BackgroundColorHighlighted; + borderColor = BorderColorHighlighted; + } + + // Draw background + if (BackgroundBrush != null) + BackgroundBrush.Draw(clientRect, backgroundColor); + else + Render2D.FillRectangle(clientRect, backgroundColor); + Render2D.DrawRectangle(clientRect, borderColor); + + // Draw text + Render2D.DrawText(_font?.GetFont(), TextMaterial, _text, clientRect, textColor, TextAlignment.Center, TextAlignment.Center); + } + + /// + public override void OnMouseEnter(Float2 location) + { + base.OnMouseEnter(location); + + HoverBegin?.Invoke(); + } + + /// + public override void OnMouseLeave() + { + if (_isPressed) + { + OnPressEnd(); + } + + HoverEnd?.Invoke(); + + base.OnMouseLeave(); + } + + /// + public override bool OnMouseDown(Float2 location, MouseButton button) + { + if (base.OnMouseDown(location, button)) + return true; + + if (button == MouseButton.Left && !_isPressed) + { + OnPressBegin(); + return true; + } + return false; + } + + /// + public override bool OnMouseUp(Float2 location, MouseButton button) + { + if (base.OnMouseUp(location, button)) + return true; + + if (button == MouseButton.Left && _isPressed) + { + OnPressEnd(); + OnClick(); + return true; + } + return false; + } + + /// + public override bool OnTouchDown(Float2 location, int pointerId) + { + if (base.OnTouchDown(location, pointerId)) + return true; + + if (!_isPressed) + { + OnPressBegin(); + return true; + } + return false; + } + + /// + public override bool OnTouchUp(Float2 location, int pointerId) + { + if (base.OnTouchUp(location, pointerId)) + return true; + + if (_isPressed) + { + OnPressEnd(); + OnClick(); + return true; + } + return false; + } + + /// + public override void OnTouchLeave() + { + if (_isPressed) + { + OnPressEnd(); + } + + base.OnTouchLeave(); + } + + /// + public override void OnLostFocus() + { + if (_isPressed) + { + OnPressEnd(); + } + + base.OnLostFocus(); + } + + /// + public override void OnSubmit() + { + OnClick(); + + base.OnSubmit(); + } + } +} From 296ac0b9404dbff349007aca8d6b348abe7930f1 Mon Sep 17 00:00:00 2001 From: Menotdan Date: Sun, 7 May 2023 23:04:11 -0400 Subject: [PATCH 2/4] Revert "Use shorter, relative path for displaying Asset Tooltips." This reverts commit 4c906f4040880b3a77686f27289800fb6c0cb55a. undo changes from master branch which I don't want for this seperate change. --- Source/Editor/Content/Items/AssetItem.cs | 4 +- Source/Editor/Content/Items/ContentFolder.cs | 9 +-- Source/Editor/Content/Items/ContentItem.cs | 14 +--- Source/Editor/Options/InterfaceOptions.cs | 7 -- Source/Editor/Utilities/Utils.cs | 76 +------------------- 5 files changed, 8 insertions(+), 102 deletions(-) diff --git a/Source/Editor/Content/Items/AssetItem.cs b/Source/Editor/Content/Items/AssetItem.cs index 120d0e416..6697ed27c 100644 --- a/Source/Editor/Content/Items/AssetItem.cs +++ b/Source/Editor/Content/Items/AssetItem.cs @@ -80,9 +80,9 @@ namespace FlaxEditor.Content /// The String Builder. protected virtual void OnBuildTooltipText(StringBuilder sb) { - sb.Append("Type: ").Append(Utilities.Utils.TranslateTypeName(TypeName)).AppendLine(); + sb.Append("Type: ").Append(TypeName).AppendLine(); sb.Append("Size: ").Append(Utilities.Utils.FormatBytesCount((int)new FileInfo(Path).Length)).AppendLine(); - sb.Append("Path: ").Append(Utilities.Utils.GetAssetNamePathWithExt(Path)).AppendLine(); + sb.Append("Path: ").Append(Path).AppendLine(); } /// diff --git a/Source/Editor/Content/Items/ContentFolder.cs b/Source/Editor/Content/Items/ContentFolder.cs index 974b813ee..cbbc15f24 100644 --- a/Source/Editor/Content/Items/ContentFolder.cs +++ b/Source/Editor/Content/Items/ContentFolder.cs @@ -3,7 +3,6 @@ using System; using System.Collections.Generic; using System.IO; -using System.Text; using FlaxEditor.GUI.Drag; using FlaxEngine; using FlaxEngine.GUI; @@ -138,13 +137,7 @@ namespace FlaxEditor.Content /// public override void UpdateTooltipText() { - string fileDescription = "Folder"; - StringBuilder sb = new StringBuilder(); - - sb.Append("Type: ").Append(fileDescription).AppendLine(); - sb.Append("Path: ").Append(Utilities.Utils.GetAssetNamePathWithExt(Path)).AppendLine(); - - TooltipText = sb.ToString(); + TooltipText = Path; } /// diff --git a/Source/Editor/Content/Items/ContentItem.cs b/Source/Editor/Content/Items/ContentItem.cs index b4a4caa9a..284f3f1b3 100644 --- a/Source/Editor/Content/Items/ContentItem.cs +++ b/Source/Editor/Content/Items/ContentItem.cs @@ -2,8 +2,6 @@ using System; using System.Collections.Generic; -using System.IO; -using System.Text; using FlaxEditor.Content.GUI; using FlaxEditor.GUI.Drag; using FlaxEngine; @@ -355,19 +353,11 @@ namespace FlaxEditor.Content } /// - /// Updates the tooltip text. + /// Updates the tooltip text text. /// public virtual void UpdateTooltipText() { - string fileExtension = System.IO.Path.GetExtension(Path); - string fileDescription = Utilities.Utils.TranslateFileExtension(fileExtension); - StringBuilder sb = new StringBuilder(); - - sb.Append("Type: ").Append(fileDescription).AppendLine(); - sb.Append("Size: ").Append(Utilities.Utils.FormatBytesCount((int)new FileInfo(Path).Length)).AppendLine(); - sb.Append("Path: ").Append(Utilities.Utils.GetAssetNamePathWithExt(Path)).AppendLine(); - - TooltipText = sb.ToString(); + TooltipText = "Path: " + Path; } /// diff --git a/Source/Editor/Options/InterfaceOptions.cs b/Source/Editor/Options/InterfaceOptions.cs index d8e30d62b..acfb7f5e8 100644 --- a/Source/Editor/Options/InterfaceOptions.cs +++ b/Source/Editor/Options/InterfaceOptions.cs @@ -134,13 +134,6 @@ namespace FlaxEditor.Options [EditorDisplay("Interface"), EditorOrder(280), Tooltip("Editor content window orientation.")] public FlaxEngine.GUI.Orientation ContentWindowOrientation { get; set; } = FlaxEngine.GUI.Orientation.Horizontal; - /// - /// Gets or sets the option to use type name translations. - /// - [DefaultValue(true)] - [EditorDisplay("Interface"), EditorOrder(290), Tooltip("Attempt to translate asset type names.")] - public bool TranslateTypeNames { get; set; } = true; - /// /// Gets or sets the timestamps prefix mode for output log messages. /// diff --git a/Source/Editor/Utilities/Utils.cs b/Source/Editor/Utilities/Utils.cs index 6ef5a8ea0..ade084431 100644 --- a/Source/Editor/Utilities/Utils.cs +++ b/Source/Editor/Utilities/Utils.cs @@ -20,8 +20,6 @@ using FlaxEditor.SceneGraph; using FlaxEditor.Scripting; using FlaxEngine; using FlaxEngine.GUI; -using FlaxEditor.Options; -using System.Linq; namespace FlaxEngine { @@ -1019,76 +1017,6 @@ namespace FlaxEditor.Utilities node.Visible = isThisVisible | isAnyChildVisible; } - /// - /// Gets the asset type, translating if possible, and if enabled in InterfaceOptions.TranslateTypes. - /// - /// The type name. - /// The translated type name. - public static string TranslateTypeName(string typeName) - { - // TODO: Surely there is a better way to get this value. - if (!Editor.Instance.Options.Options.Interface.TranslateTypeNames) - { - return typeName; - } - - string[] typeNamespaces = typeName.Split('.'); - string lastNamespace = typeNamespaces.Last(); - - // TODO: Add better handling for unconventional type names. - try - { - // Adds spaces between capital letters. - return string.Concat(lastNamespace.Select(x => Char.IsUpper(x) ? " " + x : x.ToString())).TrimStart(' '); - } catch { - return typeName; - } - } - - /// - /// Gets a description of a file from it's extension. - /// - /// The file's extension - /// The processed description. - public static string TranslateFileExtension(string fileExtension) - { - string fileDescription = ""; - switch (fileExtension) - { - case ".cs": - fileDescription = "C# Source Code"; - break; - case ".cpp": - fileDescription = "C++ Source Code"; - break; - case ".h": - fileDescription = "C++ Header File"; - break; - case ".json": - fileDescription = "JSON File"; - break; - default: - fileDescription = fileExtension; - break; - } - - return fileDescription; - } - - - /// - /// Gets the asset name relative to the project root folder (with asset file extension) - /// - /// The asset path. - /// The processed name path. - public static string GetAssetNamePathWithExt(string path) - { - var projectFolder = Globals.ProjectFolder; - if (path.StartsWith(projectFolder)) - path = path.Substring(projectFolder.Length + 1); - return path; - } - /// /// Gets the asset name relative to the project root folder (without asset file extension) /// @@ -1096,7 +1024,9 @@ namespace FlaxEditor.Utilities /// The processed name path. public static string GetAssetNamePath(string path) { - path = GetAssetNamePathWithExt(path); + var projectFolder = Globals.ProjectFolder; + if (path.StartsWith(projectFolder)) + path = path.Substring(projectFolder.Length + 1); return StringUtils.GetPathWithoutExtension(path); } From 681564189fe720005470cc54d06af60ae149a499 Mon Sep 17 00:00:00 2001 From: Menotdan Date: Mon, 8 May 2023 00:42:38 -0400 Subject: [PATCH 3/4] Finish implementing IconButton and use that to create a more intuitive scale linking interface. --- .../Editors/ActorTransformEditor.cs | 15 +- Source/Engine/UI/GUI/Common/Button.cs | 4 +- Source/Engine/UI/GUI/Common/IconButton.cs | 191 +++++------------- 3 files changed, 55 insertions(+), 155 deletions(-) diff --git a/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs b/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs index a824076f7..fb7a0b29d 100644 --- a/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs +++ b/Source/Editor/CustomEditors/Editors/ActorTransformEditor.cs @@ -79,7 +79,6 @@ namespace FlaxEditor.CustomEditors.Editors public class ScaleEditor : Float3Editor { private Button _linkButton; - private SpriteBrush _linkBrush; /// public override void Initialize(LayoutElementsContainer layout) @@ -89,20 +88,16 @@ namespace FlaxEditor.CustomEditors.Editors LinkValues = Editor.Instance.Windows.PropertiesWin.ScaleLinked; // Add button with the link icon. - _linkBrush = new SpriteBrush(Editor.Instance.Icons.Link32); - _linkButton = new Button + //Editor.Instance.Icons.Link32 + _linkButton = new IconButton(Editor.Instance.Icons.Link32) { Parent = LinkedLabel, Width = 18, Height = 18, - BackgroundBrush = _linkBrush, - AnchorPreset = AnchorPresets.TopLeft, + AnchorPreset = AnchorPresets.TopLeft }; _linkButton.Clicked += ToggleLink; - _linkButton.BorderColor = Color.Transparent; - _linkButton.BorderColorSelected = Color.Transparent; - _linkButton.BorderColorHighlighted = Color.Transparent; SetLinkStyle(); var x = LinkedLabel.Text.Value.Length * 7 + 5; @@ -142,9 +137,7 @@ namespace FlaxEditor.CustomEditors.Editors private void SetLinkStyle() { Color backgroundColor = LinkValues ? FlaxEngine.GUI.Style.Current.BackgroundSelected : FlaxEngine.GUI.Style.Current.ForegroundDisabled; - _linkButton.BackgroundColor = backgroundColor; - _linkButton.BackgroundColorHighlighted = backgroundColor.RGBMultiplied(0.9f); - _linkButton.BackgroundColorSelected = backgroundColor.RGBMultiplied(0.8f); + _linkButton.SetColors(backgroundColor); _linkButton.TooltipText = (LinkValues ? "Unlink" : "Link") + " values for uniform scaling."; } } diff --git a/Source/Engine/UI/GUI/Common/Button.cs b/Source/Engine/UI/GUI/Common/Button.cs index 0e0d29615..b6ee13e41 100644 --- a/Source/Engine/UI/GUI/Common/Button.cs +++ b/Source/Engine/UI/GUI/Common/Button.cs @@ -10,7 +10,7 @@ namespace FlaxEngine.GUI public class Button : ContainerControl { /// - /// The default height fro the buttons. + /// The default height for the buttons. /// public const float DefaultHeight = 24.0f; @@ -195,7 +195,7 @@ namespace FlaxEngine.GUI /// Sets the button colors palette based on a given main color. /// /// The main color. - public void SetColors(Color color) + public virtual void SetColors(Color color) { BackgroundColor = color; BorderColor = color.RGBMultiplied(0.5f); diff --git a/Source/Engine/UI/GUI/Common/IconButton.cs b/Source/Engine/UI/GUI/Common/IconButton.cs index 196b4b9c4..e2652cd9f 100644 --- a/Source/Engine/UI/GUI/Common/IconButton.cs +++ b/Source/Engine/UI/GUI/Common/IconButton.cs @@ -9,159 +9,66 @@ namespace FlaxEngine.GUI /// public class IconButton : Button { - /// - public override void ClearState() + /// + /// The sprite rendered on the button. + /// + public SpriteHandle ButtonSprite { get; set; } + + /// + /// Whether or not to hide the border of the button. + /// + public bool HideBorder = true; + + /// + /// Initializes a new instance of the class. + /// + /// The sprite used by the button. + public IconButton(SpriteHandle buttonSprite) + : this(0, 0, buttonSprite) { - base.ClearState(); - - if (_isPressed) - OnPressEnd(); } - /// - public override void DrawSelf() + /// + /// Initializes a new instance of the class. + /// + /// Position X coordinate + /// Position Y coordinate + /// The sprite used by the button. + /// Width + /// Height + /// Whether or not to hide the border. + public IconButton(float x, float y, SpriteHandle buttonSprite, float width = 120, float height = DefaultHeight, bool hideBorder = true) + : base(x, y, width, height) { - // Cache data - Rectangle clientRect = new Rectangle(Float2.Zero, Size); - bool enabled = EnabledInHierarchy; - Color backgroundColor = BackgroundColor; - Color borderColor = BorderColor; - Color textColor = TextColor; - if (!enabled) - { - backgroundColor *= 0.5f; - borderColor *= 0.5f; - textColor *= 0.6f; - } - else if (_isPressed) - { - backgroundColor = BackgroundColorSelected; - borderColor = BorderColorSelected; - } - else if (IsMouseOver || IsNavFocused) - { - backgroundColor = BackgroundColorHighlighted; - borderColor = BorderColorHighlighted; - } - - // Draw background - if (BackgroundBrush != null) - BackgroundBrush.Draw(clientRect, backgroundColor); - else - Render2D.FillRectangle(clientRect, backgroundColor); - Render2D.DrawRectangle(clientRect, borderColor); - - // Draw text - Render2D.DrawText(_font?.GetFont(), TextMaterial, _text, clientRect, textColor, TextAlignment.Center, TextAlignment.Center); + ButtonSprite = buttonSprite; + BackgroundBrush = new SpriteBrush(ButtonSprite); + HideBorder = hideBorder; } - /// - public override void OnMouseEnter(Float2 location) + /// + /// Initializes a new instance of the class. + /// + /// Position + /// Size + /// The sprite used by the button. + public IconButton(Float2 location, Float2 size, SpriteHandle buttonSprite) + : this(location.X, location.Y, buttonSprite, size.X, size.Y) { - base.OnMouseEnter(location); - - HoverBegin?.Invoke(); } - /// - public override void OnMouseLeave() + /// + /// Sets the colors of the button, taking into account the field.> + /// + /// The color to use. + public override void SetColors(Color color) { - if (_isPressed) - { - OnPressEnd(); - } + BackgroundColor = color; + BackgroundColorSelected = color.RGBMultiplied(0.8f); + BackgroundColorHighlighted = color.RGBMultiplied(1.2f); - HoverEnd?.Invoke(); - - base.OnMouseLeave(); - } - - /// - public override bool OnMouseDown(Float2 location, MouseButton button) - { - if (base.OnMouseDown(location, button)) - return true; - - if (button == MouseButton.Left && !_isPressed) - { - OnPressBegin(); - return true; - } - return false; - } - - /// - public override bool OnMouseUp(Float2 location, MouseButton button) - { - if (base.OnMouseUp(location, button)) - return true; - - if (button == MouseButton.Left && _isPressed) - { - OnPressEnd(); - OnClick(); - return true; - } - return false; - } - - /// - public override bool OnTouchDown(Float2 location, int pointerId) - { - if (base.OnTouchDown(location, pointerId)) - return true; - - if (!_isPressed) - { - OnPressBegin(); - return true; - } - return false; - } - - /// - public override bool OnTouchUp(Float2 location, int pointerId) - { - if (base.OnTouchUp(location, pointerId)) - return true; - - if (_isPressed) - { - OnPressEnd(); - OnClick(); - return true; - } - return false; - } - - /// - public override void OnTouchLeave() - { - if (_isPressed) - { - OnPressEnd(); - } - - base.OnTouchLeave(); - } - - /// - public override void OnLostFocus() - { - if (_isPressed) - { - OnPressEnd(); - } - - base.OnLostFocus(); - } - - /// - public override void OnSubmit() - { - OnClick(); - - base.OnSubmit(); + BorderColor = HideBorder ? Color.Transparent : color.RGBMultiplied(0.5f); + BorderColorSelected = BorderColor; + BorderColorHighlighted = BorderColor; } } } From 627b1cee103b58fe42324d72e6fa69323834f508 Mon Sep 17 00:00:00 2001 From: Menotdan <32620310+Menotdan@users.noreply.github.com> Date: Wed, 10 May 2023 17:49:45 -0400 Subject: [PATCH 4/4] Resolve issues that came through when attempting to merge previously. --- Source/Editor/Content/Items/ContentFolder.cs | 1 + Source/Editor/Content/Items/ContentItem.cs | 2 ++ Source/Editor/Utilities/Utils.cs | 1 + 3 files changed, 4 insertions(+) diff --git a/Source/Editor/Content/Items/ContentFolder.cs b/Source/Editor/Content/Items/ContentFolder.cs index a654ea697..86c374fee 100644 --- a/Source/Editor/Content/Items/ContentFolder.cs +++ b/Source/Editor/Content/Items/ContentFolder.cs @@ -3,6 +3,7 @@ using System; using System.Collections.Generic; using System.IO; +using System.Text; using FlaxEditor.GUI.Drag; using FlaxEngine; using FlaxEngine.GUI; diff --git a/Source/Editor/Content/Items/ContentItem.cs b/Source/Editor/Content/Items/ContentItem.cs index 60adb1caa..2a0390b30 100644 --- a/Source/Editor/Content/Items/ContentItem.cs +++ b/Source/Editor/Content/Items/ContentItem.cs @@ -2,6 +2,8 @@ using System; using System.Collections.Generic; +using System.IO; +using System.Text; using FlaxEditor.Content.GUI; using FlaxEditor.GUI.Drag; using FlaxEngine; diff --git a/Source/Editor/Utilities/Utils.cs b/Source/Editor/Utilities/Utils.cs index 614c4cdc7..acc0cf605 100644 --- a/Source/Editor/Utilities/Utils.cs +++ b/Source/Editor/Utilities/Utils.cs @@ -1030,6 +1030,7 @@ namespace FlaxEditor.Utilities return path; } + /// /// Gets the asset name relative to the project root folder (without asset file extension) /// /// The asset path.