Merge pull request #300 from kalilistic/imgui-ish

refactor: update custom imgui component setup

Dalamud/Interface/Components/ComponentDemoWindow.cs

@@ -1,19 +1,18 @@
+using System;
 using System.Collections.Generic;
-using System.Linq;
 using System.Numerics;
 
 using Dalamud.Interface.Windowing;
-using Dalamud.Plugin;
 using ImGuiNET;
 
 namespace Dalamud.Interface.Components
 {
     /// <summary>
-    /// Component Demo Window to view custom components.
+    /// Component Demo Window to view custom ImGui components.
     /// </summary>
     internal class ComponentDemoWindow : Window
     {
-        private List<IComponent> components = new List<IComponent>();
+        private readonly List<KeyValuePair<string, Action>> componentDemos;
 
         /// <summary>
         /// Initializes a new instance of the <see cref="ComponentDemoWindow"/> class.
@@ -23,45 +22,59 @@ namespace Dalamud.Interface.Components
         {
             this.Size = new Vector2(600, 500);
             this.SizeCondition = ImGuiCond.FirstUseEver;
-            this.AddComponents();
+            this.componentDemos = new List<KeyValuePair<string, Action>>
-            this.SortComponents();
+            {
+                Demo("Test", ImGuiComponents.Test),
+                Demo("HelpMarker", HelpMarkerDemo),
+                Demo("IconButton", IconButtonDemo),
+            };
         }
 
         /// <inheritdoc/>
         public override void Draw()
         {
             ImGui.BeginChild("comp_scrolling", new Vector2(0, 0), false, ImGuiWindowFlags.AlwaysVerticalScrollbar | ImGuiWindowFlags.HorizontalScrollbar);
-
             ImGui.Text("This is a collection of UI components you can use in your plugin.");
 
-            for (var i = 0; i < this.components.Count; i++)
+            for (var i = 0; i < this.componentDemos.Count; i++)
             {
-                var thisComp = this.components[i];
+                var componentDemo = this.componentDemos[i];
 
-                if (ImGui.CollapsingHeader($"{thisComp.Name} ({thisComp.GetType().FullName})###comp{i}"))
+                if (ImGui.CollapsingHeader($"{componentDemo.Key}###comp{i}"))
                 {
-                    thisComp.Draw();
+                    componentDemo.Value();
                 }
             }
 
             ImGui.EndChild();
         }
 
-        private void AddComponents()
+        private static void HelpMarkerDemo()
         {
-            this.components.Add(new TestComponent());
+            ImGui.Text("Hover over the icon to learn more.");
-            this.components.Add(new HelpMarkerComponent("help me!")
+            ImGuiComponents.HelpMarker("help me!");
-            {
-                SameLine = false,
-            });
-            var iconButtonComponent = new IconButtonComponent(1, FontAwesomeIcon.Carrot);
-            iconButtonComponent.OnButtonClicked += id => PluginLog.Log("Button#{0} clicked!", id);
-            this.components.Add(iconButtonComponent);
         }
 
-        private void SortComponents()
+        private static void IconButtonDemo()
         {
-            this.components = this.components.OrderBy(component => component.Name).ToList();
+            ImGui.Text("Click on the icon to use as a button.");
+            ImGui.SameLine();
+            if (ImGuiComponents.IconButton(1, FontAwesomeIcon.Carrot))
+            {
+                ImGui.OpenPopup("IconButtonDemoPopup");
+            }
+
+            if (ImGui.BeginPopup("IconButtonDemoPopup"))
+            {
+                ImGui.Text("You clicked!");
+            }
+
+            ImGui.EndPopup();
+        }
+
+        private static KeyValuePair<string, Action> Demo(string name, Action func)
+        {
+            return new KeyValuePair<string, Action>(name, func);
         }
     }
 }

Dalamud/Interface/Components/HelpMarkerComponent.cs

