Merge branch 'main' into standard-renderer

TODO.md

@@ -1,5 +1,12 @@
 # Voile MVP
 
+## Bugfixes
+
+- ActionJustPressed and KeyboardKeyJustPressed don't detect inputs consistently.
+  - **Solution**: This is a problem related to custom frame pacing for fixed timestep. Raylib polls input in BeginFrame, which means certain functions related to JustPressed* may work incorrectly when polled in a separate timestep. This can be fixed if the entire input system will be moved to SDL or with a custom render + input backend altogether.
+- ~~Fix any remaining bugs with anchor positioning system.~~
+  - ~~Containers don't position their chilren correctly when using anchors and adding/removing them.~~ 
+
 ## Core
 
 - ~~Add and implement interfaces for systems (ISystem, IUpdatableSystem, etc.)~~
@@ -23,6 +30,7 @@
 
 - Serialize attribute.
 - Add automatic serialization of resources through source generation and System.Text.Json.
+  - Make sure this serialization system works well with CLR and NativeAOT.
 - ~~Provide means for fetching key/value configuration (INI? TOML?)~~
   - Expose some sort of ConfigFile class for safe key/value configuration fetching.
 
@@ -63,7 +71,17 @@
 
 ## UI
 
-- Immediate mode API.
+- ~~Layout~~
-- Styling.
+  - ~~Containers~~
+    - ~~VerticalContainer~~
+    - ~~HorizontalContainer~~
+    - ~~GridContainer~~
+    - ~~FlexContainer~~
+  - ~~Positioning (anchors)~~
+- ~~Move layouting to Render instead of Update, use Update for input.~~
+- Input propagation
 - Basic input elements (button, text field, toggle).
-- Containers (vertical and horizontal).
+- Styling
+  - Add style settings for UI panels (for buttons, labels, etc.).
+  - Find a way to reference external assets in the style (fonts, textures).
+  - Create a default style for widgets.

TestGame/TestGame.cs

@@ -6,6 +6,9 @@ using System.Numerics;
 using System.Diagnostics.CodeAnalysis;
 using Voile.Rendering;
 using Voile.OpenAL;
+using Voile.UI;
+using Voile.UI.Widgets;
+using Voile.UI.Containers;
 
 public class TestGame : Game
 {
@@ -16,10 +19,12 @@ public class TestGame : Game
     {
         InitializeSystemsDefault();
 
-        _audioSystem = new OpenALSystem();
+        _uiSystem = new UISystem(Input, ResourceRef<Style>.Empty());
+        _uiSystem.RenderDebugRects = true;
+
         _particleSystem = new ParticleSystem();
 
-        AddSystemToUpdate(_audioSystem);
+        AddSystemToUpdate(_uiSystem);
         AddSystemToUpdate(_particleSystem);
     }
 
@@ -50,6 +55,10 @@ public class TestGame : Game
     {
         Input.AddInputMapping("reload", new IInputAction[] { new KeyInputAction(KeyboardKey.R) });
         _emitterId = _particleSystem.CreateEmitter(Renderer.WindowSize / 2, _fireEffect);
+
+        _frame.AddChild(_container);
+
+        _uiSystem.AddElement(_frame);
     }
 
 
@@ -57,36 +66,38 @@ public class TestGame : Game
     {
         if (Input.IsActionPressed("reload"))
         {
-            // ResourceManager.Reload();
+            ResourceManager.Reload();
-            // _particleSystem!.RestartEmitter(_emitterId);
+            _particleSystem!.RestartEmitter(_emitterId);
-            _audioSystem.PlaySound(_sound.Value, 1.0f);
         }
 
-        if (Input.KeyboardKeyJustPressed(KeyboardKey.One))
+        if (Input.IsActionPressed("accept"))
         {
-            _particleSystem.CreateEmitter(Input.GetMousePosition(), _fireEffect);
+            _container.AddChild(new RectangleWidget(new Rect(32.0f, 32.0f), MathUtils.RandomColor()));
+        }
+
+        if (Input.IsActionPressed("cancel") && _container.Children.Count != 0)
+        {
+            var lastChild = _container.Children.Last();
+            _container.RemoveChild(lastChild);
         }
 
         if (Input.IsMouseButtonDown(MouseButton.Left))
         {
-            _particleSystem.SetEmitterPosition(_emitterId, Input.GetMousePosition());
+            var mousePos = Input.GetMousePosition();
+            _frame.Size = new Rect(mousePos.X, mousePos.Y);
         }
     }
 
     protected override void Render(double deltaTime)
     {
-        Renderer.ClearBackground(Color.Black);
+        Renderer.ClearBackground(Color.CadetBlue);
-        foreach (var emitter in _particleSystem!.Emitters)
+        // foreach (var emitter in _particleSystem!.Emitters)
-        {
+        // {
-            DrawEmitter(emitter);
+        //     DrawEmitter(emitter);
-        }
+        // }
 
-        Renderer.ResetTransform();
+        // Renderer.ResetTransform();
-
+        // _uiSystem.Render(Renderer);
-        Renderer.DrawText(_font, $"Render: {RenderFrameTime.TotalMilliseconds:F1} ms", Color.White);
-
-        Renderer.SetTransform(new Vector2(0.0f, 16.0f), Vector2.Zero);
-        Renderer.DrawText(_font, $"Update: {UpdateTimeStep * 1000:F1} ms", Color.White);
     }
 
     private void DrawEmitter(ParticleEmitter emitter)
@@ -109,10 +120,29 @@ public class TestGame : Game
     }
 
     [NotNull] private ParticleSystem _particleSystem;
-    private OpenALSystem _audioSystem;
+    [NotNull] private UISystem _uiSystem;
     private int _emitterId;
     private ResourceRef<ParticleEmitterSettingsResource> _fireEffect;
     private ResourceRef<Font> _font;
     private ResourceRef<Sound> _sound;
     private ResourceRef<Texture2d> _icon;
+
+    private FlexContainer _container = new(minimumSize: new Rect(64.0f, 64.0f), new())
+    {
+        Anchor = Anchor.Center,
+        Size = new Rect(500, 300),
+        Direction = FlexDirection.Column,
+        Justify = JustifyContent.Start,
+        Align = AlignItems.Center,
+        Wrap = true,
+        Gap = 10f
+    };
+
+    private Frame _frame = new();
+    // private VerticalContainer _container = new(new Rect(128.0f, 64.0f), new(), 16)
+    // {
+    //     ConfineToContents = true,
+    //     Anchor = Anchor.CenterLeft,
+    //     AnchorOffset = new Vector2(0.5f, 0.0f)
+    // };
 }

TestGame/TestGame.csproj

@@ -2,7 +2,7 @@
 
     <PropertyGroup>
         <OutputType>WinExe</OutputType>
-        <TargetFramework>net8.0</TargetFramework>
+        <TargetFramework>net9.0</TargetFramework>
         <ImplicitUsings>enable</ImplicitUsings>
         <Nullable>disable</Nullable>
         <PublishAot>true</PublishAot>

Voile.OpenAL/Voile.OpenAL.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk">
 
     <PropertyGroup>
-        <TargetFramework>net8.0</TargetFramework>
+        <TargetFramework>net9.0</TargetFramework>
         <ImplicitUsings>enable</ImplicitUsings>
         <Nullable>enable</Nullable>
         <AllowUnsafeBlocks>true</AllowUnsafeBlocks>

