0% found this document useful (0 votes)
37 views66 pages

SwixEditor User Guide

The document is a user guide for SwixEditor, a GUI designer for SwiXml forms, detailing installation, activation, and usage instructions. It outlines licensing agreements for both professional and free versions, including activation steps and system requirements. The guide also includes chapters on layout management, editing controls, and creating new projects within the Eclipse IDE.

Uploaded by

rliimabra
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
37 views66 pages

SwixEditor User Guide

The document is a user guide for SwixEditor, a GUI designer for SwiXml forms, detailing installation, activation, and usage instructions. It outlines licensing agreements for both professional and free versions, including activation steps and system requirements. The guide also includes chapters on layout management, editing controls, and creating new projects within the Eclipse IDE.

Uploaded by

rliimabra
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 66

Invivosoft

SwixEditor
Release 1

User Guide

-1-
Document Information

Release 1
Publication Date 22 December, 2006
Part number SwixEditor_3.x

© 2006 Invivo software


This document contains proprietary and confidential information of Invivosoft and shall not be reproduced
or transferred to other documents, disclosed to others, or used for any purpose other than that for which it is
furnished, without the prior written consent of Invivosoft. It shall be returned to Invivosoft upon request.
The trademark and service marks of Invivo, including the Invivo mark and logo, are the exclusive property
of Invivo, and may not be used without permission. All other marks mentioned in this material are the
property of their respective owners.

-2-
License Agreement
PLEASE READ THIS AGREEMENT CAREFULLY BEFORE USING THE
SOFTWARE. INVIVOSOFT WILL LICENSE THE SOFTWARE TO YOU ONLY IF
YOU FIRST ACCEPT THE TERMS OF THIS AGREEMENT. BY USING THE
SOFTWARE YOU AGREE TO THESE TERMS. IF YOU DO NOT AGREE TO THE
TERMS OF THIS AGREEMENT, PROMPTLY RETURN THE UNUSED SOFTWARE
TO THE PARTY (EITHER INVIVOSOFT OR ITS RESELLER) FROM WHOM YOU
ACQUIRED IT TO RECEIVE A REFUND OF THE AMOUNT YOU PAID.

This is a legal agreement between you, the end user, and Invivo software private limited,
(Invivosoft). SwixEditor(the "Software") is owned by Invivosoft and is protected by
copyright law. Upon acceptance of the terms of this License Agreement, your rights and
obligations with respect to use of the Software are as follows. These rights are in
supplement of U.S. copyright law and the requirements of local laws and treaties.

LICENSE INFORMATION. The Software is licensed under the following terms and
conditions.

AUTHORIZATION. The Software may be stored on the primary machine and another
machine (Home/Portable Computer), provided that the Software is not in active use on
both machines at the same time.

COMMERCIAL LICENSE (PROFESSIONAL EDITION). Invivosoft grants you a


nonexclusive license to use the Software. You may 1) use the Software to the extent of
authorizations you have acquired and 2) make and install copies to support the level of
use authorized, providing you reproduce the copyright notice and any other legends of
ownership on each copy, or partial copy, of the Software. If you acquire this Software as
a program upgrade, your authorization to use the Software from which you upgraded is
terminated. You will ensure that anyone who uses the Software does so only in
compliance with the terms of this Agreement. You may not transfer your license rights to
another party without prior written consent from Invivosoft.

NON COMMERCIAL LICENSE (FREE EDITION). Invivosoft grants you a


nonexclusive, nontransferable license to use the Software. You may 1) use the Software
only for internal evaluation, testing or demonstration purposes, on a trial or "try-and-buy"
basis and 2) make and install a reasonable number of copies of the Software in support of
such use. The terms of this license apply to each copy you make. You will reproduce the
copyright notice and any other legends of ownership on each copy, or partial copy, of the
Software. You will 1) maintain a record of all copies of the Software and 2) ensure that
anyone who uses the Software does so only for your authorized use and in compliance
with the terms of this Agreement.

COPYRIGHT. The Software and Documentation are copyrighted by Invivosoft and are
protected by U.S. and international copyright laws. The product contains copyrighted

-3-
software of Invivosoft. All rights reserved. You agree not to remove any Invivosoft or
other trademarks or copyright notices from the Software or Documentation.

OTHER RESTRICTIONS. You may not disclose, publish, translate, rent, lease, transfer,
export or otherwise make available the Software registration key in any form, to any
person or entity, except as expressly licensed herein. You may not reverse engineer,
decompile or disassemble the Software.

RUNTIME RIGHTS AND LIMITATIONS. You (a) cannot use Invivosoft or related names,
logos or trademarks to market your software without express written permission; and (b)
agree to indemnify, hold harmless and defend Invivosoft from and against any claims or
lawsuits, including attorneys' fees that arise or result from the use or distribution of your
software. The license in this section is royalty-free provided that your software
application product is created using the Software.

IN NO EVENT SHALL INVIVOSOFT BE LIABLE FOR ANY LOSS OF PROFIT OR


