Hello World!

The UI Composer generated the UI files as outlined in red below:

These files had to be manually added to the solution by right clicking on the Blog1 project and "Add>Add Files..."

In order to use the generated class called BlogScreen, I had to import the Blog1UI namespace by adding a "using Blog1UI". I also had to import the HighLevelUI namespace by adding "using Sce.Pss.HighLevel.UI" to use the Blog1UI. This is similar Java's "import" statement for importing packages. 


To use generated user interfaces, I had to make use of the UISystem class. This can be initialized in the initialize method


public static void Initialize ()
{
graphics = new GraphicsContext ();
        UISystem.Initialize(graphics);

var blogScreen = new BlogScreen();


        UISystem.SetScene(blogScreen, null);
}


Changes were also required in the other methods


public static void Update ()
{
var gamePadData = GamePad.GetData (0);


List<TouchData> touchDataList = Touch.GetData (0);


UISystem.Update(touchDataList);
}


public static void Render ()
{
UISystem.Render ();


graphics.SwapBuffers ();
}



This is enough to get the program running but more work must be done to get the "Hello World" button to function and display the image when pressed. To do this, changes must be made to the BlogScreen class in BlogScreen.cs. In the constructor, a button action method has been added where the image is set to visible when the button is pressed. The following code snippet describes the changes


public BlogScreen()
{
InitializeWidget();

HelloWorldBtn.ButtonAction += HandleHelloWorldBtnButtonAction;
}


void HandleHelloWorldBtnButtonAction (object sender, TouchEventArgs e)
{
WorldImg.Visible = true;
}


Here is the end result after the button is pressed

     

Playing with the UI Composer

I was playing around with the UI Composer and made a little "Hello World" program. It reminds me of NetBeans in a way where you can design the user interface using various widgets and then code for functionality.

The UI Composer builds the necessary files that are required to be used in a project where you want to use the interface you've created. These files have to then be added to the project's solution. A few minor changes had to then be made in order to use the UI generated files.

Here is a screenshot of my project in the UI Composer













Currently you can only see a Hello World! button. I wanted to create a button that showed an image after it was pressed.

There's some code to input to make the program functional so right now, I'll try and get that working.