Voile/Source/Game.cs

@@ -108,7 +108,7 @@ namespace Voile
 
             if (Renderer is null)
             {
-                Renderer = new RaylibRenderSystem();
+                Renderer = new StandardRenderSystem();
             }
 
             if (Input is null)
@@ -164,6 +164,11 @@ namespace Voile
                 throw new NullReferenceException("No renderer provided.");
             }
 
+            if (Input is null)
+            {
+                throw new NullReferenceException("No input system provided.");
+            }
+
             Stopwatch stopwatch = Stopwatch.StartNew();
             double previousTime = stopwatch.Elapsed.TotalSeconds;
 
@@ -175,6 +180,8 @@ namespace Voile
 
                 _accumulator += elapsedTime;
 
+                Input.Poll();
+
                 while (_accumulator >= UpdateTimeStep)
                 {
                     foreach (var system in _updatableSystems)

Voile/Source/Input/InputAction.cs

@@ -31,7 +31,31 @@ namespace Voile.Input
             return inputSystem.KeyboardKeyJustReleased(_keyboardKey);
         }
 
-
         private KeyboardKey _keyboardKey;
     }
+
+    public struct MouseInputAction : IInputAction
+    {
+        public MouseButton MouseButton { get; private set; }
+
+        public MouseInputAction(MouseButton button)
+        {
+            MouseButton = button;
+        }
+
+        public bool IsPressed(InputSystem inputSystem)
+        {
+            return inputSystem.IsMousePressed(MouseButton);
+        }
+
+        public bool IsDown(InputSystem inputSystem)
+        {
+            return inputSystem.IsMouseButtonDown(MouseButton);
+        }
+
+        public bool IsReleased(InputSystem inputSystem)
+        {
+            return inputSystem.IsMouseButtonReleased(MouseButton);
+        }
+    }
 }

Voile/Source/Input/InputSystem.cs

@@ -20,6 +20,12 @@ namespace Voile.Input
             CreateDefaultMappings();
         }
 
+        /// <summary>
+        /// Forces this input system to poll all of its inputs during current frame.<br />
+        /// Some backends require inputs to be polled once per specific interval. Override this method to implement this behavior. 
+        /// </summary>
+        public virtual void Poll() { }
+
         public void Shutdown() => Dispose();
 
         public void Dispose() => GC.SuppressFinalize(this);
@@ -101,8 +107,12 @@ namespace Voile.Input
         public abstract bool KeyboardKeyJustReleased(KeyboardKey key);
 
         public abstract int GetCharPressed();
+
+        public abstract bool IsMousePressed(MouseButton button);
         public abstract bool IsMouseButtonDown(MouseButton button);
+        public abstract bool IsMouseButtonReleased(MouseButton button);
         public abstract float GetMouseWheelMovement();
+
         public abstract void SetMousePosition(Vector2 position);
         public abstract Vector2 GetMousePosition();
         public abstract void HideCursor();
@@ -134,6 +144,12 @@ namespace Voile.Input
                 new KeyInputAction(KeyboardKey.D),
                 new KeyInputAction(KeyboardKey.Right),
             ]);
+            AddInputMapping("accept", [
+                new KeyInputAction(KeyboardKey.Enter),
+            ]);
+            AddInputMapping("cancel", [
+                new KeyInputAction(KeyboardKey.Backspace),
+            ]);
         }
 
         protected bool TryGetInputMappings(string forAction, [NotNullWhen(true)] out List<IInputAction>? inputActions)

Voile/Source/Input/RaylibInputSystem.cs

@@ -8,53 +8,63 @@ namespace Voile.Input
     /// </summary>
     public class RaylibInputSystem : InputSystem
     {
-        public override int GetCharPressed()
+        public override void Poll()
         {
-            return Raylib.GetCharPressed();
+            _justPressedKeys.Clear();
+            _justReleasedKeys.Clear();
+            _downKeys.Clear();
+
+            _pressedMouseButtons.Clear();
+            _releasedMouseButtons.Clear();
+            _downMouseButtons.Clear();
+
+            for (int key = 32; key <= 349; key++)
+            {
+                var k = (KeyboardKey)key;
+                if (Raylib.IsKeyPressed((Raylib_cs.KeyboardKey)k)) _justPressedKeys.Add(k);
+                if (Raylib.IsKeyReleased((Raylib_cs.KeyboardKey)k)) _justReleasedKeys.Add(k);
+                if (Raylib.IsKeyDown((Raylib_cs.KeyboardKey)k)) _downKeys.Add(k);
             }
 
-        public override Vector2 GetMousePosition()
+            foreach (MouseButton button in System.Enum.GetValues(typeof(MouseButton)))
             {
-            return Raylib.GetMousePosition();
+                var rayButton = (Raylib_cs.MouseButton)button;
+                if (Raylib.IsMouseButtonPressed(rayButton)) _pressedMouseButtons.Add(button);
+                if (Raylib.IsMouseButtonReleased(rayButton)) _releasedMouseButtons.Add(button);
+                if (Raylib.IsMouseButtonDown(rayButton)) _downMouseButtons.Add(button);
             }
 
-        public override float GetMouseWheelMovement()
+            _mousePosition = Raylib.GetMousePosition();
-        {
+            _mouseWheelMove = Raylib.GetMouseWheelMove();
-            return Raylib.GetMouseWheelMove();
         }
 
-        public override void HideCursor()
+        public override int GetCharPressed() => Raylib.GetCharPressed();
-        {
+        public override Vector2 GetMousePosition() => _mousePosition;
-            Raylib.HideCursor();
+        public override float GetMouseWheelMovement() => _mouseWheelMove;
-        }
 
-        public override bool IsKeyboardKeyDown(KeyboardKey key)
+        public override void HideCursor() => Raylib.HideCursor();
-        {
-            Raylib_cs.KeyboardKey rayKey = (Raylib_cs.KeyboardKey)key;
-            return Raylib.IsKeyDown(rayKey);
-        }
-
-        public override bool IsMouseButtonDown(MouseButton button)
-        {
-            return Raylib.IsMouseButtonDown((Raylib_cs.MouseButton)button);
-        }
-
-        public override bool KeyboardKeyJustPressed(KeyboardKey key)
-        {
-            Raylib_cs.KeyboardKey rayKey = (Raylib_cs.KeyboardKey)key;
-            return Raylib.IsKeyPressed(rayKey);
-        }
-
-        public override bool KeyboardKeyJustReleased(KeyboardKey key)
-        {
-            return Raylib.IsKeyReleased((Raylib_cs.KeyboardKey)key);
-        }
-
-        public override void SetMousePosition(Vector2 position)
-        {
-            Raylib.SetMousePosition((int)position.X, (int)position.Y);
-        }
         public override void ShowCursor() => Raylib.ShowCursor();
         public override bool IsCursorHidden() => Raylib.IsCursorHidden();
+
+        public override bool IsKeyboardKeyDown(KeyboardKey key) => _downKeys.Contains(key);
+        public override bool KeyboardKeyJustPressed(KeyboardKey key) => _justPressedKeys.Contains(key);
+        public override bool KeyboardKeyJustReleased(KeyboardKey key) => _justReleasedKeys.Contains(key);
+
+        public override bool IsMousePressed(MouseButton button) => _pressedMouseButtons.Contains(button);
+        public override bool IsMouseButtonReleased(MouseButton button) => _releasedMouseButtons.Contains(button);
+        public override bool IsMouseButtonDown(MouseButton button) => _downMouseButtons.Contains(button);
+
+        public override void SetMousePosition(Vector2 position) => Raylib.SetMousePosition((int)position.X, (int)position.Y);
+
+        private readonly HashSet<KeyboardKey> _justPressedKeys = new();
+        private readonly HashSet<KeyboardKey> _justReleasedKeys = new();
+        private readonly HashSet<KeyboardKey> _downKeys = new();
+
+        private readonly HashSet<MouseButton> _pressedMouseButtons = new();
+        private readonly HashSet<MouseButton> _releasedMouseButtons = new();
+        private readonly HashSet<MouseButton> _downMouseButtons = new();
+
+        private Vector2 _mousePosition;
+        private float _mouseWheelMove;
     }
 }

