Skip to main content

Notice: this Wiki will be going read only early in 2024 and edits will no longer be possible. Please see: https://gitlab.eclipse.org/eclipsefdn/helpdesk/-/wikis/Wiki-shutdown-plan for the plan.

Jump to: navigation, search

Difference between revisions of "Scout/Tutorial/5.0/HelloWorld"

< Scout‎ | Tutorial‎ | 5.0
(Run the "hello world" application)
 
(5 intermediate revisions by one other user not shown)
Line 39: Line 39:
 
==Client Side: Add a Message Field to the Desktop Form ==
 
==Client Side: Add a Message Field to the Desktop Form ==
  
[[Image:Scout-NewFormField.PNG]]
+
[[Image:Scout-NewFormField5 hello world.PNG]]
  
 
In the {{ScoutLink|SDK|Explorer_View|Scout Explorer}} drill down to client, Forms, DesktopForm, MainBox
 
In the {{ScoutLink|SDK|Explorer_View|Scout Explorer}} drill down to client, Forms, DesktopForm, MainBox
Line 63: Line 63:
 
* '''default''' The translation for the default language (usually English). More languages and text translations may be added any time (see [[Scout/Concepts/NLS-Support]])
 
* '''default''' The translation for the default language (usually English). More languages and text translations may be added any time (see [[Scout/Concepts/NLS-Support]])
  
Then click ''OK''
+
Then click ''OK''. Confirm by clicking ''Finish''
  
[[Image:Scout-NewFormField5.PNG]]
+
[[Image:Scout-NewFormField6 helloworld.PNG]]
 
+
Step 4: Verify details of the new string field by clicking again into the Text: The bold title is the ''key name'' and all translations should be shown
+
 
+
Confirm by clicking ''Finish''
+
 
+
[[Image:Scout-NewFormField6.PNG]]
+
  
 
Navigate down from the ''MainBox'' to the newly created ''MessageField''. Double click on the MessageField node to display the generated code (selected code in screenshot above) in the Java editor window.
 
Navigate down from the ''MainBox'' to the newly created ''MessageField''. Double click on the MessageField node to display the generated code (selected code in screenshot above) in the Java editor window.
Line 83: Line 77:
 
Add a simple implementation for the ''load'' method:
 
Add a simple implementation for the ''load'' method:
  
<source lang="java" line="GESHI_NORMAL_LINE_NUMBERS" start="1">
+
<source lang="java">
public DesktopFormData load(DesktopFormData formData) {
+
@Override
 +
public DesktopFormData load(DesktopFormData formData) throws ProcessingException {
 
   formData.getMessage().setValue("hello world");
 
   formData.getMessage().setValue("hello world");
 
   return formData;
 
   return formData;
 
}
 
}
 
</source>
 
</source>
'''<span style="color:#FF0000"> (load ... throws ProcessingException, missing in default generation in Version 4.0) </span>'''
 
  
On line 2 we access the message field of the {{ScoutLink|Concepts|FormData|FormData}} and set its value to <code>"hello world"</code>. The updated form data is returned and eventually sent back to the client.
+
On the third line we access the message field of the {{ScoutLink|Concepts|FormData|FormData}} and set its value to <code>"hello world"</code>. The updated form data is returned and finally sent back to the client.
  
 
==Run the "hello world" application ==
 
==Run the "hello world" application ==
Line 97: Line 91:
 
In the {{ScoutLink|SDK|Explorer_View|Scout Explorer}} go back to top-level node ''Scout Projects'', then click on ''org.eclipse.scout.helloworld'' to access the launch boxes in the Scout Object Properties.
 
In the {{ScoutLink|SDK|Explorer_View|Scout Explorer}} go back to top-level node ''Scout Projects'', then click on ''org.eclipse.scout.helloworld'' to access the launch boxes in the Scout Object Properties.
 
* Start the server in the server box
 
* Start the server in the server box
* Start the client in the SWT box
+
* Start the client in the SWT and/or Swing box
  
 
And, "Ta Taa"
 
And, "Ta Taa"
  
 
[[Image:Scout-Helloworld1.PNG]]
 
