| <div> |
| |
| <h3>Updating from RAP 1.5 (Eclipse Juno)?</h3> |
| <p> |
| You may also check the |
| <a href="../2.0/">New and Noteworthy for RAP 2.0</a> and the |
| <a href="../2.0/migration-guide/">RAP 2.0 migration guide</a>. |
| </p> |
| |
| <h2>Widget Set</h2> |
| |
| <h3>Row Templates</h3> |
| |
| <p> |
| We introduced row templates, a new feature that allows you replace the column layout model of |
| a table ore tree with a custom presentation. |
| Templates consist of cells that can be freely arranged. |
| A cell can display a text or an image from the table item, but also static content. |
| </p> |
| <p> |
| <img class="framed" alt="A table with row template" src="./images/row-template.png"/> |
| <p> |
| To apply a row template on a Table or a Tree, use the <em>setData()</em> method with the |
| new constant <em>RWT.ROW_TEMPLATE</em> as key: |
| </p> |
| <pre class="lang-java"> |
| Table table = new Table( parent, SWT.FULL_SELECTION ); |
| // Add as many columns as a single table item will have texts/images: |
| new TableColumn(); |
| Template template = new Template(); |
| // ... create template cells here, the set the template: |
| table.setData( RWT.ROW_TEMPLATE, template ); |
| </pre> |
| <p> |
| To position a cell, you have to set exactly two horizontal and two vertical dimensions |
| (two out of <em>left</em>, <em>right</em>, and <em>width</em> and two out of <em>top</em>, |
| <em>bottom</em>, and <em>height</em>). Cells can also be selectable. |
| When a selectable cell is clicked it does not mark the the item itself as selected. |
| Item selection is still possible (clicking anywhere but on a selectable cell), |
| but only visualized if the <em>SWT.FULL_SELECTION</em> |
| flag is set. |
| </p> |
| <p> |
| Row templates are currently supported by <em>Tree</em> and <em>Table</em>, but we plan to |
| apply this concept on other widgets in the future. |
| All details are covered in |
| the Developer's Guide article on |
| <a href="http://www.eclipse.org/rap/developers-guide/devguide.php?topic=tree-table.html&version=2.2#templates">Tree and Table Enhancements</a>. |
| </p> |
| |
| <h3>FileUpload supports Multiple File Selection</h3> |
| |
| <p> |
| The <em>FileUpload</em> widget |
| now allows selecting and uploading multiple files at once in HTML5 enabled browsers. To enable |
| this feature, create the widget with the <em>SWT.MULTI</em> style flag like this: |
| </p> |
| <pre class="lang-java"> |
| FileUpload fileUpload = new FileUpload( parent, SWT.MULTI ); |
| </pre> |
| <p> |
| To obtain the filenames from the widget, the method <em>getFileNames</em> has been introduced. |
| The method <em>getFileName</em> still exists and will return the first selected file. |
| </p> |
| <p> |
| In browsers that do not support this feature (such as Internet Explorer 8) the <em>MULTI</em> |
| flag will simply be ignored. |
| </p> |
| <p> |
| The <a href="http://eclipse.org/rap/incubator/">RAP Incubator</a> file upload component |
| and the <em>FileDialog</em> implementation have been updated to make use of this new feature. |
| </p> |
| |
| <h3>Modernized ToolTips</h3> |
| |
| <p> |
| The look and feel of tooltips has been improved and fine-tuned: |
| </p> |
| <ul> |
| <li> |
| ToolTips for buttons, items and fields will now be placed above/below (in some cases besides) |
| the widget and they have a little pointer pointing to the widget. |
| See also “<a href="#tooltiptheming">Revised and Extended ToolTip Theming</a>”. |
| </li> |
| <li> |
| ToolTips generated by the <em>setToolTipText</em> method appear faster than before. |
| The exact delay is adjusted to the widget type. |
| </li> |
| <li> |
| ToolTips will no longer disappear automatically after a short timeout. The exact conditions |
| for them to disappear depend on the widget, but they will always disappear when the mouse |
| is moved away from the widget or when a key is pressed. |
| </li> |
| <li> |
| Appear and disappear animations are skipped when they are not needed. |
| </li> |
| </ul> |
| |
| <p> |
| <img src="./images/tooltips.png"/> |
| </p> |
| |
| <h3>Markup Support for ToolTips</h3> |
| |
| <p> |
| The <em>ToolTipText</em> property and the <em>ToolTip</em> widget now support |
| markup, including hyperlinks. To enable tooltip markup for on any widget with a <em>setToolTipText</em> method, |
| use the <em>RWT.TOOLTIP_MARKUP_ENABLED</em> constant like this: |
| </p> |
| <pre class="lang-java"> |
| widget.setData( RWT.TOOLTIP_MARKUP_ENABLED, Boolean.TRUE ); |
| widget.setToolTipText( "This is a tooltip<br/><i>with</i> <b>some</b> <big>markup</big>" ); |
| </pre> |
| <img src="./images/tooltip-markup.png"/> |
| <p> |
| For the <em>ToolTip</em> widget, the API is the same as it is for other |
| widget: |
| </p> |
| <pre class="lang-java"> |
| toolTip.setData( RWT.MARKUP_ENABLED, Boolean.TRUE ); |
| </pre> |
| |
| <h3>Pre-load items in virtual Tree and Table</h3> |
| |
| <p> |
| To improve the responsiveness of a virtual Tree or Table, we added the possibility to |
| specify a number of items to be pre-loaded by the client. |
| When scrolling the table in small steps, pre-loaded items will appear immediately. Example: |
| </p> |
| <pre class="lang-java"> |
| Table table = new Table( parent, SWT.VIRTUAL ); |
| table.setData( RWT.PRELOADED_ITEMS, new Integer( 10 ) ); |
| </pre> |
| <p> |
| With this snippet, in addition to visible items in the Tree/Table client area, another 10 |
| items (above and below) will be resolved and sent to the client. |
| </p> |
| |
| <h2>RWT Scripting</h2> |
| |
| <h3>Migrated ClientScripting to RAP Core</h3> |
| |
| <p> |
| The ClientScripting project has been graduated from the incubator and is now included in the RAP core |
| as “RWT Scripting”. Using the new <em>ClientListener</em> class, it is possible to handle some |
| events directly on the client without the usual latency caused by HTTP requests. |
| </p> |
| <p> |
| The following widgets support ClientListener: |
| </p> |
| <table style="border:none"> |
| <tr> |
| <td style="border:none" valign="top"> |
| <ul> |
| <li><code>Button</code></li> |
| <li><code>Canvas</code></li> |
| <li><code>Combo</code></li> |
| <li><code>Composite</code></li> |
| <li><code>Label</code></li> |
| </ul> |
| </td> |
| <td style="border:none" valign="top"> |
| <ul> |
| <li><code>ProgressBar</code></li> |
| <li><code>Scale</code></li> |
| <li><code>Spinner</code></li> |
| <li><code>Text</code></li> |
| </ul> |
| </td> |
| </tr> |
| </table> |
| |
| <p> |
| Supported events are: |
| </p> |
| <table style="border:none"> |
| <tr> |
| <td style="border:none" valign="top"> |
| <ul> |
| <li><code>SWT.Verify</code></li> |
| <li><code>SWT.Modify</code></li> |
| <li><code>SWT.KeyDown</code></li> |
| <li><code>SWT.KeyUp</code></li> |
| <li><code>SWT.FocusIn</code></li> |
| <li><code>SWT.FocusOut</code></li> |
| <li><code>SWT.Hide</code></li> |
| <li><code>SWT.Show</code></li> |
| </ul> |
| </td> |
| <td style="border:none" valign="top"> |
| <ul> |
| <li><code>SWT.MouseDown</code></li> |
| <li><code>SWT.MouseUp</code></li> |
| <li><code>SWT.MouseMove</code></li> |
| <li><code>SWT.MouseEnter</code></li> |
| <li><code>SWT.MouseExit</code></li> |
| <li><code>SWT.MouseWheel</code></li> |
| <li><code>SWT.MouseDoubleClick</code></li> |
| <li><code>SWT.Paint</code></li> |
| </ul> |
| </td> |
| </tr> |
| </table> |
| <p> |
| Consult the new Developers Guide |
| <a href="http://www.eclipse.org/rap/developers-guide/devguide.php?topic=scripting.html&version=2.2">Scripting article</a> |
| for information on ClientListener, and the WebClient |
| <a href="http://download.eclipse.org/rt/rap/doc/2.2/guide/reference/jsdoc/index.html">API reference</a> |
| to find out what widget methods are available in RWT Scripting. |
| </p> |
| <p> |
| <b>Note:</b> The ClientScripting incubator project is no longer compatible with RAP 2.2 |
| and must be used <strong>only</strong> with older RAP versions. If you port code based on |
| the incubator ClientScripting to RAP 2.2 Scripting, please note that the namespace |
| for <em>ClientListener</em> has been changed to <em>org.eclipse.rap.rwt.scripting</em>. Also, |
| the number of supported widgets and methods has been reduced, but in return the properties |
| are now always synchronized back to the server. |
| </p> |
| |
| <h3>Synchronize user data with the client</h3> |
| |
| <p> |
| Data attached to an SWT widget can now be transferred to the client to access |
| it in scripting. To do so, the key for that data has to be registered with |
| <em>WidgetUtil.registerDataKeys</em>. Example: |
| </p> |
| |
| <pre class="lang-java"> |
| WidgetUtil.registerDataKeys( "foo" ); |
| widget.setData( "foo", "bar" ); |
| </pre> |
| |
| <p> |
| A <em>ClientListener</em> can use the data like this: |
| </p> |
| |
| <pre class="lang-javascript"> |
| function handleEvent( event ) { |
| var data = event.widget.getData( "foo" ); |
| } |
| </pre> |
| <p> |
| This feature can also be used to |
| <a href="http://www.eclipse.org/rap/developers-guide/devguide.php?topic=scripting.html&version=2.2#crosswidget">access other scriptable widgets</a> |
| within a <em>ClientListener</em>. |
| </p> |
| |
| <h2>Application Context</h2> |
| |
| <h3>Application Context Listener</h3> |
| |
| <p> |
| Instances of <em>ApplicationContextListener</em> can be attached to an application |
| context to receive a notification before the application context is destroyed. |
| </p> |
| |
| <h2>Client Services</h2> |
| |
| <h3>Improved JavaScriptLoader</h3> |
| |
| <p> |
| The <em>JavaScriptLoader</em> implementation has been improved in the following aspects: |
| </p> |
| <ul> |
| <li><b>Files can be loaded from any URL:</b> |
| Previously the <em>JavaScriptLoader</em> could only load scripts served by the RAP application, |
| e.g. by registering them with the resource manager. Now any URL that is accessible by the |
| client can be used. |
| </li> |
| <li><b>Browser no longer blocked during loading:</b> |
| The JavaScriptLoader now uses asynchronous HTTP request to load the JavaScript file, |
| which means the browser no longer becomes unresponsive while waiting for the request to finish. |
| </li> |
| <li><b>Scripts appear in Browser Developer Tools:</b> |
| Previously the loaded scripts did not appear in the "sources" or "scripts" tabs of |
| the browser debugger (e.g. Firebug). |
| </li> |
| </ul> |
| |
| <h2>Theming</h2> |
| |
| <h3 id="tooltiptheming">Revised and Extended ToolTip Theming</h3> |
| |
| <p> |
| We've polished the look and feel of tooltips in the default theme (see above). |
| To do so, a new theming element has been introduced: <em>Widget-ToolTip-Pointer</em>. |
| This element has a single property <em>background-image</em> and four states, <em>up</em>, |
| <em>down</em>, <em>left</em>, and <em>right</em>. |
| This property allows to attach a pointer image to one edge of the ToolTip. |
| The state indicates the direction that the ToolTip points to. |
| The image should match the background and/or border color of the ToolTip theming. |
| A full set of four images would be defined like this: |
| </p> |
| <pre class="lang-css"> |
| Widget-ToolTip-Pointer { |
| background-image: none; |
| } |
| |
| Widget-ToolTip-Pointer:up { |
| background-image : url( tooltip-up.png ); |
| } |
| |
| Widget-ToolTip-Pointer:down { |
| background-image : url( tooltip-down.png ); |
| } |
| |
| Widget-ToolTip-Pointer:left { |
| background-image : url( tooltip-left.png ); |
| } |
| |
| Widget-ToolTip-Pointer:right { |
| background-image : url( tooltip-right.png ); |
| } |
| </pre> |
| |
| <p> |
| It is now also possible to set the horizontal alignment for texts in tooltips. |
| </p> |
| |
| <pre class="lang-css"> |
| Widget-ToolTip { |
| text-align: left; |
| } |
| </pre> |
| |
| <p> |
| Since tooltips are only as wide as their content, this only has a visible effect if the tooltip |
| has a newline in it, e.g.: |
| </p> |
| |
| <pre class="lang-java"> |
| widget.setToolTipText( "This has a \n new line" ); |
| </pre> |
| |
| <p> |
| The default value is <em>center</em>. |
| </p> |
| |
| <h3>Other Theme Extensions</h3> |
| |
| <p> |
| The theming was extended in several other places: |
| </p> |
| <ul> |
| <li> |
| <em>ProgressBar</em> has a new themeable property <em>width</em>. |
| </li> |
| <li> |
| <em>box-shadow</em> property has been added to <em>Button</em>. |
| </li> |
| <li> |
| The theming for Table and Tree has a new state <em>rowtemplate</em> to allow to |
| make adjustments specific to row templates. The default theme uses this state to set |
| vertical instead of horizontal grid lines when row templates are used. |
| </li> |
| </ul> |
| |
| <h2>Deployment</h2> |
| |
| <h3>WAR Undeployment issues resolved</h3> |
| <p> |
| There has long been <a href="https://bugs.eclipse.org/bugs/show_bug.cgi?id=407371">an issue</a> |
| with RAP applications deployed as <em>.war</em> files that could not be properly stopped or |
| undeployed and even prevented the servlet container from shutting down. |
| These problems have been fixed. |
| Stopping and undeploying RAP applications works as expected now. |
| </p> |
| |
| <h3>Protocol</h3> |
| |
| <p> |
| An overview of what changed in the <a href="https://wiki.eclipse.org/RAP/Protocol">RAP protocol</a> can be <a href="https://wiki.eclipse.org/RAP/Protocol_Changes#Changes_in_RAP_2.2">found in the RAP Wiki</a>. |
| </p> |
| |
| </div> |