The Hello Tizen sample application demonstrates how you can show text on the screen and receive touch events.
The following figure illustrates the main screen of the Hello Tizen.
Figure: Hello Tizen screen
The application opens with the main screen that shows the Hello Tizen text.
You can change the text by touching the screen.
Source Files
You can create and view the sample application project, including the source files, in the IDE.
| File name | Description |
|---|---|
| config.xml | This file contains the application information for the platform to install and launch the application, including the view mode and the icon to be used in the device menu. |
| css/ | This directory contains the CSS styling for the application UI. |
| index.html | This is a starting file from which the application starts loading. It contains the layout of the application screens. |
| js/ | This directory contains the application code. |
Implementation
The following code adds a click event listener. When a click event occurs, the Hello Tizen text changes into the Hi WebApp text.
textbox.addEventListener('click', function()
{
var box = document.getElementById('content_text');
if (box.innerHTML === 'Hello Tizen')
{
box.innerHTML = "Hi WebApp";
}
else
{
box.innerHTML = "Hello Tizen";
}
});
The following code adds a hardware event listener. When the back button is pressed, the application is terminated.
document.addEventListener('tizenhwkey', function(e)
{
if (e.keyName === 'back')
{
try
{
tizen.application.getCurrentApplication().exit();
}
catch (ignore) {}
}
});