[[Image:Scout-Helloworld1.PNG]]

Latest revision as of 13:08, 29 January 2015

The Scout documentation has been moved to https://eclipsescout.github.io/.

This page shows how to create your Hello World app using the The Scout documentation has been moved to https://eclipsescout.github.io/.. We assume that you already have The Scout documentation has been moved to https://eclipsescout.github.io/..

Create a new Scout Project

CreateANewScoutProject.PNG

Start your Eclipse with an empty workspace and Use the File | New | Project ... menu.

CreateANewScoutProject2.PNG

In the wizard choose Scout project and click Next.

CreateANewScoutProject3 5.PNG

Enter org.eclipse.scout.helloworld as an application name. The last part of the name (after the last period) will automatically be used as the project alias. For more details about the new project creation see the corresponding HowTo: The Scout documentation has been moved to https://eclipsescout.github.io/.. Then click Next.

CreateANewScoutProject4.PNG

Select Application with a single form as your app template, then click Finish.

CreateANewScoutProject5.PNG

The empty application is created by The Scout documentation has been moved to https://eclipsescout.github.io/. and if you are not already in the The Scout documentation has been moved to https://eclipsescout.github.io/. you are prompted to switch now. Click on Yes.

Run the Empty Scout Application in the Scout SDK

CreateANewScoutProject7Ver4.0.PNG

In the The Scout documentation has been moved to https://eclipsescout.github.io/. open the node Scout Projects, then click on org.eclipse.scout.helloworld. This will show the Scout Object Properties for the application.


After starting first the server (1) and then the Swing client (2) from the launching boxes as shown below, the empty client will appear.

CreateANewScoutProject8Ver4.0.PNG

Client Side: Add a Message Field to the Desktop Form

Scout-NewFormField5 hello world.PNG

In the The Scout documentation has been moved to https://eclipsescout.github.io/. drill down to client, Forms, DesktopForm, MainBox

To the main box we will add a message The Scout documentation has been moved to https://eclipsescout.github.io/.. Click right on MainBox and choose the menu New Form Field.

Scout-NewFormField2.PNG

Step 1: Select field type. Here we'll use a The Scout documentation has been moved to https://eclipsescout.github.io/.. Then click Next (you may directly click on it or use the search box as shown above)

Scout-NewFormField3.PNG

Step 2: Add the field label, type "Message" that triggers the dropdown list. Choose New translated text... (or use an existing text)

Scout-NewFormField4Ver4.0.PNG

Step 3: Fill in the default translation. Some other fields are automatically filled:

  • Key Name used to retrieve the translated text in the code
  • default The translation for the default language (usually English). More languages and text translations may be added any time (see Scout/Concepts/NLS-Support)

Then click OK. Confirm by clicking Finish

Scout-NewFormField6 helloworld.PNG

Navigate down from the MainBox to the newly created MessageField. Double click on the MessageField node to display the generated code (selected code in screenshot above) in the Java editor window.

Server Side: Implement the Data Loading

In the The Scout documentation has been moved to https://eclipsescout.github.io/. navigate to the server node, then Services, and DesktopService. The DesktopService is the server side service corresponding to the DesktopForm defined on the client side. This The Scout documentation has been moved to https://eclipsescout.github.io/. was created as part of the selected application template. The load(DesktopFormData) method is defined out of the box.

Scout-HelloworldVer4.0.PNG

Add a simple implementation for the load method:

@Override
public DesktopFormData load(DesktopFormData formData) throws ProcessingException {
  formData.getMessage().setValue("hello world");
  return formData;
}

On the third line we access the message field of the The Scout documentation has been moved to https://eclipsescout.github.io/. and set its value to "hello world". The updated form data is returned and finally sent back to the client.

Run the "hello world" application

In the The Scout documentation has been moved to https://eclipsescout.github.io/. go back to top-level node Scout Projects, then click on org.eclipse.scout.helloworld to access the launch boxes in the Scout Object Properties.

  • Start the server in the server box
  • Start the client in the SWT and/or Swing box

And, "Ta Taa"

Scout-Helloworld1.PNG

Copyright © Eclipse Foundation, Inc. All Rights Reserved.