Difference between revisions of "EDT:EGL Editor Introduction"

From Eclipsepedia

Jump to: navigation, search
(Introduction: tdr edits)
(Line numbers and code decorators)
 
(28 intermediate revisions by one user not shown)
Line 1: Line 1:
 
= Introduction  =
 
= Introduction  =
The EGL editor is based on Eclipse to provide specialized features for editing EGL code. Associated with the editor is a EGL-specific Outline view, which shows the structure of the active EGL Part. The Outline view is updated as the user edits the EGL file. The EGL editor includes the following features:
+
The EGL editor provides specialized features for editing EGL code in Eclipse. Associated with the editor is a EGL-specific Outline view, which shows the structure of the active EGL part. The Outline view is updated as the you edit the EGL file. The EGL editor includes the following features:
 
*Syntax highlighting
 
*Syntax highlighting
 
*Content/code assist
 
*Content/code assist
Line 8: Line 8:
 
*Integrated debugging features
 
*Integrated debugging features
 
This article introduces some features to improve the EGL development efficiency.
 
This article introduces some features to improve the EGL development efficiency.
#Use Content Assist to improve development efficiency
+
#Content Assist
 
#Quick fix/Quick Assist
 
#Quick fix/Quick Assist
 
#Navigation between EGL parts
 
#Navigation between EGL parts
 
#Vertical ruler
 
#Vertical ruler
  
=Use Content Assist to improve development efficiency=
+
= Use Content Assist to improve development efficiency =
Content assist helps you to quickly define variable, function or finish a line of code in the EGL editor. The content assist is context sensitive, which means that the proposals listed in the dialog is different with the cursor position changing. In the EGL editor press Ctrl + Space or Alt + “/”(Can be configured) on to trigger the content assist.This will open a list of available code completions.
+
  
==Three types of content assist proposals in EGL==
+
Content assist helps you to quickly define a variable, function or complete a line of code in the EGL editor. The content assist is context sensitive, which means that the proposals listed in the dialog is different depending on the cursor position. In the EGL editor, press '''Ctrl + Space''' or '''Alt + /'''(depending on your configuration) to trigger the content assist which lists possible code completion options.  
#Keyword Proposals:This proposal type only provides EGL Keywords which can be used at the current cursor position.
+
#Reference Proposals:This proposal type provides proposals like variables defined in the context,System type,library,functions which can be used at the current cursor position.
+
#Template Proposals:Template proposal type provide predefined code snippet,like function definition code, externaltype definition code etc.
+
  
==How to configure content assist==
+
== Three types of content assist proposals in EGL ==
#Open configuration dialog Window>Preferences>EGL>Editor>Content Assist
+
#Make sure auto activation checkbox was selected.
+
#Expend Content assist node and select Advanced configure page.
+
#Choose those Proposal kinds in your default proposal list(The first proposal list when content assist was invoked)
+
#Configure the order of proposal kinds you as you want.<br>[[Image:Ca configure.png|Content Assist Configuration]]
+
  
==The content assist dialog==
+
#Keyword - provides only EGL keywords.
When Content Assist dialog displayed, you can use content assist hotkey to display specific proposal type.<br>[[Image:Cadialog.png|Use Content Assist]]
+
#Reference - provides proposals such as variables defined in the context, System type, library, functions.  
 +
#Template - provides predefined code snippets, like function definition, external type definition, etc.
  
==How to use content assist==
+
Invoking content assist multiple times cycles through the proposals.
===Define a variable===
+
Take defining a checkbox type variable in a RUI Handler as a example.
+
#Type the variable name you want
+
#Invoke Content assist
+
#The content assist will list all proposals, and you can type characters to filter the result.<br>[[Image:Definevar.png|Define a variable]]
+
  
===Initial field value for complex types===
+
== How to configure content assist ==
Take a checkbox type variable as example. In the handler file, currently has a variable defined as following,<br>
+
 
