A GUI framework for C# console applications
ConsoleGUI
ConsoleGUI is a simple .NET framework for creating console-based GUI applications.
It provides most essential layout management utilities as well as a set of basic controls.
The example above is not really a playable chess game. The board on the left is simply just a grid with some text in it - it's here for display purposes only. But of course, with a little bit of code behind, it could be made interactive.
Motivation
What sets this library apart from other projects that provide similar functionalities, is the fact that the ConsoleGUI framework is fully layout-driven. In this regard it’s more like WPF or HTML, than for example Windows Forms. You don’t specify exact coordinates at which a given control should reside, but rather let stack panels, dock panels and other layout managers do their work. I don’t claim it’s THE right way of doing things, it’s just what my background is.
More details about this project (as well as a glimpse at the working example) can be found in this video: https://youtu.be/YIrmjENTaaU
Setup
First install the NuGet package:
dotnet add package ConsoleGUI
then include required namespaces in your code:
using ConsoleGUI; using ConsoleGUI.Controls; using ConsoleGUI.Space;
and finally setup the ConsoleManager
:
// optional: adjusts the buffer size and sets the output encoding to the UTF8 ConsoleManager.Setup(); // optional: resizes the console window (the size is set in a number of characters, not pixels) ConsoleManager.Resize(new Size(150, 40)); // required for terminals that don't support true color formatting (e.g. powershell.exe) ConsoleManager.CompatibilityMode = true; // sets the main layout element and prints it on the screen ConsoleManager.Content = new TextBlock { Text = "Hello world" };
And that's it. As you can see most of those steps are optional, depending on how you want to configure your window.
After that, whenever you make a change to any of the controls within the UI tree, the updates will be propagated and displayed automatically. No manual Redraw()
calls are required.
Compatibility mode
The above example uses the compatibility mode. It's required if your terminal of choice doesn't support true color formatting. If set, the ConsoleGUI will translate all of the RGB colors into 4bit values of the ConsoleColor enum. This will, of course, degrade the user experience.
Terminals that DO NOT support the true color formatting are (for example): powershell.exe and cmd.exe.
Terminals that DO support the true color formatting are (for example): the new Windows Terminal and the terminal that is built in into the VS.
Responsiveness
If the window size is not set explicitly, the layout will be adjusted to the current size of that window. It's important to note that this framework doesn't detect terminal size changes automatically. If the user resizes the window manually, the layout will become broken.
To readjust the layout to the manually updated window size, call the ConsoleManager.Setup()
method. Just remember that it might take more time to repaint the entire screen then to draw a single update (as the entire buffer must be invalidated), so do it only if the size of the window has actually changed.
Basic controls
This is a list of all available controls:
Background
Sets the background color of the Content
control. If the Important
property is set, the background color will be updated even if the stored control already sets its own background color.
Border
Draws a border around the Content
control. The BorderPlacement
and the BorderStyle
can be adjusted to change the look of the generated outline.
Boundary
Allows the user to modify the MinWidth
, MinHeight
, MaxWidth
and MaxHeight
of the Content
control in relation to its parent control.
Especially useful to limit the space taken by controls that would otherwise stretch to fill all of the available space (like when storing a HorizontalStackPanel
within a horizontal DockPanel
)
Box
Aligns the Content
control vertically (Top
/Center
/Bottom
/Stretch
) and horizontally (Left
/Center
/Right
/Stretch
).
Canvas
Can host multiple child controls, each displayed within a specified rectangle. Allows content overlapping.
DataGrid
Displays Data
in a grid based on provided column definitions.
The ColumnDefinition
defines the column Header
, its Width
and the data Selector
. The Selector
can be used to extract a text from a data row, specify that cell's color, or even define a custom content generator.
DockPanel
DockPanel
consists of two parts: DockedControl
and FillingControl
. The DockedControl
is placed within the available space according to the Placement
property value (Top
/Right
/Bottom
/Left
). The FillingControl
takes up all of the remaining space.
Grid
Splits the available space into smaller pieces according to the provided Columns
and Rows
definitions. Each cell can store up to one child control.
HorizontalSeparator
Draws a horizontal line.
HorizontalStackPanel
Stacks multiple controls horizontally.
Margin
Adds the Offset
around the Content
control when displaying it. It affects both the MinSize
and the MaxSize
of the IDrawingContext
.
Overlay
Allows two controls to be displayed on top of each other. Unlike the Canvas
, it uses its own size when specifying size limits for child controls.
Style
Modifies the Background
and the Foreground
colors of its Content
.
TextBlock
Displays a single line of text.
TextBox
An input control. Allows the user to insert a single line of text.
VerticalScrollPanel
Allows its Content
to expand infinitely in the vertical dimension and displays only the part of it that is currently in view. The ScrollBarForeground
and the ScrollBarBackground
can be modified to adjust the look of the scroll bar.
VerticalSeparator
Draws a vertical line.
VerticalStackPanel
Stacks multiple controls vertically.
WrapPanel
Breaks a single line of text into multiple lines based on the available vertical space. It can be used with any type of a control (TextBox
, TextBlock
but also HorizontalStackPanel
and any other).
Creating custom controls
The set of predefined control is relatively small, but it's very easy to create custom ones. There are two main ways to do it.
Inheriting the SimpleControl
class
If you want to define a control that is simply composed of other controls (like a text box with a specific background and border), inheriting from the SimpleControl
class is the way to go.
All you have to do is to set the protected
Content
property with a content that you want to display.
internal sealed class MyControl : SimpleControl { private readonly TextBlock _textBlock; public MyControl() { _textBlock = new TextBlock(); Content = new Background { Color = new Color(200, 200, 100), Content = new Border { Content = _textBlock } }; } public string Text { get => _textBlock.Text; set => _textBlock.Text = value; } }
Implementing the IControl
interface or inheriting the Control
class
This approach can be used to define fully custom controls. All of the basic within this library are implemented this way.
The IControl
interface requires providing 3 members:
public interface IControl { Character this[Position position] { get; } Size Size { get; } IDrawingContext Context { get; set; } }
The []
operator must return a character that is to be displayed on the specific position. The position is defined relative to this control's space and not to the screen.
The control can also notify its parent about its internal changes using the provided Context
. The IDrawingContext
interface is defined as follows:
public interface IDrawingContext { Size MinSize { get; } Size MaxSize { get; } void Redraw(IControl control); void Update(IControl control, in Rect rect); event SizeLimitsChangedHandler SizeLimitsChanged; }
If only a part of the control has changed, it should call the Update
method, providing a reference to itself and the rect (once again - in its local space) that has to be redrawn. If the Size
of the control has changed or the entire control requires redrawing, the control should call the Redraw
method of its current Context
.
The Context
is also used to notify the child control about changes in size limits imposed on it by its parent. The child control should listen to the SizeLimitsChanged
event and update its layout according to the MinSize
and MaxSize
values of the current Context
.
When defining a custom control that can host other controls, you might have to implement a custom IDrawingContext
class.
Instead of implementing the IControl
and IDrawingContext
directly, you can also use the Control
and DrawingContext
base classes. They allow for a similar level of flexibility, at the same time providing more advanced functionalities.
The DrawingContext
is an IDisposable
non-abstract class that translates the parent's space into the child's space based on the provided size limits and offset. It also ensures that propagated notifications actually come from the hosted control and not from controls that were previously assigned to a given parent.
The Control
class not only trims all of the incoming and outgoing messages to the current size limits but also allows to temporarily freeze the control so that only a single update message is generated after multiple related changes are performed.
For more information on how to define custom controls using the IControl
/IDrawingContext
interfaces or the Control
/DrawingContext
classes, please see the source code of one of the controls defined within this library.
Input
As the standard Console
class doesn't provide any event-based interface for detecting incoming characters, the availability of input messages has to be checked periodically within the main loop of your application. Of course, it's not required if your layout doesn't contain any interactive components.
To handle pending input messages, call the ReadInput
method of the ConsoleManager
class. It accepts a single argument being a collection of IInputListener
objects. You can define this collection just once and reuse it - it specifies the list of input elements that are currently active and should be listening to keystrokes. The order of those elements is important, because if one control will set the Handled
property of the provided InputEvent
, the propagation will be terminated.
var input = new IInputListener[] { scrollPanel, tabPanel, textBox }; for (int i = 0; ; i++) { Thread.Sleep(10); ConsoleManager.ReadInput(input); }
The IInputListener
interface is not only restricted for classes that implement the IControl
interface and can be used to define any custom (user defined) controllers that manage application's behavior.
Forms
As you might have noticed, there is no general purpose Form
control available in this framework. That’s because it’s very hard to come up with a design that would fit all needs. Of course such obstacle is not a good reason on its own, but at the same time it’s extremely easy to implement a tailor made form controller within the target application itself. Here is an example:
class FromController : IInputListener { IInputListener _currentInput; // ... public void OnInput(InputEvent inputEvent) { if (inputEvent.Key.Key == ConsoleKey.Tab) { _currentInput = // nextInput... inputEvent.Handled = true; } else { _currentInput.OnInput(inputEvent) } } }
After implementing it, all you have to do is to initialize an instance of this class with a list of you inputs and call the ConsoleManager.ReadInput(fromControllers)
each frame.
The biggest strength of this approach is that you decide what’s the order of controls within the form, you can do special validation after leaving each input, create a custom layout of the form itself, highlight currently active input, and much, much more. I believe it’s a good tradeoff.
Mouse
Currently this library does not mouse input.
Performance
This library is designed with high performance applications in mind. It means that if a control requests an Update
, only the specified screen rectangle will be recalculated, and only if all of its parent controls agree that this part of the content is actually visible.
As the most expensive operation of the whole process is printing characters on the screen, the ConsoleManager
defines its own, additional buffer. If the requested pixel (character) didn't change, it's not repainted.
Contributions
I'm open to all sorts of contributions and feedback.
from Hacker News https://github.com/TomaszRewak/C-sharp-console-gui-framework