ANY OTHER DAMAGE, INCLUDING BUT NOT LIMITED TO SPECIAL,
INCIDENTAL, CONSEQUENTIAL OR OTHER DAMAGES. THE SOFTWARE IS
PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND. INVIVOSOFT
SPECIFICALLY DISCLAIMS ALL OTHER WARRANTIES, EXPRESS OR
IMPLIED, INCLUDING WITHOUT LIMITATION THE IMPLIED WARRANTIES OF
MERCHANTABILITY OR FITNESS FOR A PARTICULAR USE. INVIVOSOFT
DOES NOT WARRANT THAT THE SOFTWARE WILL MEET YOUR
REQUIREMENTS OR THAT THE OPERATION OF THE SOFTWARE WILL BE
UNINTERRUPTED OR ERROR-FREE.

GOVERNING LAW. This Agreement shall be governed by the laws of the State of
Andhra Pradesh, India, without regard to conflict of laws principles. This Agreement may
only be modified by a written document signed by the party or parties to be bound.
Except as may be specified in such a written agreement, this is the entire agreement
between you and Invivosoft and all other terms are rejected. You agree not to use, ship,
or export the Software in violation of law.

ENTIRE AGREEMENT. You agree that this Agreement expresses the entire
understanding between you and Invivosoft, Inc., and supersedes all other
communications, oral or written, relating to the Software.

COPYRIGHT 2005, 2006 INVIVO SOFTWARE PRIVATE LIMITED.

MANUFACTURER:
Invivo software private limited
6-3-597/D/12, Anand nagar colony,
Khairtabad, Hyderabad-500 004
AP, India
Phone: 011-91-40-30284447

-4-
Contents
Chapter 1 Overview................................................................................................ 6
Chapter 2 Installing SwixEditor............................................................................. 8
Chapter 3 Activating SwixEditor ......................................................................... 11
Chapter 4 Getting Started.................................................................................... 16
Chapter 5 Layout managers................................................................................ 24
Chapter 6 Editing menus (professional version).............................................. 40
Chapter 7 Editing Toolbar (professional version) ............................................ 44
Chapter 8 Include Panels .................................................................................... 47
Chapter 9 TabbedPanes...................................................................................... 50
Chapter 10 SplitPane ............................................................................................. 53
Chapter 11 Custom controls and custom elements .......................................... 58
Appendix...................................................................................................................... 64

-5-
Chapter 1 Overview

Figure 1 Form Editor elements

SwixEditor is a SwiXml GUI designer. It is built using the Eclipse SWT technology and
works as a plugin in your Eclipse installation. Using SwixEditor, you can create complex
SwiXml forms visually in a 100% WYSIWYG view. SwixEditor will create valid SwiXml
markup for you whenever you add or delete controls, or change properties of any control.

SwixEditor is provided as an Eclipse extension. Eclipse is an open source integrated


development environment (IDE) that is extensible through plugin architecture. More
information about Eclipse can be found at

• http://www.eclipse.org

SwiXml is Copyright of Wolf Paulus (www.swixml.org)


-6-
This user guide describes how to use SwixEditor to create and edit SwiXml forms.

For information on installing SwixEditor and its pre-requisites, see Chapter 2, “Installing
SwixEditor”.

You need a valid license to be able to use SwixEditor. See chapter 3, “Activating
SwixEditor”.

Get familiar with SwixEditor parts and get started with creating and opening SwiXml
forms in chapter 4, “Getting started”.

Chapter 5, “Layout Managers” will walk you through editing for various layouts,
including JGoodies Formlayout, gridbag layout etc.

Chapter 6 through 9 describe editing for controls and containers.

SwixEditor supports all the SwiXml supported controls and containers that you can use in
a form. SwixEditor also supports editing of custom controls and custom elements (non
visual elements) in the Form. For more see chapter 10, “Custom Controls and Elements”.

-7-
Invivosoft

Chapter 2 Installing SwixEditor

Getting SwixEditor......................................................................................................... 9
Pre-requisites ................................................................................................................ 9
Installing SwixEditor plugins.......................................................................................... 9

-8-
Chapter 2, Installing SwixEditor

Getting SwixEditor

You can buy a professional version of SwixEditor or download a free-evaluation version


from http://www.invivosoft.com

Pre-requisites

SwixEditor is supported on Eclipse platform version 3.2 and 3.1. The pre-requisites for
SwixEditor on these two platform versions are listed below.

Eclipse 3.2.1 (Callisto) Eclipse 3.1

• Eclipse Platform version 3.2.1 • Eclipse Platform version 3.1


• Eclipse Plugin Development • Eclipse Plugin Development
Environment PDE – 3.2.1 Environment PDE – 3.1
• JDT 3.2.1 • JDT 3.1
• GEF 3.2 • GEF 3.1
• EMF-SDO 2.2.0 • EMF-SDO 2.1.0
• XSD 2.2.0 • XSD 2.1.0
• Visual Editor (optional) – 1.2 • Visual Editor (optional) – 1.1

Installing SwixEditor plugins