acheckbox CheckBox{};<br>
+
#Open configuration dialog '''Window&gt;Preferences&gt;EGL&gt;Editor&gt;Content Assist'''
#Now we want to initialize the width value of the check box.
+
#Make sure the "Enable auto activation" checkbox is selected.
#Invoke Content assist in “{}”.
+
#Expand '''Content Assist''' node and select the '''Advanced''' page.
#Type “w” to filter the result(You can type “i” again to filter result,if you want)
+
#Choose those Proposal kinds in your default proposal list. (The first proposal list when content assist was invoked.)
#Select “width” and press “enter”,the “width = “ will be inserted into EGL editor.
+
#Configure the order of proposal kinds you want.<br>[[Image:Ca configure.png|Content Assist Configuration]]
 +
 
 +
== The content assist dialog ==
 +
 
 +
When the Content Assist dialog is displayed, you can use the content assist hot key to display a specific proposal type.<br>[[Image:Cadialog.png|Use Content Assist]]
 +
 
 +
== How to use content assist ==
 +
 
 +
=== Define a variable ===
 +
 
 +
Example: Defining a checkbox type variable in a RUI Handler.  
 +
 
 +
#Type the variable name you want.
 +
#Invoke Content assist.
 +
#The content assist lists all proposals. You can type characters to filter the result.<br>[[Image:Definevar.png|Define a variable]]
 +
 
 +
=== Initialize a field value for complex types ===
 +
 
 +
In the handler file, a variable defined as follows:
 +
<pre>acheckbox CheckBox{};
 +
 
 +
</pre>  
 +
Now we want to initialize the width value of the check box.  
 +
#Invoke Content assist within “{}”.  
 +
#Type “w” to filter the result. (You can type additional letters to narrow the filter if you want.)  
 +
#Select “width” and press '''Enter.''' &nbsp;The “width = “ will be inserted into EGL editor.  
 
#Invoke Content Assist after “=”, “” will be inserted and you could input the value you want.<br>[[Image:Cacomplexinit.png|Initialize Complex type]]
 
#Invoke Content Assist after “=”, “” will be inserted and you could input the value you want.<br>[[Image:Cacomplexinit.png|Initialize Complex type]]
  
===Using template proposals to define part===
+
=== Use template proposals to define a part ===
Template proposals are predefined code templates can be used in EGL language. Users just need to replace some variables with their.<br>
+
 
Take defining a Entity subtype Record data type as example:
+
Template proposals are predefined code templates that can be used for EGL. Templates allow you to replace some variables with your own.<br>Example: Defining a Entity subtype Record data type
#Move you cursor below the end of last “end” keyword, input “r”,invoke Content Assist.
+
 
#Select “record-entity record”,and press “enter”
+
#Move the cursor below the end of last&nbsp;'''end'''&nbsp;keyword, input “r”, and invoke Content Assist.  
 +
#Select “record-entity record” and press '''Enter'''.
 
#The cursor will auto focus on the “recordName”. Input the variable name.<br>[[Image:Templateentityred.png|Use Content Assist to define entity type record]]
 
#The cursor will auto focus on the “recordName”. Input the variable name.<br>[[Image:Templateentityred.png|Use Content Assist to define entity type record]]
  
===Using template to define function===
+
=== Use a template to define a function ===
#Put the cursor before the last “end” keyword.
+
 
#Input a “f”,and invoke Content assist.
+
#Put the cursor before the last '''end''' keyword.  
#Choose “function with parameters and...” and press “enter”, the function prototype will be generated for you.<br><br>[[Image:Deffunction.png|Using Template to define function]]
+
#Input a “f”, and invoke Content assist.  
 +
#Choose “function with parameters and...” and press '''Enter.''' The function template will be generated for you.<br><br>[[Image:Deffunction.png|Using Template to define function]]
  
 
=Quick fix/Quick Assist=
 
=Quick fix/Quick Assist=
The EGL editor offers corrections to problems found while typing and after compiling. To show that correction proposals are available for a problem. Default hotkey for Quick fix/Quick assist is Ctrl + 1.
+
The EGL editor offers corrections to problems found while typing and after compiling. Quick fix, also known as Quick assist, shows correction proposals are available for a problem. The default hotkey for Quick fix/Quick assist is Ctrl + 1.
 
