MonoGame – User Interface

For MonoGame or XNA games an user interface is most essential. Based on the lacking and obsolete libraries like NeonForceControlsSquid, etc.. I made the effort to create my own one.

Functionality

  • The user interface is listening on
    • Keyboard inputs
    • Mouse inputs
    • Touchscreen inputs
  • Compatible with MonoGame and XNA 4.0
  • Optimized for desktop and mobile applicationsMobile
  • Running in 1 Thread
  • Working with events for
    • Mouse/Finger Hover
    • Mouse/Finger Click
    • Mouse/Finger Move
    • GotFocus
    • LostFocus
  • Controls can be Focusable and/or Movable

Helper

The UserInterfaceManager instance is able to Add and Remove controls. You won’t have to worry about dependencies. The order can be changed within each control by the UserInterfaceManager by calling BringToFront or BringToBack.

Textures

The Textures are all self-made and included in the library. Replace the textures in the Content folder to apply them.

Controls

ControlScreenshotFeatures
Control 
  • OnClick
  • GotFocus
  • LostFocus
  • Mouse/Touch Hover
  • Mouse/Touch Left
  • IsVisible
  • IsEnabled
  • Color
  • Parent
  • SubControls
ButtonButton
  • Label
CheckBoxCheckBox
  • Label
  • IsChecked
  • StateChanged
TextBoxTextBox
  • Label
  • Blink_Pause
  • Blink_Active
  • TextChanged
  • Single Line
  • Multi Line
  • Max input length
  • Password char
ComboBoxComboBox
  • Label
  • Orientation
TabNavigationTabNavigation 
ScrollViewCompilation
  • Padding
  • Background Color
  • Autoscroll to end
Window FramesWindow
  • Titelbar
  • Label
  • Show Close-Button
CloseButton CloseButton
  • Button
Label 
  • Text
  • MaxCharacters
  • FontSize
  • DisplayMode
  •  MultiLine
  •  ScrollToEnd
  • Default
ImageBox 
  • Displays a texture

Code behind

Append following lines of code in your Game1.cs

protected override void Initialize() {
	Components.Add(new UserInterfaceManager(this));
	Components.Add(new InputManager(this));
	base.Initialize();
}

And you are ready to go!

Example

Window

loginWindw = UserInterfaceFactory.CreateWindow(new Rectangle(0, 0, 400, 400));
loginWindw.Title = "Jiyuu Logincenter";

Buttons

bLogin = UserInterfaceFactory.CreateButton(new Rectangle(5, 60, 95, 25));
bRegister = UserInterfaceFactory.CreateButton(new Rectangle(bLogin.Rectangle.Right + 5, 60, 95, 25));

TextBoxes

TextBox tUsername = UserInterfaceFactory.CreateTextBox(new Rectangle(5, 20, 200, 15));
TextBox tPassword = UserInterfaceFactory.CreateTextBox(new Rectangle(5, 40, 200, 15));

Add the dependencies

loginWindw.Add(tUsername);
loginWindw.Add(tPassword);
loginWindw.Add(bLogin);
loginWindw.Add(bRegister);
UserInterfaceManager.Singleton.Add(loginWindw);

Result

Window

Downloads

nuget

4
Hinterlasse einen Kommentar

Please Login to comment
  Subscribe  
newest oldest most voted
Notify of
Omegnight
Member
Omegnight

Hello,

I just found your this UI library for Monogame and its simplicity is really, really great.

I have two questions though.

1- Is it possible to change the font?

2- Is this open-source?

Thanks.

Rene Sens
Guest
Rene Sens

This all seems very good but I have a few questions (hopefully, not too dumb):

1. ‘loginWindw’ in your example could be just a ‘var’? or it should belong to some special class? because…

2. …it seems like you have some TextBox class below? how it was implemented in your example?

3. There’s no ‘Add’ method for ‘Singleton’ in my case. Is this because I did something wrong during installation and initialization of MonoGame UI?