Before installing SwixEditor plugins, you should have installed Eclipse platform (3.2 or
3.1) and the corresponding pre-requisites listed in the table above. Information on
installing eclipse and the pre-requisite plugins is available on http://www.eclipse.org.

Extract the swixplugins-3.2.0.zip (or swixplugins-3.1.0.zip) to

“<YourEclipseInstallationDir>\eclipse” folder.

For example, if your Eclipse platform 3.2 is installed in C:\Callisto, then extract the
swixplugins-3.2.0.zip contents to C:\Callisto\eclipse folder.

Verify if installation is complete.


Do the following to verify if the installation is complete.

Æ Launch Eclipse.
Æ Select Help->About Eclipse XXX

-9-
Chapter 2, Installing SwixEditor

Æ Select plugin details button

You will see SwixEditor and SwixModel plugins in the list. If you don’t see these plugins
in the list, then either the swixplugin-3.2.0.zip was not extracted in the right folder, or one
of the pre-requisites is not correctly installed. Please check the appendix (Trouble
shooting installation) for more information.

- 10 -
Invivosoft

Chapter 3 Activating SwixEditor

Licenses ...................................................................................................................... 12
Activating Professional Version................................................................................... 12
Activating Free version................................................................................................ 15

- 11 -
Chapter 3, Activating SwixEditor

Licenses

After installing SwixEditor, it has to be registered and activated before it can be used.
SwixEditor comes in two license versions – The professional license version and the free
evaluation license version.

Activating Professional Version

The professional edition is a commercial license with free support and updates. The
professional license is a per-machine, per-user license. After acquiring/purchasing a
“Professional Version” license for SwixEditor it needs to be activated. Follow the steps
below for activating the product. Even if the “Free Version” license was already installed,
you still need to follow the steps below for activation.

1. Launch Eclipse and navigate to Window Æ Preferences.

2. In the Preferences dialog select Invivo SwixEditor.

3. Select Registration to view the Registration Dialog.

- 12 -
Chapter 3, Activating SwixEditor

4. The “Current License” field will display as “UnRegistered” if not licensed and as
“Free Version” if the free version license was already installed.

5. In the “Product ID” field enter the product id. The product id was provided to you when
you purchased the license for the product.

6. Click on “Request License” to open the “SwixEditor License Manager” Dialog.

7. Enter all the details and click “Next”

8. The next page displays all the information you entered along with your product Id
(Figure below)

- 13 -
Chapter 3, Activating SwixEditor

9. Click on “Create Email” to send this information to [email protected]. if the


email client does not come up automatically on pressing the “Create Email” button,
then click the “Copy To Clipboard” button, and email the information to
[email protected].

10. A “License.key” file will be mailed back to you within 24 hrs of receiving your mail.
Save this file locally on your machine.

11. Launch Eclipse and navigate to Window Æ Preferences.

12. Select Registration to view the Registration Dialog.

13. Next to the “License File” field click on the “Browse” button to browse for the
“License.key” file.

14. Click on “Activate Now” to activate the “Professional Version” of the product.

A dialog box showing the status of activation will be displayed. If successful, the
“Professional Version” is ready for use. The “Current License” label changes to
“Professional Version”.

- 14 -
Chapter 3, Activating SwixEditor

Activating Free version

The free version of SwixEditor is a functional plugin with some professional features
removed or restricted. This comes with a “Non-Commerical” use License. This license is
appropriate for educational, recreational, or academic research or instruction purposes
only. "Non-commercial" in this context does not mean "non-profit."

There is no support for the free edition. To activate the free version of SwixEditor,

1. Launch Eclipse and navigate to Window Æ Preferences.

2. In the Preferences dialog select Invivo SwixEditor.

3. Select Registration to view the Registration Dialog.

4. The “Current License” field will display “UnRegistered”.

5. In the “Product ID” field enter the product id. The product id was sent to you by
email when you downloaded the free version of SwixEditor from
http://www.invivosoft.com.

6. Click on “Request License” to license the product as a Free Version.

A dialog box showing the status of licensing will be displayed. If the licensing was not
successful please re-enter the product id and click on “Request License”. If successful the
“Current License” field changes to “Free Version”.

- 15 -
Invivosoft

Chapter 4 Getting Started

Creating a new Java Project ....................................................................................... 17


Creating a new SwixML Form ..................................................................................... 18
Opening an Existing SwixML form .............................................................................. 20
Parts of the designer ................................................................................................... 21
Palette ..................................................................................................................... 21
Designer Composition ............................................................................................. 21
Property Editor ........................................................................................................ 22
Form Element Browser............................................................................................ 22

- 16 -
Chapter 4, Getting Started

Creating a new Java Project

You need a Java Project to host SwiXml forms. To create a Java project,

1. Select File Æ New Æ Project

2. Chose Java Project

3. Enter a project name and press Finish button to create a Java Project.

- 17 -
Chapter 4, Getting Started

Creating a new SwixML Form

1. Select File Æ New Æ Other

2. Select SwixEditor Æ Frame (or Dialog)

- 18 -
Chapter 4, Getting Started