==Create callback functions==
 
==Create callback functions==
#Write the function name you want after “returning to”,in the example is “aReturnFunction”.
+
#Write the function name you want after “returning to”, in the example is “aReturnFunction”.
#Invoke quick fix by press Ctrl + 1
+
#Invoke quick fix by press '''Ctrl + 1'''.
#Choose “Create function ….” ,press “enter” and save the file.<br>[[Image:Quick fix.png|Using quick fix to create callback function]]
+
#Choose “Create function ….”, press '''Enter''' and save the file.<br>[[Image:Quick fix.png|Using quick fix to create callback function]]
 
==Create delegate functions==
 
==Create delegate functions==
Sometimes when you do not know the definition of a delegate, and you need to create instance of the delegate(create a function) .In this time, quick fix could create a prototype for you.
+
Sometimes when you do not know the definition of a delegate, you will need to create an instance of the delegate (create a function). Quick fix is handy to create a function template for you.<br>
#Take “onclick” event handler of Button as a example.
+
Example: “onclick” event handler of Button
 
#Invoke quick fix at the error line.
 
#Invoke quick fix at the error line.
#Select “Create function ….” ,press “enter” and save the file.<br>[[Image:Delegate2.png|Using quick fix to create delegate function]]
+
#Select “Create function ….”, press '''Enter''' and save the file.<br>[[Image:Delegate2.png|Using quick fix to create delegate function]]
  
 
=Navigation between EGL parts=
 
=Navigation between EGL parts=
==Open part dialog==
+
== Open part dialog ==
#Open the Open Part dialog by pressing Ctrl+Shift+F3, choosing Navigate > Open Part...  
+
 
#Press the Arrow Down key to select CheckBox
+
#Open the Open Part dialog by pressing '''Ctrl+Shift+F3''', choosing '''Navigate &gt; Open Part...'''
 +
#Press the Arrow Down key to select CheckBox  
 
#Press Enter to open the Part in the EGL editor.<br>[[Image:Open part.png|Open part dialog]]
 
#Press Enter to open the Part in the EGL editor.<br>[[Image:Open part.png|Open part dialog]]
  
==Navigate between the EGL parts==
+
== Navigate between the EGL parts ==
On the 6 lines of the aHandler part declaration, select the aService and either<br>
+
*From the menu bar select Open on Selection or
+
*Press F3<br>[[Image:F3.png|Open on selection]]<br>
+
The aService Part opens in the editor area and is also represented in the Outline view.
+
Note: This command also works on functions and fields.<br>
+
  
After this action, cursor will jump to the definition of aService .<br>[[Image:F3result.png|Open on selection]]
+
On the Line 6 of the aHandler part declaration, select the aService variable. Click '''Open on Selection'''&nbsp;from the context menu (or press F3).<br>[[Image:F3.png|Open on selection]]<br>
 +
 
 +
The aService Part opens in the editor area and is also represented in the Outline view. Note: This command also works on functions and fields.<br>
 +
 
 +
After this action, cursor will jump to the definition of aService.<br>[[Image:F3result.png|Open on selection]]
 +
 
 +
=Line numbers and code decorators=
 +
On the left side of EGL editor is the vertical grey border. When you right-click on the border, a context menu appears so you can manage the display structure of source code, show line numbers, add/delete bookmark or task etc.<br>[[Image:Vetical ruler.png|Vertical ruler]]
 +
 
 +
==Show line numbers==
 +
It often very handy to see the line numbers of your source code. You can select '''Show Line Numbers''' from the context menu after right-clicking on the grey border to the left of your code.
  
=Vertical ruler=
 
The left side of EGL editor is vertical ruler. Right click on the vertical ruler,a pop-up context menu will show. Through this menu lists, you could manager the display structure of source code,show line number,add/delete bookmark,task etc.<br>[[Image:Vetical ruler.png|Vertical ruler]]
 
 
==Source folding==
 
