Ruminate Example

Installation

Open the nuget package console (under tools) and run the command

Install-Package MonoGame.Framework.Gui -Version 1.0.1

Now you need to download the following zip file which contains the content folder for Ruminate, you need to extract this into the content folder of your project:

https://drive.google.com/file/d/0Bw-0YEA_JX9gcFEyY1F2aXVJbGs/view?usp=sharing

Setup

Click on project and create a new class, call it Screen.cs. Copy the following code:

using Microsoft.Xna.Framework;

namespace YourNameSpace {

    public abstract class Screen {

        public Color Color { get; set; }

        public abstract void Init(Game1 game);
        public abstract void OnResize();
        public abstract void Update(GameTime time);
        public abstract void Draw();
    }
}

Remember to use the original namespace from when you created the class.

Create a new screen

Create a new class from the project menu and name the class screen1. You need to add the following to the using section of the new class;

using Microsoft.Xna.Framework;
using Microsoft.Xna.Framework.Graphics;
using Ruminate.GUI.Content;
using Ruminate.GUI.Framework;

Edit the class declaration to make it a class of Screen:

class screen1: Screen{

}

Within the new class add the following variable:

 Gui gui;

Now copy the following methods into the class:

 public override void OnResize() {            
     gui.Resize();              
 }

 public override void Update() {
     gui.Update();
 }

 public override void Draw() {
     gui.Draw();
 }

the final method required is an Init method, create the following method:

 public override void Init(Game1 game) {

      Color = Color.White;

      var skin = new Skin(game.GreyImageMap, game.GreyMap);
      var text = new Text(game.GreySpriteFont, Color.Black);

      gui = new Gui(game, skin, text);
      gui.AddWidget(
          new Panel(10,10,300,300)
          {
              Children = new Widget[] {                                           
              new Button(10,10,"test"), 
              new SingleLineTextBox(10, 50, 120, 10) { Value = "Hello World"}
          }
      });
 }

This will create a panel of 300x300 at an XY of 10,10. This panel will contain a button and a single line text box. This is an example of how you could create an interface, more interface components are detailed below.

Displaying a screen

Add the following variables into your Game1.cs:

Screen currentScreen;

public SpriteFont GreySpriteFont;
public Texture2D GreyImageMap;
public string GreyMap;

In the LoadContent method of Game1.cs add the following to load the textures and imagemap:

GreyImageMap = Content.Load<Texture2D>(@"GreySkin\ImageMap");
GreyMap = File.OpenText(@"Content\GreySkin\Map.txt").ReadToEnd();
GreySpriteFont = Content.Load<SpriteFont>(@"GreySkin\Texture");

currentScreen = new Screen1();
currentScreen.Init(this);

In the update method of Game1.cs, enter the following code:

currentScreen.Update(gameTime);

in the draw method of Game1.cs, enter the following code:

currentScreen.Draw();

How can you use this

You could create a new class within your project for each screen you need to use. You could create an array of all the screens in your game:

Screen[] currentScreens = new Screen[] {                
                new MainMenu(),
                new InputTest(),          
                new LayoutTest(),
                new ButtonTest()
            };

You can create an instance of each screen in the elements of the array. So when you want to switch screens you can simply pass currentScreen a new value from the array and run the currentScreen.Init() again:

currentScreen = _currentScreens[index];
currentScreen.Init(this);

Other controls

new ToggleButton(0, 10, "Button")

new CheckBox(300, 10, "Check Box")

new RadioButton(300, 40, "GRP", "Group GRP")
new RadioButton(300, 70, "GRP", "Group GRP")]
new RadioButton(300, 100, "GRP", "Group GRP")

new ComboBox(300, 250, 131, "Holder Text", CardinalDirection.South, new List<ComboBox.DropDownItem> {
      new ComboBox.DropDownItem("Test 1"),
      new ComboBox.DropDownItem("Test 2"),
      new ComboBox.DropDownItem("Test 3"),
      new ComboBox.DropDownItem("Test 4"),
      new ComboBox.DropDownItem("Test 5")
                    }),

Using events

_singleLineTextBox = new SingleLineTextBox(300, 180, 100, 10),
   new Button(410, 177, 100, "Change", delegate {
          var result = 0.0f;
          if (float.TryParse(_singleLineTextBox.Value, out result)) {
               _slider.Value = result;
          }
    }),

new ComboBox(300, 210, "Pick a Color", 2, CardinalDirection.North, new List<ComboBox.DropDownItem> { 
         new ComboBox.DropDownItem("Violet", null, delegate { Color = Color.Violet; }),
         new ComboBox.DropDownItem("Tomato", null, delegate { Color = Color.Tomato; }),
         new ComboBox.DropDownItem("YellowGreen", null, delegate { Color = Color.YellowGreen; }),
         new ComboBox.DropDownItem("LightSkyBlue", null, delegate { Color = Color.LightSkyBlue; })
         }),