3. Enter a package name (or keep it empty for default package), and enter a name for
the form, and press Finish button.

4. A new SwixML form is created.

- 19 -
Chapter 4, Getting Started

Opening an Existing SwixML form

1. To open an existing SwixML form, name the file with an extension “.swx” (ex:
myform.swx).

2. Double click on the form in package explorer or navigator to open the form. Or
right click on the Form and select Open.

3. This will open the file in the Designer Editor in the design view. There are three
tabs at the bottom of the editor window labeled Design, Script and Text as shown
below. If you click on the Design tab, the file will be displayed in the design view
and you will be able to visually design your Form.

Clicking on the Text(Read-only) tab will show you the SwixML markup. The
script tab has the Java class to define events from the form.

- 20 -
Chapter 4, Getting Started

Parts of the designer

Palette

The Control Palette is the palette from which to choose your controls. It contains all the
controls that can be added to your SwixML Form with the Designer.? Below is shown the
Control Palette with all the supported SwixML controls.

Designer Composition

The Designer Composition shows the GUI design as it will look when your application
is run. The designer composition also shows some extra feedback images to help you in
designing the form.

- 21 -
Chapter 4, Getting Started

Property Editor

The Property Editor shows all of the attributes (properties) of a selected control and
allows you to modify them.

Select a property by either clicking on the property title or the property value. A property
editor is then displayed which allows you to change its value. While editing a property
value, you can press Enter to apply the value or press Esc to return to the previous value.

Some properties are selected through a drop down list. Simply select the value from the
list that appears after clicking on the down arrow as shown above.

The positions of the palette and outline panes may be configured via drag and drop. The
palette may be docked to either the left or right side of the design area. The outline pane
can also be docked on the left or right side of the design area.

Form Element Browser

The Form Element Browser pane shows the form contents in a hierarchical tree view.
You can select any element in the tree to select the corresponding control in the designer
composition. Similarly when you select a control in the designer, the corresponding
control in the element browser will get selected.

For elements that are not selectable in the designer (such as menuitems) you will have to
select them in the tree view to edit their properties.

- 22 -
Chapter 4, Getting Started

- 23 -
Invivosoft

Chapter 5 Layout managers

BorderLayout............................................................................................................... 25
Setting Layout ......................................................................................................... 25
Visual Feedback...................................................................................................... 25

Flow Layout................................................................................................................. 27
Edit Operations ....................................................................................................... 27

BoxLayout ................................................................................................................... 27
Edit Operations ....................................................................................................... 27

GridBag Layout ........................................................................................................... 28


Context Menu .......................................................................................................... 28
Visual Feedback...................................................................................................... 29

CardLayout.................................................................................................................. 32
Adding control to a CardLayout container ............................................................... 32
Fronting a card ........................................................................................................ 33

JGoodies FormLayout................................................................................................. 34
Setting FormLayout as layout manager .................................................................. 34
Column and Row Properties Dialogs ...................................................................... 36
Visual Feedback...................................................................................................... 37

Null Layout .................................................................................................................. 39


Edit Operations ....................................................................................................... 39

- 24 -
Chapter 5, Layout Managers

BorderLayout

BorderLayout allows you to place controls on five specific spots on the container. These
spots are the center and the four edges.

Setting Layout

You can set the layout of a form or a panel to BorderLayout by changing the layout
property in the property editor.

Visual Feedback

When you try to place a control on a form with BorderLayout , a grid will appear
showing the different areas where you can place the control.

Once a control is added to one of the 5 regions in BorderLayout, that region is marked as
unavailable for adding more controls.

- 25 -
Chapter 5, Layout Managers

When a control that is placed on a BorderLayout is selected, it will have a constraints


property.You can set this property to north, south, west, east, and center and selecting a
particular location will place the selected control in that place. North refers to the top of
the form, south is the bottom, west is the left, east is the right, and center is the center.
Only one control can be displayed in any of the five spots at one time.

A form using BorderLayout and with a button in each spot looks like the following:

- 26 -
Chapter 5, Layout Managers

Flow Layout

To set the layout to flow or box layout, select the container (panel/frame/dialog) and edit
its layout property in the property editor.

Edit Operations

Add components by dragging them from palette and dropping them on the
designer. The Flow Layout manager shows the visual feedback for placing the
component at the desired position in the container.

Re-order components by dragging them and dropping in the designer.

Delete, cut-copy, paste components.

BoxLayout

The Box layout is supported as two special containers VBox and HBox in the palette. To
add a horizontal box layout panel to the form, select the HBox container and drop it onto
the form.

Edit Operations

Add, Delete, Move, Re-order components.

Add, Delete, Move. Re-order glue component to add gaps between components in
the HBox or VBox

- 27 -
Chapter 5, Layout Managers

GridBag Layout

Change the layout of the form or a panel by selecting it and changing the layout
attribute in the Properties Editor.

Graphical feedback is provided for all column, row and cell interactions.

All properties of a control in this layout can be changed using the


GridBagContraints property under Property Editor.

Context Menu

Right-click on a control to access the context menu.

Use the Alignment menu to align the control in the grid.

