This project is read-only.

Neat Screens can contain GUI elements such as Buttons, Labels, Images and Checkboxes thanks to Neat’s GUI engine. These controls can be easily created and added from the code, or at run-time via Neat Script. In this tutorial, we are going to create a basic form using Neat GUI.

Let’s start with NeatStarter project. Create an empty Screen like we did in the previous tutorial:

public class SampleGUIScreen : Screen
    {
        public SampleGUIScreen(NeatGame Game)
            : base(Game)
        {
        }

        public override void Initialize()
        {
            base.Initialize();
        }

        public override void Activate()
        {
            base.Activate();
        }

        public override void Behave(GameTime gameTime)
        {
            base.Behave(gameTime);
        }

        public override void HandleInput(GameTime gameTime)
        {
            base.HandleInput(gameTime);
        }

        public override void Render(GameTime gameTime)
        {
            base.Render(gameTime);
        }
    }

Now hook it into the engine by adding this line into your AddScreens() method:

Screens["samplegui"] = new SampleGUIScreen(this);

 

Alright, now we are ready to begin. To work with Neat GUI, you should use the Form object which is inside your screen. Let’s add a label that says Hello, World! to our screen: Add these lines to your screen’s Initialize() function:

Label hello = Form.NewControl(“hello”, new Label()) as Label;
hello.Caption = "Hello, World!";
hello.Position = new Vector2(100, 100);
hello.ForeColor = Color.White;

 

(By the way, don’t forget to add the using Neat.GUI; line to the top of your code.)

Now if we run the project and activate the samplegui screen (by typing e_show samplegui in the console), we can see our Hello, World! label:

neat_tut_4_hello

Let’s add a button that changes the caption of our label if we click it. To do that, we have to insert these lines in our Initialize code:

Button mybutton = Form.NewControl(“mybutton”, new Button()) as Button;
mybutton.Caption = "Push Me!";
mybutton.Position = new Vector2(100, 200);
mybutton.ForeColor = Color.White;
mybutton.HoverTintColor = Color.Green;
mybutton.Size = new Vector2(400, 70);
mybutton.OnPress = new mybutton_OnPress;


Form.HasMouse = true;
game.ShowMouse = true;

We now need to write the mybutton_OnPress() function:

void mybutton_OnPress()
{
    Form.GetControl("hello").Caption = "Ouch!";
}

neat_tut_4_button

Here’s the complete code of the screen created in this tutorial:

    public class SampleGUIScreen : Screen
    {
        public SampleGUIScreen(NeatGame Game)
            : base(Game)
        {
        }

        public override void Initialize()
        {
            base.Initialize();
            Label hello = Form.NewControl(“hello”, new Label()) as Label;
            hello.Caption = "Hello, World!";
            hello.Position = new Vector2(100, 100);
            hello.ForeColor = Color.White;

            Button mybutton = Form.NewControl(“mybutton”, new Button()) as Button;
            mybutton.Caption = "Push Me!";
            mybutton.Position = new Vector2(100, 200);
            mybutton.ForeColor = Color.White;
            mybutton.HoverTintColor = Color.Green;
            mybutton.Size = new Vector2(400, 70);
            mybutton.OnPress = mybutton_OnPress;


            Form.HasMouse = true;
            game.ShowMouse = true;
        }

        void mybutton_OnPress()
        {
            Form.GetControl("hello").Caption = "Ouch!";
            Form.GetControl("hello").ForeColor = Color.Red;
        }
    }

Other controls can be added to screens as easy as above. Everything we did until now can be done using Neat Script:

g_showmouse true
f_hasmouse true
f_newcontrol hello label
f_selcontrol hello
fc_caption Hello, World!
fc_position 100,100
fc_forecolor white
f_newcontrol mybutton button
f_selcontrol mybutton
fc_caption Push Me!
fc_position 100,200
fc_hovertintcolor green
fc_size 400,70
fc_onpress fc_caption Ouch!
f_selcontrol hello

Last edited May 29, 2012 at 2:30 PM by saeedoo, version 4

Comments

No comments yet.