Voile/Source/Rendering/RaylibRenderSystem.cs

@@ -49,6 +49,7 @@ namespace Voile.Rendering
             _defaultFlags = flags;
 
             Raylib.SetConfigFlags(flags);
+            Raylib.SetTargetFPS(settings.TargetFps);
         }
 
         public override void CreateAndInitializeWithWindow(RendererSettings settings)
@@ -187,6 +188,17 @@ namespace Voile.Rendering
             }, transformPivot, transformRotation, VoileColorToRaylibColor(color));
         }
 
+        public override void DrawRectangleOutline(Vector2 size, Color color, float outlineWidth = 1)
+        {
+            Raylib.DrawRectangleLinesEx(new Rectangle()
+            {
+                X = transformPosition.X,
+                Y = transformPosition.Y,
+                Width = size.X,
+                Height = size.Y
+            }, outlineWidth, VoileColorToRaylibColor(color));
+        }
+
         public override void DrawDebugText(string text, int fontSize, Color color)
         {
             Raylib.DrawText(text, (int)transformPosition.X, (int)transformPosition.Y, fontSize, VoileColorToRaylibColor(color));

Voile/Source/Rendering/RenderSystem.cs

@@ -180,6 +180,9 @@ namespace Voile.Rendering
         /// <param name="size">Rectangle size.</param>
         /// <param name="color">Fill color.</param>
         public abstract void DrawRectangle(Vector2 size, Color color);
+
+        public abstract void DrawRectangleOutline(Vector2 size, Color color, float outlineWidth = 1.0f);
+
         /// <summary>
         /// Draws a debug text with a default font.
         /// </summary>

Voile/Source/Rendering/StandardRenderSystem.cs

@@ -363,7 +363,7 @@ namespace Voile.Rendering
 
         private Silk.NET.WebGPU.Color VoileColorToWebGPUColor(Color color)
         {
-            return new Silk.NET.WebGPU.Color(color.R, color.G, color.B, color.A);
+            return new Silk.NET.WebGPU.Color((double)color.R / 255, (double)color.G / 255, (double)color.B / 255, (double)color.A / 255);
         }
 
         private unsafe RenderPassColorAttachment CreateClearColorAttachment(TextureView* view, Color clearColor)
@@ -399,6 +399,11 @@ namespace Voile.Rendering
             throw new NotImplementedException();
         }
 
+        public override void DrawRectangleOutline(Vector2 size, Color color, float outlineWidth = 1)
+        {
+            throw new NotImplementedException();
+        }
+
         private Vector2 _windowSize = Vector2.Zero;
         private IWindow? _window;
 

Voile/Source/Resources/Loaders/StyleLoader.cs

@@ -0,0 +1,17 @@
+using Voile.UI;
+
+namespace Voile.Resources;
+
+public class StyleLoader : ResourceLoader<Style>
+{
+    public override IEnumerable<string> SupportedExtensions =>
+    [
+        ".toml"
+    ];
+
+    protected override Style LoadResource(string path)
+    {
+        // TODO: implement loading styles.
+        return new Style(string.Empty);
+    }
+}

Voile/Source/Resources/Resource.cs

@@ -18,6 +18,11 @@ namespace Voile
         /// </summary>
         public T Value => ResourceManager.GetResource<T>(Guid);
 