- 28 -
Chapter 5, Layout Managers

Visual Feedback

When adding a new control from the palette the cursor displays a ‘+’ sign
indicating that a new control is attached to the cursor.

The cursor remains in the same way when dropping the control in an empty cell.

When dropping the control in an occupied cell, the cursor changes to an


unexecutable icon, indicating that the operation cannot be performed.

The feedback is the same when moving an existing control to a new cell.

When pointing between two columns or rows of cells, the cursor arrow is shown
and the gap turns yellow, then a control can be inserted at the specific location.

- 29 -
Chapter 5, Layout Managers

When the gap turns yellow but the cursor changes to an unexecutable icon, the
insertion cannot be performed.

Feedback is avaliable when the gridbag properties of a control are modified using the
Properties Editor.

Anchor can be used to specify the control’s location in the cell when it is smaller
than the cell area.

Insets can be modified to specify external padding of the component.

- 30 -
Chapter 5, Layout Managers

Fill is used to specify how the control fills the cell. A textarea takes up the area of
the entire two cells.

- 31 -
Chapter 5, Layout Managers

CardLayout

CardLayout resizes all controls to fill the container. The property editor can be
used to change the layout of a container to card layout.

At any given time only one control is visible. Each controls overlaps the other.

Adding control to a CardLayout container

Select the control from the palette and drop it onto the cardlayout container (cardpane) in
the designer or in the Form Element Browser. If the topmost control in the cardpane is
not another container, then you can drop the control directly in the designer. But if the
visible control (card) is another container, then dropping a control will add it to the
visible card. In such cases, you can add the control to the cardpane in the Form Element
Browser tree node.

- 32 -
Chapter 5, Layout Managers

Fronting a card

A control can be fronted in the designer view by selecting it from the From Element
Browser (Tree view).

- 33 -
Chapter 5, Layout Managers

JGoodies FormLayout

This feature is based on technology from JGoodies Forms –


http://www.jgoodies.com/freeware/forms
Copyright © 2002-2006 JGoodies Karsten Lentzsch

Setting FormLayout as layout manager

Select the Frame or Panel in the designer or form element browser. Navigate to the
Layout property in the property editor.

The designer automatically adds a predefined set of formlayout rows and columns to the
container. You can control the number of rows and columns that get created in a new
formlayout container, by setting the defaults in preferences.

To set the formlayout preferences navigate to

Window Æ Preferences Æ Invivo SwixEditor Æ Formlayout

- 34 -
Chapter 5, Layout Managers

The row and column headers are automatically displayed at the left and top of the
formalyout container. Selecting a row or column in the header will display a context
menu to set the row and column properties.

The row and column header context menus contain items for:
• Displaying the Column Properties and Row Properties dialogs where you set
the row and column specifications.
• Shortcut menu items for setting individual row and column specifications.
• Deleting the selected row or column.
• Adding or inserting a new row or column.

- 35 -
Chapter 5, Layout Managers

Column and Row Properties Dialogs

The columns and row properties dialogs can be used to set the individual column and row
specification properties.

The size measurement unit can be in pixels, points, inches, millimeters, or dialog
units. Dialog units are based on the pixel size of the dialog font and grow and
shrink with the font and resolution.

The alignment sets the default alignment:

• The column alignment can be left, center, right, or fill.

• The row alignment can be top, center, bottom, or fill.

• You can override this setting for individual controls by displaying the
context menu when the cursor is positioned over a control and selecting
a different alignment.

You can set the starting size to be:

- 36 -
Chapter 5, Layout Managers

ƒ Constant which is a fixed size at the specified units; the row or column
cannot shrink or grow. This setting and the bounded size setting are
mutually exclusive.

ƒ Minimum where the row or column size starts at the largest minimum
size set individually by each control in the row or column. The controls
in the row or column do not shrink or clip below the minimum size.

ƒ Preferred where the row or column size starts at the largest preferred
size set individually by each control in the row or column. The controls
in the row or column shrink to largest minimum size below which they
clip (however the controls retain their size). Clipping happens
horizontally for a row and vertically for a column.

ƒ Default which is the same as preferred except that clipping does not
happen.

Visual Feedback

The column and row boundaries are shown with dotted lines

You can resize a column or a row by selecting the column and dragging the
resize handles.

Drag a row or a column to re-arrange

- 37 -
Chapter 5, Layout Managers

You can move a row or column by selecting and dragging it. As you drag, a visual
indicator shows where the row or column will be dropped. After you drop it, the
rows and columns are automatically renumbered.

Span a component across multiple rows and columns by simply selecting and
resizing the component.

Move the component to a different cell. The editor provides visual feedback on
cells where the component can/cannot be moved to.

Use the property editor to set the cell-constraints properties of the components.

Use the context menu on the component to set the alignment properties.

- 38 -
Chapter 5, Layout Managers

Null Layout

Set the layout to Null layout in the property editor to use Null Layout manager for a
container.

Edit Operations

Add, Delete, Move controls.

Change the size of controls using the resize handles.

- 39 -
Invivosoft