@@ -1,61 +0,0 @@
-using ImGuiNET;
-
-namespace Dalamud.Interface.Components
-{
-    /// <summary>
-    /// HelpMarker component to add a help icon with text on hover.
-    /// </summary>
-    public class HelpMarkerComponent : IComponent
-    {
-        /// <summary>
-        /// Initializes a new instance of the <see cref="HelpMarkerComponent"/> class.
-        /// </summary>
-        /// <param name="helpText">The text to display on hover.</param>
-        public HelpMarkerComponent(string helpText)
-        {
-            this.HelpText = helpText;
-        }
-
-        /// <summary>
-        /// Gets component name.
-        /// </summary>
-        public string Name { get; } = "HelpMarker Component";
-
-        /// <summary>
-        /// Gets or sets a value indicating whether the help text should display on same line as previous element.
-        /// </summary>
-        public bool SameLine { get; set; } = true;
-
-        /// <summary>
-        /// Gets or sets the help text.
-        /// </summary>
-        public string HelpText { get; set; }
-
-        /// <summary>
-        /// Gets or sets the help marker icon.
-        /// </summary>
-        public FontAwesomeIcon HelpIcon { get; set; } = FontAwesomeIcon.InfoCircle;
-
-        /// <summary>
-        /// Gets or sets the help text size modifier.
-        /// </summary>
-        public float HelpTextModifier { get; set; } = 35.0f;
-
-        /// <summary>
-        /// Draw HelpMarker component.
-        /// </summary>
-        public void Draw()
-        {
-            if (this.SameLine) ImGui.SameLine();
-            ImGui.PushFont(UiBuilder.IconFont);
-            ImGui.TextDisabled(this.HelpIcon.ToIconString());
-            ImGui.PopFont();
-            if (!ImGui.IsItemHovered()) return;
-            ImGui.BeginTooltip();
-            ImGui.PushTextWrapPos(ImGui.GetFontSize() * this.HelpTextModifier);
-            ImGui.TextUnformatted(this.HelpText);
-            ImGui.PopTextWrapPos();
-            ImGui.EndTooltip();
-        }
-    }
-}

Dalamud/Interface/Components/IComponent.cs

@@ -1,18 +0,0 @@
-namespace Dalamud.Interface.Components
-{
-    /// <summary>
-    /// Base interface implementing a modular interface component.
-    /// </summary>
-    public interface IComponent
-    {
-        /// <summary>
-        /// Gets the name of the component.
-        /// </summary>
-        public string Name { get; }
-
-        /// <summary>
-        /// Draw the component via ImGui.
-        /// </summary>
-        public void Draw();
-    }
-}

Dalamud/Interface/Components/IconButtonComponent.cs

@@ -1,82 +0,0 @@
-using System.Numerics;
-
-using ImGuiNET;
-
-namespace Dalamud.Interface.Components
-{
-    /// <summary>
-    /// IconButton component to use an icon as a button.
-    /// </summary>
-    public class IconButtonComponent : IComponent
-    {
-        /// <summary>
-        /// Initializes a new instance of the <see cref="IconButtonComponent"/> class.
-        /// </summary>
-        /// <param name="buttonId">The id for the button.</param>
-        /// <param name="buttonIcon">The icon for the button.</param>
-        public IconButtonComponent(int buttonId, FontAwesomeIcon buttonIcon)
-        {
-            this.ButtonId = buttonId;
-            this.ButtonIcon = buttonIcon;
-        }
-
-        /// <summary>
-        /// Delegate for the <see cref="IconButtonComponent.IsButtonClickedDelegate"/> event that occurs when the button is clicked.
-        /// </summary>
-        /// <param name="buttonId">The id of the button that was clicked.</param>
-        public delegate void IsButtonClickedDelegate(int buttonId);
-
-        /// <summary>
-        /// Event that occurs when the button is clicked.
-        /// </summary>
-        public event IsButtonClickedDelegate OnButtonClicked;
-
-        /// <summary>
-        /// Gets component name.
-        /// </summary>
-        public string Name { get; } = "IconButton Component";
-
-        /// <summary>
-        /// Gets or sets the id for the button.
-        /// </summary>
-        public int ButtonId { get; set; }
-
-        /// <summary>
-        /// Gets or sets the icon to use for the button.
-        /// </summary>
-        public FontAwesomeIcon ButtonIcon { get; set; }
-
-        /// <summary>
-        /// Gets or sets the button color.
-        /// </summary>
-        public Vector4 ButtonColor { get; set; } = Vector4.Zero;
-
-        /// <summary>
-        /// Gets or sets the active button color.
-        /// </summary>
-        public Vector4 ButtonColorActive { get; set; } = Vector4.Zero;
-
-        /// <summary>
-        /// Gets or sets the hovered button color.
-        /// </summary>
-        public Vector4 ButtonColorHovered { get; set; } = Vector4.Zero;
-
-        /// <summary>
-        /// Draw IconButton component.
-        /// </summary>
-        public void Draw()
-        {
-            ImGui.PushStyleColor(ImGuiCol.Button, this.ButtonColor);
-            ImGui.PushStyleColor(ImGuiCol.ButtonActive, this.ButtonColorActive);
-            ImGui.PushStyleColor(ImGuiCol.ButtonHovered, this.ButtonColorHovered);
-            ImGui.PushFont(UiBuilder.IconFont);
-            if (ImGui.Button($"{this.ButtonIcon.ToIconString()}{this.ButtonId}"))
-            {
-                this.OnButtonClicked?.Invoke(this.ButtonId);
-            }
-
-            ImGui.PopFont();
-            ImGui.PopStyleColor(3);
-        }
-    }
-}

Dalamud/Interface/Components/ImGuiComponents.HelpMarker.cs

