Dynamic Animation Library
The tutorial shows how to create and display “Hello World” using a text label.
The NUI Overview is an introduction to NUI.
The following steps are required to display text:
This tutorial also demonstrates the triggering (firing) of the Touch window application event.
The required system and NUI namespaces are imported via the using declarations:
using System;
using System.Runtime.InteropServices;
using Tizen.NUI;
using Tizen.NUI.UIComponents;
using Tizen.NUI.BaseComponents;
using Tizen.NUI.Constants;
This application is scoped to the ‘HelloTest’ namespace.
The Main method consist of 2 steps:
Creation of application via the default constructor.
Example example = new Example();
The application is derived from the Tizen NUI application class - NUIApplication.
class Example : NUIApplication
The NUIApplication class also includes constructors enabling application creation with stylesheets and window modes.
Start of application main loop
The main loop must be started to run the application. This ensures that images are displayed, and events and signals are dispatched and captured.
example.Run(args);
In this simple tutorial, the Main method resides within the class. For significant application development, the Main method should be placed in a seperate .cs file.
The hello world OnCreate
method, overrides the NUIApplication OnCreate
function:
base.OnCreate();
Initialize();
Hence we can incorporate the required initialization behaviour in our application.
Note: base.OnCreate
is necessary to invoke the ‘created’ event.
The initialization code contains the following simple steps:
Creation of the text label member variable.
_text = new TextLabel("Hello World");
Positioning the text in centre of application window. The ParentOrigin defines a point within the parent views’s area. Note: The text label will be at least the width of the screen if the text label size is not specified.
_text.ParentOrigin = ParentOrigin.CenterLeft;
Alignment of text horizontally to the center of the available area.
_text.HorizontalAlignment = HorizontalAlignment.Center;
Setting label background color to illustrate label width.
_text.BackgroundColor = Color.Red;
Setting text size. The size of the font in points.
_text.PointSize = 32.0f;
Adding the Touch event handler to the main application window. This event handler is invoked on any click in the application window.
Window window = Window.Instance;
window.TouchEvent += WindowTouched;
Adding the Touch event handler with lambda expressions, is an alternative.
Adding text to the root layer.
window.Add(_text);
The window will add the view to the root layer.
The user can click anywhere in the application window to change the text in the label:
private void WindowTouched(object sender, Window.TouchEventArgs e)
{
_text.Text = "I have been touched!";
}
OnTerminate
is invoked when the application is about to terminate.
OnTerminate
is invoked by selection of the window close button.
Note: base.OnTerminate
is necessary to invoke the ‘deleted’ event.
Use Visual Studio on a Windows platform. Use Visual Studio Code on Linux.
The NUI development setup guide describes setting up the NUI development environment on Ubuntu, using this tutorial as an example project.
using System;
using System.Runtime.InteropServices;
using Tizen.NUI;
using Tizen.NUI.UIComponents;
using Tizen.NUI.BaseComponents;
using Tizen.NUI.Constants;
namespace HelloTest
{
class Example : NUIApplication
{
TextLabel _text;
protected override void OnCreate()
{
base.OnCreate();
Initialize();
}
private void Initialize()
{
// Add a simple text label to the main window
_text = new TextLabel("Hello World");
_text.ParentOrigin = ParentOrigin.CenterLeft;
_text.HorizontalAlignment = HorizontalAlignment.Center;
_text.BackgroundColor = Color.Red;
_text.PointSize = 32.0f;
// Connect the signal callback for a touch signal
Window window = Window.Instance;
window.TouchEvent += WindowTouched;
window.Add(_text);
}
// Callback for main window touched signal handling
private void WindowTouched(object sender, Window.TouchEventArgs e)
{
_text.Text = "I have been touched!";
}
protected override void OnTerminate()
{
base.OnTerminate();
_text = null;
}
static void Main(string[] args)
{
Example example = new Example();
example.Run(args);
}
}
}
After running the example, the following output should appear:
window.TouchEvent += (object src, Window.TouchEventArgs args) =>
{ // code
_text.Text = "I have been touched!";
};
The Text Label tutorial describes the key properties of the text label in detail.