Chapter 6 Editing menus (professional version)

Adding MenuBar to Form ............................................................................................ 41


Adding Menu to MenuBar ........................................................................................... 41
Adding Menu Items ..................................................................................................... 41
Deleting Menu Items ................................................................................................... 42
Clipboard operations ................................................................................................... 42
Reordering Menu and Menu Item nodes..................................................................... 43

- 40 -
Chapter 6, Menus

Adding MenuBar to Form

Select the menubar from the palette and drop it on the Form node in the outline.

Adding Menu to MenuBar

Select the menu from the palette and drop it on the MenuBar in the outline.

Adding Menu Items

Select the menuitem / checkboxmenuitem / radiobuttonmenuitem / separator from the


palette and drop it on the Menu in the outline

- 41 -
Chapter 6, Menus

Deleting Menu Items

Select any of the nodes in the outline, and right click the “Delete” option in the context
menu to delete the node.

Clipboard operations

You can cut/copy and paste a menu, menuitem, or a separator.

You can copy a menu and paste it on menubar and copy a menuitem /separator /
radiobuttonmenuitem /checkboxmenuitem and paste it on a menu.

- 42 -
Chapter 6, Menus

Reordering Menu and Menu Item nodes

To reorder a menu or menuitem node in its parent, select the node and drag and drop it in
the new position. The designer helps you with a drop feedback line for the insertion
position as shown in the figure below.

- 43 -
Invivosoft

Chapter 7 Editing Toolbar (professional version)

Adding Toolbar to a form............................................................................................. 45


Adding Controls to Toolbar ......................................................................................... 45
DeletingToolbar........................................................................................................... 45
Clipboard operations ................................................................................................... 45
Reordering Toolbar controls........................................................................................ 46

- 44 -
Chapter 7, Toolbar

Adding Toolbar to a form

Select the toolbar from the palette and drop it on the Designer.

Adding Controls to Toolbar

Select the controls from the palette and drop them on toolbar in Designer /Outline.

DeletingToolbar

You can delete toolbar from designer/outline. In the designer, select the toolbar and
press the delete key. In the outline, select the toolbar, right click and select “Delete” in
the context menu.

Clipboard operations

You can cut & copy any of the toolbar components and paste them on designer/outline.
You can also re-order toolbar controls in outline.

- 45 -
Chapter 7, Toolbar

Reordering Toolbar controls.

To reorder a toolbar control, select the control and drag and drop it to the new location in
the parent toolbar. The editor will provide a visual feedback in form of insertion line as
shown in the figure below.

- 46 -
Invivosoft

Chapter 8 Include Panels

SwixML include ........................................................................................................... 48


Including a panel ......................................................................................................... 48
Rendering Include panel ............................................................................................. 48
Edit operations ............................................................................................................ 49

- 47 -
Chapter 8, Include Panel

SwixML include

In SwixML, you can include panels defined in a separate swixml file. Such panels which
are defined in other independent files are “Include panels”. An example of an include
panel usage in swixml is -

<panel include="swixml\contact.swx#MyPanel" />

The include attribute specifies the relative path of the file defining the include panel
followed by a ‘#’ followed again by the name attribute of the include panel. In the
example above, the relative path of the file is “swixml\contact.swx” and the name
attribute of the include panel to be included is “MyPanel”

Including a panel

To add an include panel, drag and drop the Panel from the palette to the desired location
on the form. Navigate to the properties pane and edit the “include” property. Add the path
and the name of the include panel in the property value.

Rendering Include panel

SwixEditor faithfully renders the contents of an include panel as if they were defined in
the same form (100% WYSIWYG). All the contents of the include panel are rendered in
the designer form. The contents of the include panel (controls defined in include panel)
are not editable in the designer. To edit the include panel contents you will have to open
the file defining include panel separately and edit its contents.

If the designer does not find the include file or the panel with the given name attribute,
then it displays an error message in the include panel area, as shown for the selected
panel in the figure below.

- 48 -
Chapter 8, Include Panel

Edit operations

An include panel can be deleted, moved, copied-and-pasted as any other


normal panel in the designer.

The contents of the include panel are not selectable.

The contents of the include panel are not shown in the Form Element Browser
(tree view).

- 49 -
Invivosoft

Chapter 9 TabbedPanes

Designer representation............................................................................................ 51
Editing Operations...................................................................................................... 51
Adding Components .............................................................................................. 51
Deleting Components ............................................................................................ 51
Fronting a tab page (component) ........................................................................ 51
Re-ordering tab-pages (components) ................................................................. 52
Changing the title of a tab-page............................................................................... 52

- 50 -
Chapter 9, TabbedPane

Designer representation
A component in a tabbedpane is represented in designer by two selectable parts – The
actual component and the tab-header for the component. The tab-header shows the title /
icon for the component in tabbedpane.

In the two figures below, the first one shows the Table component selection, while the
second one shows the tab-header for the table component selected.

Editing Operations
Adding Components

Select a component from the palette and drop it onto Tabbedpane in the designer.

Deleting Components

