\r
<p>To create a 'Hello World' application with Dali:</p>\r
<ol>\r
+<li><a href="#create">Create a DALi project</a></li>\r
<li><a href="#initial">Initialize the DALi application</a></li>\r
-<li><a href="#actor">Create an actor and add to a stage</a></li>\r
+<li><a href="#actor">Create an actor and add it to a stage</a></li>\r
+<li><a href="#build">Build your DALi application</a></li>\r
+<li><a href="#run">Run your DALi application</a></li>\r
</ol>\r
\r
-<pre class="prettyprint">#include < dali-toolkit/dali-toolkit.h>\r
+<h3 id="create" name="create">Create a DALi project</h3>\r
+\r
+<ol>\r
+<li>Launch the <strong>Tizen IDE</strong>.</li>\r
+<li>Choose File > New > Tizen Native Project.\r
+<p>Press Finish button, then your project is created at the default location. If you want to change the location, uncheck 'Use default location' and set the new location.\r
+Please see <a href="../../../../org.tizen.gettingstarted/html/native/process/app_dev_process_n.htm#creating">Creating the Application Project</a> for more information.</p>\r
+</li>\r
+\r
+<p class="figure">Figure: Create a DALi project</p>\r
+<p align="center"><img alt="Create a DALi project" src="../../images/tizen_project_dali.png" width="600"/></p>\r
+\r
+<li>The new project is shown in the Project Explorer view of the IDE. If you open src/basicdaliapplication.cpp, you can see the source code of basic DALi application as follows:\r
+<pre class="prettyprint">\r
+#include <dali-toolkit/dali-toolkit.h>\r
\r
using namespace Dali;\r
using Dali::Toolkit::TextLabel;\r
\r
-// This example shows how to create and display Hello World! using a simple TextActor\r
-\r
+// This example shows how to create and display Hello World using a simple TextLabel\r
+//\r
class HelloWorldController : public ConnectionTracker\r
{\r
public:\r
\r
- HelloWorldController(Application& application) : mApplication(application)\r
- {\r
- // Connect to the Application's Init signal\r
- mApplication.InitSignal().Connect(this, &HelloWorldController::Create);\r
- }\r
-\r
- ~HelloWorldController()\r
- {\r
- // Remove Hello World actor from stage\r
- Stage::GetCurrent().Remove(mTextLabel);\r
- }\r
-\r
- // The Init signal is received once (only) during the Application lifetime\r
- void Create(Application& application)\r
- {\r
- // Get a handle to the stage\r
- Stage stage = Stage::GetCurrent();\r
- mTextLabel = TextLabel::New("Hello World");\r
- stage.Add(mTextLabel);\r
- }\r
+ HelloWorldController( Application& application )\r
+ : mApplication( application )\r
+ {\r
+ // Connect to the Application's Init signal\r
+ mApplication.InitSignal().Connect( this, &HelloWorldController::Create );\r
+ }\r
+\r
+ ~HelloWorldController()\r
+ {\r
+ // Nothing to do here\r
+ }\r
+\r
+ // The Init signal is received once (only) during the Application lifetime\r
+ void Create( Application& application )\r
+ {\r
+ // Get a handle to the stage\r
+ Stage stage = Stage::GetCurrent();\r
+ stage.SetBackgroundColor( Color::WHITE );\r
+\r
+ TextLabel textLabel = TextLabel::New( "Hello World" );\r
+ textLabel.SetAnchorPoint( AnchorPoint::TOP_LEFT );\r
+ textLabel.SetName( "hello-world-label" );\r
+ stage.Add( textLabel );\r
+\r
+ // Respond to a click anywhere on the stage\r
+ stage.GetRootLayer().TouchedSignal().Connect( this, &HelloWorldController::OnTouch );\r
+ }\r
+\r
+ bool OnTouch( Actor actor, const TouchEvent& touch )\r
+ {\r
+ // quit the application\r
+ mApplication.Quit();\r
+ return true;\r
+ }\r
\r
private:\r
- Application& mApplication;\r
- TextLabel mTextLabel;\r
-}; \r
+ Application& mApplication;\r
+};\r
\r
-// Entry point for Linux & Tizen applications\r
-int main(int argc, char **argv)\r
+// Entry point for Tizen applications\r
+//\r
+int main( int argc, char **argv )\r
{\r
-\r
- Application application = Application::New(&argc, &argv); \r
- HelloWorldController test(application); \r
- application.MainLoop();\r
-\r
- return 0;\r
+ Application application = Application::New( &argc, &argv );\r
+ HelloWorldController test( application );\r
+ application.MainLoop();\r
+ return 0;\r
}\r
</pre>\r
+</li>\r
+</ol>\r
\r
-<h3 id="initial" name="initial">Initializing the DALi Application</h3>\r
+<h3 id="initial" name="initial">Initialize the DALi Application</h3>\r
\r
<p>To use DALi APIs, include the <span style="font-family: Courier New,Courier,monospace;">dali-toolkit.h</span> header file. It includes the <span style="font-family: Courier New,Courier,monospace;">dali-core</span> and <span style="font-family: Courier New,Courier,monospace;">dali-adaptor</span> modules.</p>\r
\r
-<pre class="prettyprint">#include < dali-toolkit/dali-toolkit.h></pre>\r
+<pre class="prettyprint">#include <dali-toolkit/dali-toolkit.h></pre>\r
\r
<p>The <span style="font-family: Courier New,Courier,monospace;">Dali::Application</span> class (in <a href="../../../../org.tizen.native.mobile.apireference/classDali_1_1Application.html">mobile</a> and <a href="../../../../org.tizen.native.wearable.apireference/classDali_1_1Application.html">wearable</a> applications) initializes and sets up DALi.</p>\r
<p>Several signals can be connected to keep you informed when certain platform related activities occur and ensure that, upon system events, DALi is called in a thread-safe manner.</p>\r
<pre class="prettyprint">\r
application.MainLoop();</pre>\r
\r
-<h3 id="actor" name="actor">Creating an Actor and Adding It to a Stage</h3>\r
+<h3 id="actor" name="actor">Create an Actor and Add It to a Stage</h3>\r
\r
<p>The <span style="font-family: Courier New,Courier,monospace;">TextLabel</span> UI component renders a short text string. To display the <span style="font-family: Courier New,Courier,monospace;">TextLabel</span> component, add it to a stage. The <span style="font-family: Courier New,Courier,monospace;">stage</span> instance is a singleton object (the only instance of its class during the lifetime of the program), so you can get it using a static function:</p>\r
\r
-<pre class="prettyprint">mTextLabel = TextLabel::New("Hello World");\r
-\r
+<pre class="prettyprint">\r
Stage stage = Stage::GetCurrent();\r
-stage.Add(mTextLabel);</pre>\r
+stage.SetBackgroundColor( Color::WHITE );\r
+\r
+TextLabel textLabel = TextLabel::New( "Hello World" );\r
+textLabel.SetAnchorPoint( AnchorPoint::TOP_LEFT );\r
+textLabel.SetName( "hello-world-label" );\r
+stage.Add( textLabel );\r
+</pre>\r
+\r
+<p>This code additionally sets the background color of the <span style="font-family: Courier New,Courier,monospace;">stage</span> and the anchor point, a point defining a position of a child actor from its parent, of the <span style="font-family: Courier New,Courier,monospace;">textLabel</span>. The application stores actor and resource handles. DALi objects are reference-counted, which makes sure they exist only as long as they are needed. Even if the <span style="font-family: Courier New,Courier,monospace;">TextLabel</span> component is removed from the stage, it remains alive through the reference.</p>\r
+\r
+\r
+<h3 id="build" name="build">Build your DALi application</h3>\r
+\r
+<p>To build your application, choose Project > Build Project or press F10.</p>\r
+<p>The Tizen IDE automatically packages the project after building. Please note that you need to register your certificate at the first time to build. Please see <a href="../../../../org.tizen.devtools/html/common_tools/certificate_registration.htm">Certificate Registration</a> and <a href="../../../../org.tizen.gettingstarted/html/native/process/building_app_n.htm">Building Applications</a> for more information.</p>\r
+\r
\r
-<p>The application stores actor and resource handles. DALi objects are reference-counted, which makes sure they exist only as long as they are needed. Therefore, store the actor handle. Even if the <span style="font-family: Courier New,Courier,monospace;">TextLabel</span> component is removed from the stage, it remains alive through the reference.</p>\r
+<h3 id="run" name="run">Run your DALi application</h3>\r
\r
+<p>To run your application, choose Run > Run or press Ctrl+F11.</p>\r
+<p>Please see <a href="../../../../org.tizen.gettingstarted/html/native/process/running_app_n.htm">Running Applications</a> for more information.</p>\r
\r
+<p class="figure">Figure: The first DALi application running on Tizen emulator</p>\r
+<p align="center"><img alt="The first DALi application" src="../../images/hello_world_dali.png" /></p>\r
\r
<script type="text/javascript" src="../../scripts/jquery.zclip.min.js"></script>\r
<script type="text/javascript" src="../../scripts/showhide.js"></script>\r