+        public static ResourceRef<T> Empty()
+        {
+            return new ResourceRef<T>(Guid.Empty);
+        }
+
         public ResourceRef(Guid guid)
         {
             Guid = guid;

Voile/Source/Resources/ResourceManager.cs

@@ -1,6 +1,6 @@
 using System.Collections.Concurrent;
 using System.Diagnostics.CodeAnalysis;
-
+using Voile.UI;
 using Voile.Utils;
 using Voile.VFS;
 
@@ -207,7 +207,7 @@ namespace Voile.Resources
         /// <param name="resourceGuid">Resource's GUID.</param>
         /// <param name="resource">Retrieved resource. Otherwise null if nothing got retrieved.</param>
         /// <returns>True if resource got successfully retrieved, otherwise false.</returns>
-        public static T GetResource<T>(Guid resourceGuid) where T : Resource
+        public static T? GetResource<T>(Guid resourceGuid) where T : Resource
         {
             if (!TryGetLoader(out ResourceLoader<T>? loader))
             {
@@ -216,6 +216,11 @@ namespace Voile.Resources
 
             if (!GetResource(resourceGuid, out T? loadedResource))
             {
+                if (resourceGuid == Guid.Empty)
+                {
+                    _logger.Warn("Trying to load a resource with an empty GUID, ignoring.");
+                    return null;
+                }
                 throw new Exception($"No resource with GUID \"{resourceGuid}\" found!");
             }
 
@@ -340,11 +345,13 @@ namespace Voile.Resources
 
         private static Logger _logger = new(nameof(ResourceManager));
 
+        // TODO: don't include types from optional systems. Create a way for third-party systems to register their own loader associations.
         private static readonly Dictionary<Type, object> _resourceLoaderAssociations = new()
         {
-            {typeof(Sound), new SoundLoader()},
+            { typeof(Sound), new SoundLoader()},
             {typeof(Texture2d), new Texture2dLoader()},
-            {typeof(Font), new FontLoader()}
+            {typeof(Font), new FontLoader()},
+            { typeof(Style), new StyleLoader()}
         };
 
         private static readonly Dictionary<Type, object> _resourceSaverAssociations = new()

Voile/Source/Systems/ISystem.cs

@@ -1,3 +1,5 @@
+using Voile.Rendering;
+
 namespace Voile;
 
 public interface IStartableSystem
@@ -36,3 +38,11 @@ public interface IUpdatableSystem
     /// <param name="deltaTime">Time step.</param>
     void Update(double deltaTime);
 }
+
+/// <summary>
+/// A system that renders itself to the screen, ex. UI or particles.
+/// </summary>
+public interface IRenderableSystem
+{
+    void Render(RenderSystem renderer);
+}

Voile/Source/UI/Anchor.cs

@@ -0,0 +1,41 @@
+using System.Numerics;
+
+namespace Voile.UI;
+
+public enum Anchor
+{
+    TopLeft,
+    TopCenter,
+    TopRight,
+    CenterLeft,
+    Center,
+    CenterRight,
+    BottomLeft,
+    BottomCenter,
+    BottomRight,
+    Fill
+}
+
+
+public static class AnchorExtensions
+{
+    public static Vector2 Calculate(this Anchor anchor, Vector2 parentPosition, Rect parentRect, Rect elementRect)
+    {
+        var size = new Vector2(elementRect.Width, elementRect.Height);
+        var parentSize = new Vector2(parentRect.Width, parentRect.Height);
+
+        return anchor switch
+        {
+            Anchor.TopLeft => Vector2.Zero,
+            Anchor.TopCenter => new Vector2((parentSize.X - size.X) / 2, 0),
+            Anchor.TopRight => new Vector2(parentSize.X - size.X, 0),
+            Anchor.CenterLeft => new Vector2(0, (parentSize.Y - size.Y) / 2),
+            Anchor.Center => (parentSize - size) / 2,
+            Anchor.CenterRight => new Vector2(parentSize.X - size.X, (parentSize.Y - size.Y) / 2),
+            Anchor.BottomLeft => new Vector2(0, parentSize.Y - size.Y),
+            Anchor.BottomCenter => new Vector2((parentSize.X - size.X) / 2, parentSize.Y - size.Y),
+            Anchor.BottomRight => parentSize - size,
+            _ => Vector2.Zero
+        };
+    }
+}

Voile/Source/UI/Containers/Container.cs

@@ -0,0 +1,136 @@
+using System.Numerics;
+using Voile.Rendering;
+
+namespace Voile.UI.Containers;
+
+// TODO: make Container extend Widget, it already implements similar behaviors. 
+/// <summary>
+/// A base class for all UI containers, used to position and rendering child <see cref="IElement">s.
+/// </summary>
+public abstract class Container : UIElement, IParentableElement
+{
+    /// <inheritdoc />
+    public IReadOnlyList<UIElement> Children => _children;
+
+    /// <summary>
+    /// Specifies if this <see cref="Container"/>'s minimum size will be confined to contents.
+    /// </summary>
+    public bool ConfineToContents { get; set; } = false;
+
+    public override Rect MinimumSize => _minimumSize;
+
+    public Container()
+    {
+        MarkDirty();
+    }
+
+    public Container(Rect minimumSize)
+    {
+        _minimumSize = minimumSize;
+
+        MarkDirty();
+    }
+
+    public Container(Rect minimumSize, List<UIElement> children)
+    {
+        _minimumSize = minimumSize;
+        _children = children;
+
+        MarkDirty();
+    }
+
+    protected override void OnUpdate()
+    {
+        foreach (var child in _children)
+        {
+            if (child is not IUpdatableElement updatable) continue;
+
+            updatable.MarkDirty();
+            updatable.Update();
+
+            if (child is IAnchorableElement anchorable)
+            {
+                anchorable.ApplyAnchor(GlobalPosition, Size);
+            }
+        }
+
+        Arrange();
+
+        if (ConfineToContents)
+        {
+            RecalculateSizes();
+        }
+    }
+
+    /// <summary>
+    /// Called when this <see cref="Container"/> has to rearrange its children.
+    /// </summary>
+    public abstract void Arrange();
+
+    /// <summary>
+    /// Recalculates sizes for this <see cref="Container"/>.
+    /// This is done automatically if <see cref="ConfineToContents"/> is true.
+    /// </summary>
+    public void RecalculateSizes()
+    {
+        float minX = float.MaxValue;
+        float minY = float.MaxValue;
+        float maxX = float.MinValue;
+        float maxY = float.MinValue;
+
+        foreach (var child in Children)
+        {
+            var pos = child.GlobalPosition;
+            var size = child.Size;
+
+            minX = MathF.Min(minX, pos.X);
+            minY = MathF.Min(minY, pos.Y);
+            maxX = MathF.Max(maxX, pos.X + size.Width);
+            maxY = MathF.Max(maxY, pos.Y + size.Height);
+        }
+
+        float padding = 0f;
+
+        float occupiedWidth = (maxX - minX) + padding * 2;
+        float occupiedHeight = (maxY - minY) + padding * 2;
+
+        float finalWidth = MathF.Max(occupiedWidth, _minimumSize.Width);
+        float finalHeight = MathF.Max(occupiedHeight, _minimumSize.Height);
+
+        Size = new Rect(finalWidth, finalHeight);
+
+        if (_minimumSize > Size)
+        {
+            Size = _minimumSize;
+        }
+    }
+
+    public void AddChild(UIElement child)
+    {
+        _children.Add(child);
+        child.SetParent(this);
+
+        MarkDirty();
+        Update();
+    }
+
+    public void RemoveChild(UIElement child)
+    {
+        _children.Remove(child);
+
+        MarkDirty();
+        Update();
+    }
+
+    public override void Render(RenderSystem renderer, Style style)
+    {
+        foreach (var child in Children)
+        {
+            if (child is not IRenderableElement renderable) continue;
+            renderable.Render(renderer, style);
+        }
+    }
+
+    private List<UIElement> _children = new();
+    private Rect _minimumSize = Rect.Zero;
+}

Voile/Source/UI/Containers/FlexContainer.cs

@@ -0,0 +1,185 @@
+using System.Numerics;
+using Voile.Rendering;
+
+namespace Voile.UI.Containers;
+
+public enum FlexDirection
+{
+    Row,
+    Column
+}
+
+public enum JustifyContent
+{
+    /// <summary>
+    /// Align children to the start of the line.
+    /// </summary>
+    Start,
+    /// <summary>
+    /// Align children to the center of the line.
+    /// </summary>
+    Center,
+    /// <summary>
+    /// Align children to the end of the line.
+    /// </summary>
+    End,
+    /// <summary>
+    /// Equal space between items (no space at edges if multiple).
+    /// </summary>
+    SpaceBetween
+}
+
+public enum AlignItems
+{
+    /// <summary>
+    /// Align to the top or left (cross-axis)
+    /// </summary>
+    Start,
+    /// <summary>
+    /// Center along the cross-axis.
+    /// </summary>
+    Center,
+    /// <summary>
+    /// Align to the bottom or right.
+    /// </summary>
+    End
+}
+
+/// <summary>
+/// A flexible layout container that arranges its child elements in rows or columns, similar to CSS flexbox. Supports wrapping, alignment, spacing, and space distribution.
+/// </summary>
+public class FlexContainer : Container
+{
+    /// <summary>
+    /// Layout direction to use with this <see cref="FlexContainer"/>.
+    /// </summary>
+    public FlexDirection Direction { get; set; } = FlexDirection.Row;
+    /// <summary>
+    /// Controls main-axis alignment of child elements. By default, children will be positioned at the start of a line. 
+    /// </summary>
+    public JustifyContent Justify { get; set; } = JustifyContent.Start;
+    /// <summary>
+    /// Controls cross-axis alignment (start, center, end).
+    /// </summary>
+    public AlignItems Align { get; set; } = AlignItems.Start;
+    /// <summary>
+    /// If true, children wrap onto multiple lines (rows or columns).
+    /// </summary>
+    public bool Wrap { get; set; } = false;
+    /// <summary>
+    /// Space between child elements.
+    /// </summary>
+    public float Gap { get; set; } = 16f;
+
+    /// <summary>
+    /// (Reserved) If true, distributes extra space among children (not implemented)
+    /// </summary>
+    public bool DistributeRemainingSpace { get; set; } = false;
+
+    public FlexContainer() : base() { }
+
+    public FlexContainer(Rect minimumSize, List<UIElement> children) : base(minimumSize, children) { }
+
+    public override void Arrange()
+    {
+        float containerMainSize = (Direction == FlexDirection.Row) ? Size.Width : Size.Height;
+        float mainPos = 0.0f;
+        float crossPos = 0.0f;
+
+        List<List<UIElement>> lines = new();
+        List<UIElement> currentLine = new();
+        float lineMainSum = 0f;
+        float maxCross = 0f;
+
+        foreach (var child in Children)
+        {
+            Vector2 childSize = GetChildSize(child);
+            float mainSize = GetMainSize(childSize);
+            float crossSize = GetCrossSize(childSize);
+
+            bool wrapLine = Wrap && currentLine.Count > 0 && (lineMainSum + mainSize + Gap > containerMainSize);
+
+            if (wrapLine)
+            {
+                lines.Add(currentLine);
+                currentLine = new();
+                lineMainSum = 0f;
+                maxCross += crossSize + Gap;
+            }
+
+            currentLine.Add(child);
+            lineMainSum += mainSize + (currentLine.Count > 1 ? Gap : 0);
+        }
+
+        if (currentLine.Count > 0)
+        {
+            lines.Add(currentLine);
+        }
+
+        float currentCross = crossPos;
+
+        foreach (var line in lines)
+        {
+            float lineMainLength = line.Sum(child => GetMainSize(GetChildSize(child))) + Gap * (line.Count - 1);
+            float justifyOffset = GetJustifyOffset(containerMainSize, lineMainLength, line.Count);
+
+            float currentMain = mainPos + justifyOffset;
+            float maxLineCross = line.Select(child => GetCrossSize(GetChildSize(child))).Max();
+
+            foreach (var child in line)
+            {
+                Vector2 childSize = GetChildSize(child);
+
+                float alignedCross = currentCross + GetAlignOffset(maxLineCross, GetCrossSize(childSize));
+
+                Vector2 childPos = (Direction == FlexDirection.Row)
+                    ? new Vector2(currentMain, alignedCross)
+                    : new Vector2(alignedCross, currentMain);
+
+                child.LocalPosition = childPos;
+
+                currentMain += GetMainSize(childSize) + Gap;
+            }
+
+            currentCross += maxLineCross + Gap;
+        }
+    }
+
+    private Vector2 GetChildSize(IElement child)
+    {
+        if (child is IResizeableElement resizeable)
+            return new Vector2(resizeable.MinimumSize.Width, resizeable.MinimumSize.Height);
+        return new Vector2(child.Size.Width, child.Size.Height);
+    }
+
+    private float GetMainSize(Vector2 size)
+    {
+        return Direction == FlexDirection.Row ? size.X : size.Y;
+    }
+
+    private float GetCrossSize(Vector2 size)
+    {
+        return Direction == FlexDirection.Row ? size.Y : size.X;
+    }
+
+    private float GetJustifyOffset(float containerSize, float totalMain, int itemCount)
+    {
+        return Justify switch
+        {
+            JustifyContent.Center => (containerSize - totalMain) / 2f,
+            JustifyContent.End => containerSize - totalMain,
+            JustifyContent.SpaceBetween => (itemCount > 1) ? 0 : (containerSize - totalMain) / 2f,
+            _ => 0
+        };
+    }
+
+    private float GetAlignOffset(float maxCross, float childCross)
+    {
+        return Align switch
+        {
+            AlignItems.Center => (maxCross - childCross) / 2f,
+            AlignItems.End => maxCross - childCross,
+            _ => 0f
+        };
+    }
+}

Voile/Source/UI/Containers/Frame.cs

@@ -0,0 +1,19 @@
+namespace Voile.UI.Containers;
+
+public class Frame : Container
+{
+    public Frame()
+    {
+
+    }
+
+    public Frame(Rect minimumSize) : base(minimumSize)
+    {
+        
+    }
+
+    public override void Arrange()
+    {
+
+    }
+}

Voile/Source/UI/Containers/GridContainer.cs

@@ -0,0 +1,69 @@
+using System.Numerics;
+using Voile.Rendering;
+
+namespace Voile.UI.Containers;
+
+/// <summary>
+/// A grid container arranges its children in a grid layout with a given column count, and column and row spacing between child elements.
+/// </summary>
+public class GridContainer : Container
+{
+    /// <summary>
+    /// Amount of columns this grid has.
+    /// </summary>
+    public int Columns { get; set; } = 2;
+    /// <summary>
+    /// Spacing between each grid column.
+    /// </summary>
+    public float ColumnSpacing { get; set; } = 16.0f;
+    /// <summary>
+    /// Spacing between each grid row.
+    /// </summary>
+    public float RowSpacing { get; set; } = 16.0f;
+
+    public GridContainer(Rect minimumSize, List<UIElement> children, int columns = 2, float colSpacing = 16.0f, float rowSpacing = 16.0f)
+        : base(minimumSize, children)
+    {
+        Columns = columns;
+        ColumnSpacing = colSpacing;
+        RowSpacing = rowSpacing;
+    }
+
+    public GridContainer(int columns = 2, float colSpacing = 16.0f, float rowSpacing = 16.0f)
+    {
+        Columns = columns;
+        ColumnSpacing = colSpacing;
+        RowSpacing = rowSpacing;
+    }
+
+    public override void Arrange()
+    {
+        float currentX = 0.0f;
+        float currentY = 0.0f;
+        int colIndex = 0;
+
+        foreach (var child in Children)
+        {
+            child.LocalPosition = new Vector2(currentX, currentY);
+
+            float childWidth = 0.0f;
+            float childHeight = 0.0f;
+
+            childWidth = child.Size.Width;
+            childHeight = child.Size.Height;
+
+            colIndex++;
+
+            if (colIndex >= Columns)
+            {
+                colIndex = 0;
+                currentX = 0.0f;
+                currentY += childHeight + RowSpacing;
+            }
+            else
+            {
+                currentX += childWidth + ColumnSpacing;
+            }
+        }
+    }
+}

Voile/Source/UI/Containers/HorizontalContainer.cs

@@ -0,0 +1,44 @@
+using System.Numerics;
+using Voile.Rendering;
+
+namespace Voile.UI.Containers;
+
+/// <summary>
+/// A horizontal container arranges its children horizontally, with a given horizontal spacing between child elements.
+/// </summary>
+public class HorizontalContainer : Container
+{
+    /// <summary>
+    /// Horizontal spacing between child elements.
+    /// </summary>
+    public float Spacing { get; set; } = 16.0f;
+
+    public HorizontalContainer(Rect minimumSize, List<UIElement> children, float spacing = 16.0f) : base(minimumSize, children)
+    {
+        Spacing = spacing;
+    }
+
+    public HorizontalContainer(float spacing = 16.0f)
+    {
+        Spacing = spacing;
+    }
+
+    public override void Arrange()
+    {
+        float currentX = 0.0f;
+
+        for (int i = 0; i < Children.Count; i++)
+        {
+            var child = Children[i];
+            var pos = new Vector2(currentX, 0.0f);
+            child.LocalPosition = pos;
+
+            currentX += child.Size.Width;
+
+            if (i < Children.Count - 1)
+            {
+                currentX += Spacing;
+            }
+        }
+    }
+}

Voile/Source/UI/Containers/VerticalContainer.cs

@@ -0,0 +1,44 @@
+using System.Numerics;
+using Voile.Rendering;
+
+namespace Voile.UI.Containers;
+
+/// <summary>
+/// A vertical container arranges its children vertically, with a given vertical spacing between child elements.
+/// </summary>
+public class VerticalContainer : Container
+{
+    /// <summary>
+    /// Vertical spacing between child elements.
+    /// </summary>
+    public float Spacing { get; set; } = 16.0f;
+
+    public VerticalContainer(Rect minimumSize, List<UIElement> children, float spacing = 16.0f) : base(minimumSize, children)
+    {
+        Spacing = spacing;
+    }
+
+    public VerticalContainer(float spacing = 16.0f)
+    {
+        Spacing = spacing;
+    }
+
+    public override void Arrange()
+    {
+        float currentY = 0.0f;
+
+        for (int i = 0; i < Children.Count; i++)
+        {
+            var child = Children[i];
+            var pos = new Vector2(0.0f, currentY);
+            child.LocalPosition = pos;
+
+            currentY += child.Size.Height;
+
+            if (i < Children.Count - 1)
+            {
+                currentY += Spacing;
+            }
+        }
+    }
+}

Voile/Source/UI/IElement.cs

@@ -0,0 +1,98 @@
+using System.Numerics;
+using Voile.Input;
+using Voile.Rendering;
+
+namespace Voile.UI;
+
+public interface IElement
+{
+    /// <summary>
+    /// This element's position in pixels relative to the viewport top-left edge.
+    /// </summary>
+    public Vector2 GlobalPosition { get; }
+    /// <summary>
+    /// The size of this element.
+    /// </summary>
+    public Rect Size { get; set; }
+}
+
+public interface IParentableElement
+{
+    /// <summary>
+    /// This parentable element's children.
+    /// </summary>
+    public IReadOnlyList<UIElement> Children { get; }
+    /// <summary>
+    /// Add a child element to this element.
+    /// </summary>
+    /// <param name="child">Child <see cref="UIElement"/>.</param>
+    public void AddChild(UIElement child);
+    /// <summary>
+    /// Remove a child element from this element.
+    /// </summary>
+    /// <param name="child">Child <see cref="UIElement"/> to remove.</param>
+    public void RemoveChild(UIElement child);
+}
+
+public interface IResizeableElement
+{
+    /// <summary>
+    /// Get a minimum rectangle size for this element.
+    /// </summary>
+    public abstract Rect MinimumSize { get; }
+}
+
+public interface IUpdatableElement
+{
+    /// <summary>
+    /// Specifies if this element's properties have changed, making it necessary to update it.
+    /// </summary>
+    public bool Dirty { get; }
+    /// <summary>
+    /// Update this element.
+    /// </summary>
+    void Update();
+    /// <summary>
+    /// Marks this element as changed, requiring an update.
+    /// </summary>
+    void MarkDirty();
+}
+
+public interface IRenderableElement
+{
+    /// <summary>
+    /// Specifies if this element should be drawn.
+    /// </summary>
+    public bool Visible { get; set; }
+    /// <summary>
+    /// Render this element.
+    /// </summary>
+    /// <param name="renderer">Renderer to call draw operations on.</param>
+    /// <param name="style">A style to use to draw this element.</param>
+    public void Render(RenderSystem renderer, Style style);
+    /// <summary>
+    /// Draws this element's size bounds.
+    /// </summary>
+    /// <param name="renderer">Renderer to use.</param>
+    public void DrawSize(RenderSystem renderer);
+}
+
+public interface IInputElement
+{
+    /// <summary>
+    /// Specifies if this element should ignore inputs.
+    /// </summary>
+    public bool IgnoreInput { get; set; }
+    /// <summary>
+    /// Send an input action to this element.
+    /// </summary>
+    /// <param name="action">Input action to send.</param>
+    void Input(UIInputContext action);
+}
+
+public interface IAnchorableElement
+{
+    public Anchor Anchor { get; set; }
+    public Vector2 AnchorOffset { get; set; }
+    public void ApplyAnchor(Vector2 parentPosition, Rect parentRect);
+}

Voile/Source/UI/Rect.cs

@@ -0,0 +1,23 @@
+namespace Voile.UI;
+
+/// <summary>
+/// Represents a rectangle. Used to determine widget confines for UI layout.
+/// </summary>
+public record Rect(float Width = 0.0f, float Height = 0.0f)
+{
+    public float Width { get; set; } = Width;
+    public float Height { get; set; } = Height;
+    public static Rect Zero => new Rect(0.0f, 0.0f);
+    public float Area => Width * Height;
+
+    public int CompareTo(Rect? other)
+    {
+        if (other is null) return 1;
+        return Area.CompareTo(other.Area);
+    }
+
+    public static bool operator >(Rect left, Rect right) => left.CompareTo(right) > 0;
+    public static bool operator <(Rect left, Rect right) => left.CompareTo(right) < 0;
+    public static bool operator >=(Rect left, Rect right) => left.CompareTo(right) >= 0;
+    public static bool operator <=(Rect left, Rect right) => left.CompareTo(right) <= 0;
+}

Voile/Source/UI/Style.cs

@@ -0,0 +1,13 @@
+using Voile.Resources;
+
+namespace Voile.UI;
+
+/// <summary>
+/// A resource containing UI style settings.
+/// </summary>
+public class Style : TextDataResource
+{
+    public Style(string path) : base(path)
+    {
+    }
+}

Voile/Source/UI/UIElement.cs

@@ -0,0 +1,95 @@
+using System.Numerics;
+using Voile.Rendering;
+
+namespace Voile.UI;
+
+public abstract class UIElement : IElement, IRenderableElement, IResizeableElement, IUpdatableElement, IAnchorableElement
+{
+    public bool Visible { get; set; } = true;
+    public bool IgnoreInput { get; set; } = false;
+    public Vector2 LocalPosition { get; set; } = Vector2.Zero;
+    public Vector2 GlobalPosition => _parent?.GlobalPosition + LocalPosition ?? LocalPosition;
+
+    public Rect Size
+    {
+        get => _size;
+        set
+        {
+            _size = value;
+
+            if (value.Width < MinimumSize.Width)
+            {
+                _size.Width = MinimumSize.Width;
+            }
+
+            if (value.Height < MinimumSize.Height)
+            {
+                _size.Height = MinimumSize.Height;
+            }
+
+            MarkDirty();
+        }
+    }
+    public Vector2 AnchorOffset { get; set; } = Vector2.Zero;
+    public Anchor Anchor { get; set; } = Anchor.TopLeft;
+
+    public abstract Rect MinimumSize { get; }
+    public bool Dirty => _dirty;
+
+    public virtual void MarkDirty() => _dirty = true;
+
+    public void SetParent(UIElement parent)
+    {
+        _parent = parent;
+    }
+
+    public void Update()
+    {
+        if (!_dirty) return;
+        _dirty = false;
+
+        if (Size == Rect.Zero)
+            Size = MinimumSize;
+
+        OnUpdate();
+
+        if (_parent is not null && _parent.Size != Rect.Zero)
+        {
+            ApplyAnchor(_parent.GlobalPosition, _parent.Size);
+        }
+    }
+
+    public abstract void Render(RenderSystem renderer, Style style);
+    protected abstract void OnUpdate();
+
+    public void DrawSize(RenderSystem renderer)
+    {
+        renderer.SetTransform(GlobalPosition, Vector2.Zero);
+        renderer.DrawRectangleOutline(new Vector2(Size.Width, Size.Height), Color.Red, 2.0f);
+    }
+
+    /// <summary>
+    /// Determines if this <see cref="UIElement"/> contains a point within its confines.
+    /// </summary>
+    /// <param name="pointPosition">A global position of the point.</param>
+    /// <returns>True if the point is inside the widget; otherwise, false.</returns>
+    public bool ContainsPoint(Vector2 point)
+    {
+        return point.X >= GlobalPosition.X && point.Y >= GlobalPosition.Y &&
+               point.X <= GlobalPosition.X + Size.Width &&
+               point.Y <= GlobalPosition.Y + Size.Height;
+    }
+
+    /// <summary>
+    /// Applies this <see cref="UIElement"/> anchor.
+    /// </summary>
+    public virtual void ApplyAnchor(Vector2 parentPosition, Rect parentRect)
+    {
+        LocalPosition = Anchor.Calculate(parentPosition, parentRect, Size) + new Vector2(AnchorOffset.X, AnchorOffset.Y);
+    }
+
+    private bool _dirty = true;
+    private Rect _size = Rect.Zero;
+
+    private UIElement? _parent;
+}

Voile/Source/UI/UIInputContext.cs

@@ -0,0 +1,35 @@
+using System.Numerics;
+using Voile.Input;
+
+namespace Voile.UI;
+
+public class UIInputContext
+{
+    public IInputAction Action { get; }
+    public Vector2 MousePosition { get; }
+    public bool MousePressed { get; set; }
+    public bool MouseReleased { get; set; }
+    public bool MouseDown { get; set; }
+
+    public string ActionName { get; }
+
+    public int CharPressed { get; }
+    public bool HasCharInput => CharPressed != 0;
+
+    public bool Handled => _handled;
+
+    /// <summary>
+    /// Marks this context as handled, meaning next elements that will receive it should discard it.
+    /// </summary>
+    public void SetHandled() => _handled = true;
+
+    public UIInputContext(IInputAction action, Vector2 mousePosition, string actionName, int charPressed = 0)
+    {
+        Action = action;
+        MousePosition = mousePosition;
+        ActionName = actionName;
+        CharPressed = charPressed;
+    }
+
+    private bool _handled;
+}

Voile/Source/UI/UISystem.cs

@@ -0,0 +1,147 @@
+using System.Numerics;
+using Voile.Input;
+using Voile.Rendering;
+
+namespace Voile.UI;
+
+public class UISystem : IUpdatableSystem, IRenderableSystem
+{
+    public IReadOnlyList<IElement> Elements => _elements;
+
+    public bool RenderDebugRects { get; set; }
+
+    public UISystem(InputSystem inputSystem)
+    {
+        _style = ResourceRef<Style>.Empty();
+        _input = inputSystem;
+    }
+
+    public UISystem(InputSystem inputSystem, ResourceRef<Style> style)
+    {
+        _input = inputSystem;
+        _style = style;
+    }
+
+    public UISystem(InputSystem inputSystem, ResourceRef<Style> style, List<UIElement> elements)
+    {
+        _input = inputSystem;
+        _style = style;
+        _elements = elements;
+    }
+
+    public void AddElement(UIElement element) => _elements.Add(element);
+    public void RemoveElement(UIElement element) => _elements.Remove(element);
+
+    public void Update(double deltaTime)
+    {
+        HandleInput();
+    }
+
+    public void Render(RenderSystem renderer)
+    {
+        // Update elements each time UI system is rendered.
+        foreach (var element in _elements)
+        {
+            if (element is not IUpdatableElement updatable) continue;
+            updatable.Update();
+        }
+
+        foreach (var element in _elements)
+        {
+            if (element is IRenderableElement renderable)
+            {
+                renderable.Render(renderer, _style.Value);
+
+                if (!RenderDebugRects) return;
+                renderable.DrawSize(renderer);
+            }
+
+            if (element is IParentableElement parentable)
+            {
+                foreach (var child in parentable.Children)
+                {
+                    if (child is not IRenderableElement renderableChild) continue;
+
+                    if (!RenderDebugRects) return;
+                    renderableChild.DrawSize(renderer);
+                }
+            }
+        }
+    }
+
+    private void HandleInput()
+    {
+        int charPressed = _input.GetCharPressed();
+        Vector2 mousePos = _input.GetMousePosition();
+
+        Vector2 currentMousePosition = _input.GetMousePosition();
+
+        foreach (var (actionName, mappings) in InputSystem.InputMappings)
+        {
+            foreach (var action in mappings)
+            {
+                if (action.IsPressed(_input))
+                {
+                    // TODO: specify which mouse button is used in the context.
+                    var context = new UIInputContext(action, mousePos, actionName, charPressed)
+                    {
+                        MouseDown = _input.IsMouseButtonDown(MouseButton.Left),
+                        MouseReleased = _input.IsMouseButtonReleased(MouseButton.Left),
+                        MousePressed = _input.IsMouseButtonReleased(MouseButton.Left),
+                    };
+
+                    if (PropagateInput(_elements, context))
+                        return;
+                }
+            }
+        }
+
+        if (charPressed != 0)
+        {
+            var context = new UIInputContext(new KeyInputAction(KeyboardKey.Null), mousePos, "", charPressed);
+            PropagateInput(_elements, context);
+        }
+
+
+        if (currentMousePosition != _lastMousePosition)
+        {
+            // TODO: specify which mouse button is used in the context.
+            var context = new UIInputContext(new MouseInputAction(MouseButton.Left), mousePos, "", charPressed)
+            {
+                MouseDown = _input.IsMouseButtonDown(MouseButton.Left),
+                MouseReleased = _input.IsMouseButtonReleased(MouseButton.Left),
+                MousePressed = _input.IsMouseButtonReleased(MouseButton.Left),
+            };
+            PropagateInput(_elements, context);
+        }
+    }
+
+    private bool PropagateInput(List<UIElement> elements, UIInputContext context)
+    {
+        for (int i = elements.Count - 1; i >= 0; i--)
+        {
+            var element = elements[i];
+
+            if (element is IInputElement inputElement && !inputElement.IgnoreInput)
+            {
+                inputElement.Input(context);
+                _input.SetAsHandled();
+                // return true;
+            }
+
+            if (element is IParentableElement parent)
+            {
+                if (PropagateInput(parent.Children.ToList(), context))
+                    return true;
+            }
+        }
+
+        return false;
+    }
+
+    private ResourceRef<Style> _style;
+    private List<UIElement> _elements = new();
+    private InputSystem _input;
+
+    private Vector2 _lastMousePosition = Vector2.Zero;
+}

Voile/Source/UI/Widgets/Button.cs

@@ -0,0 +1,47 @@
+using System.Numerics;
+using Voile.Input;
+using Voile.Rendering;
+
+namespace Voile.UI.Widgets;
+
+public enum ButtonState
+{
+    Disabled,
+    Hovered,
+    Pressed,
+    Normal
+}
+
+/// <summary>
+/// A clickable button with a label.
+/// </summary>
+public class Button : Widget
+{
+    public string Label { get; set; } = "Button";
+    public override Rect MinimumSize => new Rect(Width: 128.0f, Height: 64.0f);
+
+    public Button(string label, Action pressedAction)
+    {
+        Label = label;
+        _pressedAction = pressedAction;
+    }
+
+    public override void Render(RenderSystem renderer, Style style)
+    {
+        // TODO: use a button color from style.
+        renderer.SetTransform(GlobalPosition, Vector2.Zero);
+        renderer.DrawRectangle(new Vector2(MinimumSize.Width, MinimumSize.Height), new Color(0.25f, 0.25f, 0.25f));
+    }
+
+    protected override void OnInput(UIInputContext action)
+    {
+
+    }
+
+    protected override void OnUpdate()
+    {
+        throw new NotImplementedException();
+    }
+
+    private Action _pressedAction;
+}

Voile/Source/UI/Widgets/Label.cs

@@ -0,0 +1,43 @@
+using System.Numerics;
+using Voile.Input;
+using Voile.Rendering;
+
+namespace Voile.UI.Widgets;
+
+public class Label : Widget
+{
+    public override Rect MinimumSize => throw new NotImplementedException();
+
+    public string Text { get; set; } = "Hello World!";
+
+    public Label(string text)
+    {
+        Text = text;
+    }
+
+    public Label(string text, ResourceRef<Font> fontOverride)
+    {
+        Text = text;
+        _fontOverride = fontOverride;
+    }
+
+    protected override void OnInput(UIInputContext action)
+    {
+        throw new NotImplementedException();
+    }
+
+    public override void Render(RenderSystem renderer, Style style)
+    {
+        // TODO: use style here.
+        if (!_fontOverride.HasValue) return;
+        renderer.SetTransform(GlobalPosition, Vector2.Zero);
+        renderer.DrawText(_fontOverride, Text, Color.White);
+    }
+
+    protected override void OnUpdate()
+    {
+        throw new NotImplementedException();
+    }
+
+    private ResourceRef<Font> _fontOverride = ResourceRef<Font>.Empty();
+}

Voile/Source/UI/Widgets/RectangleWidget.cs

@@ -0,0 +1,78 @@
+using System.Numerics;
+using Voile.Input;
+using Voile.Rendering;
+
+namespace Voile.UI.Widgets;
+
+public class RectangleWidget : Widget
+{
+    public override Rect MinimumSize { get; }
+    public Color Color { get; set; } = Color.White;
+    public RectangleWidget(Rect minimumRect, Color color) : base()
+    {
+        MinimumSize = minimumRect;
+        Color = color;
+
+        _defaultColor = color;
+
+        _defaultSize = Size;
+
+        _hoverColor = color.Lightened(0.25f);
+    }
+
+    public override void Render(RenderSystem renderer, Style style)
+    {
+        renderer.SetTransform(GlobalPosition, Vector2.Zero);
+        renderer.DrawRectangle(new Vector2(Size.Width, Size.Height), Color);
+    }
+
+    protected override void OnInput(UIInputContext inputContext)
+    {
+        if (_defaultSize == Rect.Zero)
+        {
+            _defaultSize = Size;
+        }
+
+        if (_downSize == Rect.Zero)
+        {
+            _downSize = new Rect(Size.Width * 0.75f, Size.Height * 0.75f);
+        }
+
+        var mouseInside = ContainsPoint(inputContext.MousePosition);
+
+        if (mouseInside)
+        {
+            Color = _hoverColor;
+        }
+        else
+        {
+            Color = _defaultColor;
+        }
+
+        // if (mouseInside && inputContext.MouseDown)
+        // {
+        //     Size = _downSize;
+        // }
+
+        // if (mouseInside && inputContext.MouseReleased)
+        // {
+        //     Size = _defaultSize;
+        // }
+
+        if (mouseInside && inputContext.MousePressed)
+        {
+            Console.WriteLine("Hello, I was clicked!");
+        }
+    }
+
+    protected override void OnUpdate()
+    {
+
+    }
+
+    private Color _defaultColor;
+    private Color _hoverColor;
+
+    private Rect _defaultSize = Rect.Zero;
+    private Rect _downSize = Rect.Zero;
+}

Voile/Source/UI/Widgets/Widget.cs

@@ -0,0 +1,43 @@
+using System.Numerics;
+using Voile.Input;
+using Voile.Rendering;
+
+namespace Voile.UI.Widgets;
+
+/// <summary>
+/// A base class for all UI widgets.
+/// </summary>
+public abstract class Widget : UIElement, IInputElement
+{
+    public Widget()
+    {
+        MarkDirty();
+    }
+
+    public Widget(Rect size)
+    {
+        Size = size;
+        MarkDirty();
+    }
+
+    public Widget(Vector2 position)
+    {
+        LocalPosition = position;
+        MarkDirty();
+    }
+
+    public void Input(UIInputContext context)
+    {
+        if (context.Handled || IgnoreInput) return;
+        if (ContainsPoint(context.MousePosition))
+        {
+            OnInput(context);
+        }
+    }
+
+    /// <summary>
+    /// Called when this widget receives input.
+    /// </summary>
+    /// <param name="action">An input action this widget received.</param>
+    protected abstract void OnInput(UIInputContext context);
+}

Voile/Source/Utils/MathUtils.cs

@@ -35,6 +35,15 @@ namespace Voile
             return new Vector2((float)x, (float)y);
         }
 
+        public static Color RandomColor()
+        {
+            var r = _random.NextDouble(0.0f, 1.0f);
+            var g = _random.NextDouble(0.0f, 1.0f);
+            var b = _random.NextDouble(0.0f, 1.0f);
+
+            return new Color((float)r, (float)g, (float)b);
+        }
+
         public static float EaseOutBack(float x)
         {
             var c1 = 1.70158f;

Voile/Voile.csproj

@@ -2,7 +2,7 @@
 
     <PropertyGroup>
         <OutputType>Library</OutputType>
-        <TargetFramework>net8.0</TargetFramework>
+        <TargetFramework>net9.0</TargetFramework>
         <ImplicitUsings>enable</ImplicitUsings>
         <Nullable>enable</Nullable>
         <AllowUnsafeBlocks>true</AllowUnsafeBlocks>
@@ -15,7 +15,7 @@
         <PackageReference Include="SoLoud.NET" Version="2020.2.7.1" />
         <PackageReference Include="Tommy" Version="3.1.2" />
         <PackageReference Include="ImGui.NET" Version="1.89.4" />
-        <PackageReference Include="Raylib-cs" Version="6.1.1" />
+        <PackageReference Include="Raylib-cs" Version="7.0.1" />
         <PackageReference Include="SharpFont" Version="4.0.1" />
         <PackageReference Include="SixLabors.Fonts" Version="1.0.0-beta19" />
         <PackageReference Include="StbImageSharp" Version="2.27.13" />