Select the component in designer and press Delete, or select the component in Form
Element Browser and select “Delete” in the context menu.

Fronting a tab page (component)

The tabbed-pane will display only one component at a time (the fronted component), to
front a different component, you can do one of the following –

Double click on the tab header, or

- 51 -
Chapter 9, TabbedPane

Select the tab-page in the Form Element Browser (tree view).

Re-ordering tab-pages (components)

To re-order the tab-pages, select the tab-header and drag it to the new position in the
tabbedpane.

Or select the component in the Form Element Browser (tree) and move it to the new
position to re-order it in the list of components (tab pages).

Changing the title of a tab-page


You can change the title of a tab-page in one of the following ways –

Select the tab-header, and press “F2”. This will post the direct-edit text box. You
can enter the new title in the direct-edit text box.

Select the TabbedPane and edit the “Titles” property in the property editor.

- 52 -
Invivosoft

Chapter 10 SplitPane

Add Components to SplitPane: ................................................................................... 54


Setting dividerlocation and dividersize properties: ...................................................... 55
Setting Orientation ...................................................................................................... 56
SplitPane in the Form Element Browser ..................................................................... 56
Deleting components from a SplitPane:...................................................................... 56

- 53 -
Chapter 10, Splitpane

SplitPane is a Container in which we can place two components. These components may
be either other containers or individual components. SplitPane has two orientations :
Horizontal Split and Vertical Split. When the SplitPane’s orientation is Horizontal, the
components are separated horizontally. If the orientation is Vertical the components are
separated vertically.

Adding a SplitPane

Select SplitPane from the palette and drop it on the designer.

By default splitpane has Horizontal Split orientation. You can set the orientation of the
splitpane by changing the orientation property in the property editor.

Add Components to SplitPane:

You are allowed to add only 2 components. Those components may be either an
individual component or a container. Select components from the palette and add them to
the SplitPane one by one.

- 54 -
Chapter 10, Splitpane

Setting dividerlocation and dividersize properties:

SplitPane has two properties, dividerLocation and dividerSize, which set the location and
size of the separator between the components.

After setting these two properties the SplitPane looks as follows in the designer:

- 55 -
Chapter 10, Splitpane

Setting Orientation

Upon changing the orientation to “Horizontal_Split” the SplitPane looks as follows:

SplitPane in the Form Element Browser(Outline) :

Deleting components from a SplitPane:

Deletion of components is provided on a SpiltPane through a context menu. Select the


component to be deleted (in designer / outline) and right click on it. A context menu will
appear. Click on ‘Delete’ option, the selected component is deleted from designer and the
outline.

‘Delete’ through designer’s context menu :

- 56 -
Chapter 10, Splitpane

‘Delete’ through outline’s context menu:

- 57 -
Invivosoft

Chapter 11 Custom controls and custom elements

Registering Custom Controls ...................................................................................... 59


Un-registering Custom Controls.................................................................................. 61
Custom Elements........................................................................................................ 61
Un-registering Custom Elements ................................................................................ 63

- 58 -
Chapter 11, Custom Controls

SwixEditor has support for Custom Controls. It provides an interface to register custom
components. Once registered, the custom components will be added to the Palette and
you can drag and drop them onto the form, like any normal swixml control.

Registering Custom Controls

1. Launch Eclipse and navigate to SwixEditor Æ Custom Controls.

2. A “Register Custom Components” dialog will be posted as in the figure below.

3. Using the “Browse” button browse for the jar file that has the custom component(s)
defined. Click the “Add” button to add the selected jar file.

- 59 -
Chapter 11, Custom Controls

4. The jar file will be added to the “Tree View” on the left side of the dialog. Expand the
tree-view to see all the avaliable components and select the component that you want
to register.

5. In the “Tag Name” field on the right side of the dialog, change the default name of
the tag if required. The class path of the component is displayed in the “Class Path”
field.

6. A list of attributes is also displayed in the “Attributes” table. If attributes are to be


added or deleted, it must be done before registering the component. Click the
"Register" button to register the tag. A component cannot be edited once registered.

7. To add additional components, just select them from the “Tree View” and click on
the "Register" button once for each component to be added. Click the "OK" button
once all the components have been added.

8. Close Eclipse - This step is required when new custom components are added.

9. Relaunch Eclipse. Open a new or existing form. In the Palette you will see an entry
for your custom control(s) under Custom Controls.

- 60 -
Chapter 11, Custom Controls

10. If more components are to be added, open the Custom Controls dialog and add them.
You will need to exit Eclipse and launch it again.

Un-registering Custom Controls

Existing custom controls can be un-registered if they are not used or if they are to be
edited.

1. To un-register/remove a component, open the custom controls dialog to see a list of


previously added jar files and registered custom controls.

2. Select the jar while which contains the component to be un-registered.

3. Select the component within the jar tree which needs to be un-registered.

4. Click on “Unregister” to un-register the component.

5. For editing an existing component, it should be un-registered first and then follow the
steps to register it again. Before registering it, all editing needs to be completed. Once
registered a component cannot be edited.