==Source folding==
Folding function is used to enable users quickly organize the source code display structure.
+
The Folding function is used to enable you to quickly organize the source code display structure. Sections of code are folded, or collapsed, allowing you to read more of the other code in the file. 
*You can right click vertical ruler Folding>Togge Folding or
+
*To enable/disable the folding function, right-click on the vertical ruler and select '''Folding>Toggle Folding''' or press '''Ctrl + /'''(on the number pad).<br>[[Image:Fold.png|Folding]]
*Press Ctrol + /(Number pad)<br>
+
  
To enable/disable folding function.<br>[[Image:Fold.png|Folding]]
 
 
==Add bookmark & tasks==
 
==Add bookmark & tasks==
The Workbench allows you to create bookmarks in files that you edit so that you can quickly reopen those files from the Bookmarks view
+
The Workbench allows you to create bookmarks in files that you edit so that you can quickly reopen those files from the Bookmarks view.
 
#With the file open in an editor, right-click in the gray border at the left of the editor area, next to the line of code or text that you want to bookmark.
 
#With the file open in an editor, right-click in the gray border at the left of the editor area, next to the line of code or text that you want to bookmark.
#Select Add Bookmark from the pop-up menu.
+
#Select '''Add Bookmark''' from the pop-up menu.
#Notice that an icon for the bookmark now appears in the left border of the editor area. A record ine is also added to the Bookmarks view.)<br>[[Image:Bookmark.png|Bookmark]]<br>
+
#Notice that an icon for the bookmark now appears in the left border of the editor area. Hover over the bookmark icon to see its name.  The bookmark is also added to the Bookmarks view.)<br>[[Image:Bookmark.png|Bookmark]]<br>
You can add/delete/manipulate task with the same way in EGL editor and task view.
+
 
 +
You can add/delete/manipulate tasks in much the same way in EGL editor and the Task view.
  
 
[[Category:EDT]]
 
[[Category:EDT]]

Latest revision as of 18:08, 20 February 2012

Contents

[edit] Introduction

The EGL editor provides specialized features for editing EGL code in Eclipse. Associated with the editor is a EGL-specific Outline view, which shows the structure of the active EGL part. The Outline view is updated as the you edit the EGL file. The EGL editor includes the following features:

  • Syntax highlighting
  • Content/code assist
  • Code formatting
  • Import assistance (Organize imports)
  • Quick fix
  • Integrated debugging features

This article introduces some features to improve the EGL development efficiency.

  1. Content Assist
  2. Quick fix/Quick Assist
  3. Navigation between EGL parts
  4. Vertical ruler

[edit] Use Content Assist to improve development efficiency

Content assist helps you to quickly define a variable, function or complete a line of code in the EGL editor. The content assist is context sensitive, which means that the proposals listed in the dialog is different depending on the cursor position. In the EGL editor, press Ctrl + Space or Alt + /(depending on your configuration) to trigger the content assist which lists possible code completion options.

[edit] Three types of content assist proposals in EGL

  1. Keyword - provides only EGL keywords.
  2. Reference - provides proposals such as variables defined in the context, System type, library, functions.
  3. Template - provides predefined code snippets, like function definition, external type definition, etc.

Invoking content assist multiple times cycles through the proposals.

[edit] How to configure content assist

  1. Open configuration dialog Window>Preferences>EGL>Editor>Content Assist
  2. Make sure the "Enable auto activation" checkbox is selected.
  3. Expand Content Assist node and select the Advanced page.
  4. Choose those Proposal kinds in your default proposal list. (The first proposal list when content assist was invoked.)
  5. Configure the order of proposal kinds you want.
    Content Assist Configuration

[edit] The content assist dialog

When the Content Assist dialog is displayed, you can use the content assist hot key to display a specific proposal type.
Use Content Assist

[edit] How to use content assist

[edit] Define a variable

Example: Defining a checkbox type variable in a RUI Handler.

  1. Type the variable name you want.
  2. Invoke Content assist.
  3. The content assist lists all proposals. You can type characters to filter the result.
    Define a variable