@@ -0,0 +1,28 @@
+using ImGuiNET;
+
+namespace Dalamud.Interface.Components
+{
+    /// <summary>
+    /// Class containing various methods providing ImGui components.
+    /// </summary>
+    public static partial class ImGuiComponents
+    {
+        /// <summary>
+        /// HelpMarker component to add a help icon with text on hover.
+        /// </summary>
+        /// <param name="helpText">The text to display on hover.</param>
+        public static void HelpMarker(string helpText)
+        {
+            ImGui.SameLine();
+            ImGui.PushFont(UiBuilder.IconFont);
+            ImGui.TextDisabled(FontAwesomeIcon.InfoCircle.ToIconString());
+            ImGui.PopFont();
+            if (!ImGui.IsItemHovered()) return;
+            ImGui.BeginTooltip();
+            ImGui.PushTextWrapPos(ImGui.GetFontSize() * 35.0f);
+            ImGui.TextUnformatted(helpText);
+            ImGui.PopTextWrapPos();
+            ImGui.EndTooltip();
+        }
+    }
+}

Dalamud/Interface/Components/ImGuiComponents.IconButton.cs

@@ -0,0 +1,51 @@
+using System.Numerics;
+
+using ImGuiNET;
+
+namespace Dalamud.Interface.Components
+{
+    /// <summary>
+    /// Class containing various methods providing ImGui components.
+    /// </summary>
+    public static partial class ImGuiComponents
+    {
+        /// <summary>
+        /// IconButton component to use an icon as a button.
+        /// </summary>
+        /// <param name="id">The ID of the button.</param>
+        /// <param name="icon">The icon for the button.</param>
+        /// <returns>Indicator if button is clicked.</returns>
+        public static bool IconButton(int id, FontAwesomeIcon icon)
+        {
+            ImGui.PushStyleColor(ImGuiCol.Button, Vector4.Zero);
+            ImGui.PushStyleColor(ImGuiCol.ButtonActive, Vector4.Zero);
+            ImGui.PushStyleColor(ImGuiCol.ButtonHovered, Vector4.Zero);
+            ImGui.PushFont(UiBuilder.IconFont);
+            var button = ImGui.Button($"{icon.ToIconString()}{id}");
+            ImGui.PopFont();
+            ImGui.PopStyleColor(3);
+            return button;
+        }
+
+        /// <summary>
+        /// IconButton component to use an icon as a button with color options.
+        /// </summary>
+        /// <param name="id">The ID of the button.</param>
+        /// <param name="icon">The icon for the button.</param>
+        /// <param name="defaultColor">The default color of the button.</param>
+        /// <param name="activeColor">The color of the button when active.</param>
+        /// <param name="hoveredColor">The color of the button when hovered.</param>
+        /// <returns>Indicator if button is clicked.</returns>
+        public static bool IconButton(int id, FontAwesomeIcon icon, Vector4 defaultColor, Vector4 activeColor, Vector4 hoveredColor)
+        {
+            ImGui.PushStyleColor(ImGuiCol.Button, defaultColor);
+            ImGui.PushStyleColor(ImGuiCol.ButtonActive, activeColor);
+            ImGui.PushStyleColor(ImGuiCol.ButtonHovered, hoveredColor);
+            ImGui.PushFont(UiBuilder.IconFont);
+            var button = ImGui.Button($"{icon.ToIconString()}{id}");
+            ImGui.PopFont();
+            ImGui.PopStyleColor(3);
+            return button;
+        }
+    }
+}

Dalamud/Interface/Components/ImGuiComponents.Test.cs

@@ -0,0 +1,18 @@
+using ImGuiNET;
+
+namespace Dalamud.Interface.Components
+{
+    /// <summary>
+    /// Class containing various methods providing ImGui components.
+    /// </summary>
+    public static partial class ImGuiComponents
+    {
+        /// <summary>
+        /// Test component to demonstrate how ImGui components work.
+        /// </summary>
+        public static void Test()
+        {
+            ImGui.Text("You are viewing the test component. The test was a success.");
+        }
+    }
+}

Dalamud/Interface/Components/ImGuiComponents.cs

@@ -0,0 +1,9 @@
+namespace Dalamud.Interface.Components
+{
+    /// <summary>
+    /// Class containing various methods providing ImGui components.
+    /// </summary>
+    public static partial class ImGuiComponents
+    {
+    }
+}

Dalamud/Interface/Components/TestComponent.cs

@@ -1,23 +0,0 @@
-using ImGuiNET;
-
-namespace Dalamud.Interface.Components
-{
-    /// <summary>
-    /// Test component to demonstrate how ImGui components work.
-    /// </summary>
-    public class TestComponent : IComponent
-    {
-        /// <summary>
-        /// Gets component name.
-        /// </summary>
-        public string Name { get; } = "Test Component";
-
-        /// <summary>
-        /// Draw test component.
-        /// </summary>
-        public void Draw()
-        {
-            ImGui.Text("You are viewing the test component. The test was a success.");
-        }
-    }
-}