6. Close Eclipse - This step is required when existing components are un-registered.

Existing jar files can be removed using the “delete” context menu on the jar entries in the
Tree View.

Custom Elements

SwixEditor has support for Custom Elements. SwixEditor provides an interface to


register custom elements. Once registered, the custom elements will be added to the
Palette and you can drag and drop them onto components/customcomponents in the Form
Element Browser.

1. Launch Eclipse and navigate to SwixEditor Æ Custom Elements.

- 61 -
Chapter 11, Custom Controls

2. A “Register Custom Elements” dialog will be posted as in the figure below.

3. Click on "Add New" button and add a new custom element in the “Tag Name” field.

4. Add required attributes in the "Attributes" table.

5. Click on "Register" button to register the tag.

6. A new entry with the element name is created in the “Tree View” field. To add
additional elements, click on "Add New" button again and give a tag name and it's
attributes and click on "Register" button. An element cannot be edited once
registered.

7. Once all the elements have been added, click on "Exit".

- 62 -
Chapter 11, Custom Controls

8. Close Eclipse - This step is required when new custom elements are added or existing
elements are deleted.

9. Relaunch Eclipse. Open a new or existing form. In the Palette you will see an entry
for your custom element(s) under Custom Elements.

10. If more elements to be added, open the Custom Elements dialog and add them. You
will need to exit Eclipse and launch it again.

Un-registering Custom Elements

The palette entry for a custom element can be removed by un-registering the custom
element as follows -

1. To remove an element, open the custom elements dialog to see a list of registered
custom elements.

2. Select the element which needs to be removed.

3. Click on “Delete” to remove the component.

4. Close Eclipse - This step is required when existing components are removed.

- 63 -
Invivosoft

Appendix

Feature comparison – Professional and Free version

SwixEditor Free Professional


Features Version Version
Layouts

Border Layout
Opening existing forms with Borderlayout panels Yes Yes
Creating a new panel with Borderlayout Yes Yes
Editing of BorderLayout components Yes Yes
Card Layout
Opening existing forms with Card layout panels Yes Yes
Creating a new panel with Card layout Yes Yes
Editing of Card Layout components Yes Yes
Flow Layout
Opening existing forms with Flow layout panels Yes Yes
Creating a new panel with Flow layout Yes Yes
Editing of Flow Layout components Yes Yes
Re-ordering of Flow Layout components No Yes
Form Layout
Opening existing forms with Form layout panels Yes Yes
Creating a new panel with Form layout No Yes
Editing of Form Layout components No Yes
GridBag Layout
Opening existing forms with GridBag layout panels Yes Yes
Creating a new panel with GridBag layout No Yes
Editing of GridBag Layout components No Yes
Null Layout
Opening existing forms with Null layout panels Yes Yes
Creating a new panel with Null layout Yes Yes
Editing of Null Layout components Yes Yes

- 64 -
Palette
Controls Yes Yes
Containers Yes Yes
Menu Yes Yes
Custom Controls Yes Yes
Custom Elements Yes Yes
Custom Controls

Custom Components
Registration of Custom Components One No Limit
Adding Custom Components in Designer Yes Yes
Custom Elements
Registration of Custom Elements One No Limit
Adding Custom Elements to Components Yes Yes
Properties
Property View Yes Yes
Property Editing
Frame Yes Yes
Containers No Yes
Panel Yes Yes
Components No Yes
Button Yes Yes
Custom Components No Yes
Context Menus

Designer
Cut No Yes
Copy/Paste No Yes
Delete Yes Yes
Undo/Redo Yes Yes
Form Element Broswer (Outline)
Cut No Yes
Copy No Yes
Delete Yes Yes
Others
Adding Menubar in the Form Element Broswer (Outline) No Yes
Adding components to the Toolbar No Yes
Include Panel No Yes
Opening form with include panel No Yes
Creating form with include panel No Yes
Re-ordering of Menubar components No Yes
Re-ordering of Toolbar components No Yes
Moving controls across containers No Yes

- 65 -
Known Problems
KB-1: Undo after deletion does not refresh the tabbed pane.

Performing undo on the deletion of controls from tabbed pane does not refresh the
tabbedpane.

KB-2: Gridbag layout controls are not visible in the designer

After adding several components to a form with Gridbag layout, if one of the components
do not show up in the Designer then the form needs to be enlarged for it to be visible.

KB-3: A Frame with card-layout container cannot be previewed.

If you set the layout of a frame to card-layout, then preview is failing. Preview works fine if
a contained panel is set to cardlayout.

KB-4: List control is rendered as a small dot in the designer.

KB-5: DesktopPane is not supported.

KB-6: Moving components from HBox to VBox, and vice-versa does not work.

KB-7: The title bar of the form shrinks sometimes as compared to the width of the form in the
designer.

KB-8: Preview does not work when custom controls are added to a Form.

KB-9: Properties “field name” and “component orientation” for Menubar and MenuItem are not
represented in the property editor.

KB-10: Color editing (background, border, font color etc) is not functional in this release.

- 66 -

You might also like