[edit] Initialize a field value for complex types

In the handler file, a variable defined as follows:

acheckbox CheckBox{};

Now we want to initialize the width value of the check box.

  1. Invoke Content assist within “{}”.
  2. Type “w” to filter the result. (You can type additional letters to narrow the filter if you want.)
  3. Select “width” and press Enter.  The “width = “ will be inserted into EGL editor.
  4. Invoke Content Assist after “=”, “” will be inserted and you could input the value you want.
    Initialize Complex type

[edit] Use template proposals to define a part

Template proposals are predefined code templates that can be used for EGL. Templates allow you to replace some variables with your own.
Example: Defining a Entity subtype Record data type

  1. Move the cursor below the end of last end keyword, input “r”, and invoke Content Assist.
  2. Select “record-entity record” and press Enter.
  3. The cursor will auto focus on the “recordName”. Input the variable name.
    Use Content Assist to define entity type record

[edit] Use a template to define a function

  1. Put the cursor before the last end keyword.
  2. Input a “f”, and invoke Content assist.
  3. Choose “function with parameters and...” and press Enter. The function template will be generated for you.

    Using Template to define function

[edit] Quick fix/Quick Assist

The EGL editor offers corrections to problems found while typing and after compiling. Quick fix, also known as Quick assist, shows correction proposals are available for a problem. The default hotkey for Quick fix/Quick assist is Ctrl + 1.

[edit] Create callback functions

  1. Write the function name you want after “returning to”, in the example is “aReturnFunction”.
  2. Invoke quick fix by press Ctrl + 1.
  3. Choose “Create function ….”, press Enter and save the file.
    Using quick fix to create callback function

[edit] Create delegate functions

Sometimes when you do not know the definition of a delegate, you will need to create an instance of the delegate (create a function). Quick fix is handy to create a function template for you.
Example: “onclick” event handler of Button

  1. Invoke quick fix at the error line.
  2. Select “Create function ….”, press Enter and save the file.
    Using quick fix to create delegate function

[edit] Navigation between EGL parts

[edit] Open part dialog

  1. Open the Open Part dialog by pressing Ctrl+Shift+F3, choosing Navigate > Open Part...
  2. Press the Arrow Down key to select CheckBox
  3. Press Enter to open the Part in the EGL editor.
    Open part dialog

[edit] Navigate between the EGL parts

On the Line 6 of the aHandler part declaration, select the aService variable. Click Open on Selection from the context menu (or press F3).
Open on selection

The aService Part opens in the editor area and is also represented in the Outline view. Note: This command also works on functions and fields.

After this action, cursor will jump to the definition of aService.
Open on selection

[edit] Line numbers and code decorators

On the left side of EGL editor is the vertical grey border. When you right-click on the border, a context menu appears so you can manage the display structure of source code, show line numbers, add/delete bookmark or task etc.
Vertical ruler

[edit] Show line numbers

It often very handy to see the line numbers of your source code. You can select Show Line Numbers from the context menu after right-clicking on the grey border to the left of your code.

[edit] Source folding

The Folding function is used to enable you to quickly organize the source code display structure. Sections of code are folded, or collapsed, allowing you to read more of the other code in the file.

  • To enable/disable the folding function, right-click on the vertical ruler and select Folding>Toggle Folding or press Ctrl + /(on the number pad).
    Folding

[edit] Add bookmark & tasks

The Workbench allows you to create bookmarks in files that you edit so that you can quickly reopen those files from the Bookmarks view.

  1. With the file open in an editor, right-click in the gray border at the left of the editor area, next to the line of code or text that you want to bookmark.
  2. Select Add Bookmark from the pop-up menu.
  3. Notice that an icon for the bookmark now appears in the left border of the editor area. Hover over the bookmark icon to see its name. The bookmark is also added to the Bookmarks view.)
    Bookmark

You can add/delete/manipulate tasks in much the same way in EGL editor and the Task view.