construction d'eclipse forms avec la plateforme eclipse

Développement de clients riches : Plateforme Eclipse

Mickaël BARON - 2010 mailto:[email protected] ou mailto:[email protected]

Chapitre 3 : Conception de plugChapitre 3 : Conception de plug--insins

Workbench : Eclipse Forms

2Eclipse Forms - M. Baron - Page

keul

keul

.blo

gspo

t.com

Creative Commons

Contrat Paternité

Partage des Conditions Initiales à l'Identique

2.0 France

http://creativecommons.org/licenses/by-sa/2.0/fr

Licence


keul

keul

.blo

gspo

t.com

Organisation du cours sur le Workbench : Eclipse Forms

Tous les exemples du cours sont disponibles directement à l’adressembaron.developpez.com/eclipse/forms

� FormToolkit

� Form et ScrolledForm

� Agents de placement

� Composants

� ExpandableComposite, Section, PageBook, FormText

� MasterDetailsBlock

� FormEditor


keul

keul

.blo

gspo

t.com

Workbench Eclipse Forms : déroulement du cours

Ceci est une alerte

Ceci est une astuce

� Pédagogie du cours

� Illustration avec de nombreux exemples qui sont disponibles à

l’adresse mbaron.developpez.com/eclipse/forms

� Des bulles d’aide tout au long du cours

� Logiciels utilisés

� Eclipse 3.6 Helios

� Pré-requis

� Connaître la structure d’un plug-ins et savoir créer une extension

� Structure du Workbench


keul

keul

.blo

gspo

t.comWorkbench Eclipse Forms : ressources …

� Des liens sur Eclipse Forms de manière générale

� www.eclipse.org/articles/Article-Forms/article.html

� www.eclipse.org/articles/article.php?file=Article-Forms33/index.html

� www.jdg2e.com/forms/EclipseForms.html

� www.ibm.com/developerworks/opensource/library/os-eclipse-forms

� www.vogella.de/articles/EclipseForms/article.html


keul

keul

.blo

gspo

t.com

Eclipse Forms : Généralités

� L’utilisation des boîtes à outils SWT / JFace ne permet pas,

nativement, d’obtenir des IHMs homogènes

� L’API Eclipse Forms permet d’obtenir des IHMs ressemblant

fortement aux interfaces Web

� Cette API s’appuie sur les composants natifs SWT en les

décorant de telle sorte que tous les composants aient une

apparence identique

� L’API Eclipse Forms fournit également de nouveaux

composants et agents de placement

� L’outil PDE est un exemple d’IHMs à base d’Eclipse Forms

que nous utilisons depuis le début de ces supports de cours


keul

keul

.blo

gspo

t.com

Eclipse Forms : Généralités

� Exemple : IHMs du PDE développées avec Eclipse Forms

Une apparence homogène digne des IHMs du Web


keul

keul

.blo

gspo

t.com

Eclipse Forms : FormToolkit

� Le point de départ de toutes constructions d’IHMs à base

d’Eclipse Forms est l’objet FormToolkit

� Cet objet fournit les fonctionnalités suivantes

� Fabrique de l’ensemble des composants SWT (Button, Label, Text, …)

� Fabrique du composant FormText

� Fabrique de conteneurs (Composite, ExpandableComposite, Form,

ScrolledForm, Section, PageBook)

� Les nouveaux composants ou conteneurs doivent être

construits à partir d’un FormToolkit sous peine de ne pas

obtenir des interfaces homogènes

� Construction d’un objet FormToolkitFormToolkit formtoolkit = new FormToolkit(parent.getD isplay());


keul

keul

.blo

gspo

t.com


� Exemple : HelloWorld avec Eclipse Forms

package eclipse.workbench.eclipseformsexample.views ;

public class HelloWorldPart extends ViewPart {

public HelloWorldPart() {}

public void createPartControl(Composite parent) {FormToolkit toolkit = new FormToolkit(parent.getDisplay());ScrolledForm form = toolkit.createScrolledForm(parent);form.setText("Hello World with Eclipse Forms");

toolkit.decorateFormHeading(form.getForm());}

public void setFocus() {}

}

Classe HelloWorldPart.java du projet eclipseformsexample

Un objet FormToolkit utilisé

comme fabrique des

composants Eclipse Forms

Depuis la version 3.3

possibilité de modifier

l’apparence de l’en-tête


keul

keul

.blo

gspo

t.com


� Exemple : Composants SWT sans FormToolkitpackage eclipse.workbench.eclipseformsexample.views ;

public class NativeSWTPart extends ViewPart {

public NativeSWTPart() {}

public void createPartControl(Composite parent) {FormToolkit toolkit = new FormToolkit(parent.getDispl ay());ScrolledForm form = toolkit.createScrolledForm(parent );form.setText("Native SWT components with Eclipse For ms");toolkit.decorateFormHeading(form.getForm());

GridLayout layout = new GridLayout();layout.numColumns = 2;form.getBody().setLayout(layout);

Label label = new Label(form.getBody(), SWT.NULL);label.setText("Text field label : ");Text text = new Text(form.getBody(), SWT.BORDER);text.setLayoutData(new GridData(GridData.FILL_HORIZONTAL));Button button = new Button(form.getBody(), SWT.CHECK);button.setText("A SWT natif checkbox component in a form");GridData gd = new GridData();gd.horizontalSpan = 2;button.setLayoutData(gd);

}}

Classe NativeSWTPart.java du projet eclipseformsexample

Les composants SWT ne

sont pas construits à

partir de FormToolkit

Nécessitera une

modification du code pour

uniformiser l’apparence


keul

keul

.blo

gspo

t.com


� Exemple : Composants SWT avec FormToolkitpackage eclipse.workbench.eclipseformsexample.views ;

public class NoNativeSWTPart extends ViewPart {

public NoNativeSWTPart() {}

public void createPartControl(Composite parent) {FormToolkit toolkit = new FormToolkit(parent.getDispl ay());ScrolledForm form = toolkit.createScrolledForm(parent );form.setText("FormTookit SWT components with Eclipse Forms");toolkit.decorateFormHeading(form.getForm());


toolkit.createLabel(form.getBody(), "Text field label : ");Text text = toolkit.createText(form.getBody(), "",SWT.BORDER);text.setLayoutData(new GridData(GridData.FILL_HORIZONTAL));Button button = toolkit.createButton(form.getBody(), "A SWT natif checkbox

component in a form", SWT.CHECK);GridData gd = new GridData();gd.horizontalSpan = 2;button.setLayoutData(gd);

}}

Classe NoNativeSWTPart.java du projet eclipseformsexample

Les composants SWT ne

sont construits à partir de

FormToolkit

L’apparence des

interfaces est uniforme


keul

keul

.blo

gspo

t.comEclipse Forms : Form et ScrolledForm

� Les composants Form et ScrolledForm sont généralement

utilisés comme conteneur de plus haut niveau d’une IHM à

base d’Eclipse Forms

� ScrolledForm ajoute en plus la possibilité de gérer des

ascenseurs horizontaux et verticaux quand son contenu est

trop important

� Ces composants sont constitués de deux parties

� Un en-tête (titre, barre de menus, barre d’outils, messages, …)

� Un corps qui est un conteneur pour ajouter d’autres composants

Corps des Forms

En-tête


keul

keul

.blo

gspo

t.comEclipse Forms : Form et ScrolledForm

� Les deux parties d’un composant Form sont accessibles via

les méthodes suivantes

� Composite getHead() : accès au conteneur de l’en-tête

� Composite getBody() : accès au conteneur du corps

� Dans le cas de ScrolledForm, il encapsule un composant

Form qui peut être accessible directement via

� Form getForm() : accès à l’objet Form encapsulé par ScrolledForm

� De cette manière tout ce qui est accessible dans Form

(corps, en-tête, …) peut l’être à partir d’un ScrolledForm


keul

keul

.blo

gspo

t.com

Eclipse Forms : customiser Form et ScrolledForm

� L’en-tête d’un composant Form peut être customisé

Image

personnalisée

Ajout d’un menu

Ajout d’actions

dans la barre

d’outils

Personnalisation de la

zone cliente de l’en-tête

Gestion des

messagesImage adaptée en

fonction de la gravité

du message


keul

keul

.blo

gspo

t.com


� Le composant Form fournit des méthodes spécifiques pour

effectuer la customisation de l’en-tête

� void setText(String text) : modification du titre

� void setImage(Image img) : modification de l’image du titre

� void setHeadClient(Control headClient) : modification de la zone

cliente de l’en-tête

� IToolBarManager getToolBarManager() : accès au gestionnaire de la

boîte à outils

� IMenuManager getMenuManager() : accès au gestionnaire du menu

� void setMessage(String message, int type) : modification du message

(IMessageProvider.WARNING, ERROR, NONE, INFORMATION)

� void addMessageHyperlinkListener(IHyperlinkListener hl) : écouteur

sur le lien du message

� …


keul

keul

.blo

gspo

t.com


� Exemple : Customisation de l’en-tête d’un Formpackage eclipse.workbench.eclipseformsexample.views ;

public class FormCustomizationPart extends ViewPart {

public FormCustomizationPart() {}

public void createPartControl(Composite parent) {FormToolkit toolkit = new FormToolkit(parent.getDispl ay());final ScrolledForm form = toolkit.createScrolledForm( parent);form.setText("Form Customization");toolkit.decorateFormHeading(form.getForm());

form.setHeadClient(toolkit.createButton(form.getForm().getHead(), "This is the head client", SWT.PUSH));

form.setImage(Activator.getDefault().getImageRegistry().get(Activator.TINY_ECLIPSE_LOGO));

form.getForm().getToolBarManager().add(new Action("ToolBar Action",Activator.getDefault().getImageRegistry().getDescriptor(Activator.TINY_ECLIPSE_LOGO)) { });

form.getForm().getToolBarManager().update(true);

// Suite dans le prochain transparent}

}

Classe FormCustomizationPart.java du projet eclipseformsexample

Création d’un bouton

dans la zone client de

l’en-tête


keul

keul

.blo

gspo

t.com


� Exemple (suite) : Customisation de l’en-tête d’un Form

form.getForm().getMenuManager().add(new Action("Men uBar Action",Activator.getDefault().getImageRegistry().getDescri ptor(Activator.TINY_ECLIPSE_LOGO)) { });

form.getForm().getMenuManager().update(true);form.getForm().addMessageHyperlinkListener(new Hype rlinkAdapter() {

public void linkActivated(HyperlinkEvent e) {System.out.println("Link active : " + e.getLabel()) ;form.getForm().setMessage(null);

}});form.getForm().setMessage("This is an error message", IMessageProvider.WARNING);

}}

Classe FormCustomizationPart.java du projet eclipseformsexample

Création de menus à

partir du gestionnaire de

menu

Ajout d’un écouteur sur

le lien du message

Ecriture d’un message

dans l’en-tête


keul

keul

.blo

gspo

t.comEclipse Forms : Composants supportés

� Tous les composants de SWT sont supportés (au sens qui

ne sont pas des conteneurs ni des agents de placement) et

d’autres spécifiques à Eclipse Forms (Hyperlink)

� Button via createButton(…)

� Hyperlink via createHyperlink(…)

� ImageHyperlink via createImageHyperlink(…)

� Label via createLabel(…)

� Text via createText(…)

� Table via createTable(…)

� Tree via createTree(…)


keul

keul

.blo

gspo


� Exemple : Composants supportés package eclipse.workbench.eclipseformsexample.views ;

public class SupportedComponentPart extends ViewPart {

public void createPartControl(Composite parent) {FormToolkit toolkit = new FormToolkit(parent.getDispl ay());

ScrolledForm form = toolkit.createScrolledForm(parent );form.setText("All Eclipse Form Supported Components") ;toolkit.decorateFormHeading(form.getForm());


// Button component with push style.toolkit.createButton(form.getBody(), "Eclipse Form Button", SWT.PUSH);

// Hyperlink component.Hyperlink createHyperlink = toolkit.createHyperlink(form.getBody(), "Eclipse Hyperlink", SWT.WRAP);createHyperlink.setText("Eclipse Form Hyperlink");

// ImageHyperlink component.ImageHyperlink createImageHyperlink = toolkit.createImageHyperlink(form.getBody(), SWT.WRAP);createImageHyperlink.setText("Eclipse Form ImageHyperlink");createImageHyperlink.setImage(Activator.getDefault().getImageRegistry().get(Activator.ECLIPSE_LOGO));

// Suite dans le prochain transparent}

}

Classe SupportedComponentPart.javadu projet eclipseformsexample

Utilisation de fabriques

pour construire des

objets SWT


keul

keul

.blo

gspo


� Exemple (suite) : Composants supportés

// Label component.toolkit.createLabel(form.getBody(), "Eclipse Form Label");

// Text component.toolkit.createText(form.getBody(), "Eclipse Form Text", SWT.BORDER);

// Table component.Table createTable = toolkit.createTable(form.getBody(), SWT

.FULL_SELECTION);createTableViewer(createTable);

// Tree component.Tree myTree = toolkit.createTree(form.getBody(), SWT.FULL_SELECTION);createTreeViewer(myTree);

}

private void createTreeViewer(Tree myTree) {final TreeViewer treeViewer = new TreeViewer(myTree);...

}

private void createTableViewer(Table createTable) {final TableViewer viewer = new TableViewer(createTable);...

}}

Utilisation des Viewers à partir des composants

natifs pour ajouter une touche Modèle / Vue

Classe SupportedComponentPart.javadu projet eclipseformsexample


keul

keul

.blo

gspo

t.comEclipse Forms : Agents de placement

� Lors de l’agencement des interfaces à base d’Eclipse Forms,

il est possible d’employer les agents de placement SWT

� De façon à fournir une apparence Web deux nouveaux

agents de placement ont été ajoutés

� TableWrapLayout : il s’agit d’un GridLayout avec possibilité de

retour à la ligne du contenu quand la place est manquante

� ColumnLayout : il s’agit d’un RowLayout qui agence des composants

uniquement en colonne dans la mesure du possible

� Ces nouveaux agents de placement peuvent être utilisés

en dehors d’interfaces Eclipse Forms, pour du « pur » SWT

La modification de l’agent de placement d’un composant Form (Form et ScrolledForm) doit se

faire à partir du corps form.getBody().setLayout(…)


keul

keul

.blo

gspo

t.com

Eclipse Forms : TableWrapLayout

� L’agent de placement TableWrapLayout se comporte comme GridLayout

� Il permet en plus le retour à la ligne du contenu quand

l’espace client se réduit à la manière d’une page HTML

� Il contrôle une grille avec la possibilité de fusionner des

cellules et de contraindre ou pas la largeur des cellules

� TableWrapLayout() : une grille avec une colonne et les colonnes n’auront pas la même taille

� Paramétrages après sa construction

� int numColumns : nombre de colonne

� int horizontalSpacing et verticalSpacing : espace horizontal et

vertical entre les cellules

� int leftMargin, rightMargin, topMargin et bottomMargin : espace sur

les bords du conteneur


keul

keul

.blo

gspo

t.com


� Possibilité de contraindre chaque composant par un objet

de type TableWrapData

� TableWrapData(int align, int valign) : construit avec un style spécifié

pour alignement horizontal (align) et l’alignement vertical (valign)

� TableWrapData peut être paramétré après sa construction

� int colspan : nombre de colonne occupé

� int rowspan : nombre de ligne occupée

� Les différentes constantes utilisées

� LEFT, CENTER, RIGHT, FILL et FILL_GRAB : utilisées pour

l’alignement horizontal

� TOP, MIDDLE, BOTTOM, FILL et FILL_GRAB : utilisées pour

l’alignement vertical

L’alignement horizontal et vertical doit être

précisé à la construction


keul

keul

.blo

gspo

t.com


� Exemple : TableWrapLayout en action

Lors de la réduction de la largeur de la vue,

le contenu de chaque label est

automatiquement mise en forme

Classe TableWrapLayoutPart.java du projet eclipseformsexample


keul

keul

.blo

gspo

t.com


� Exemple (suite) : TableWrapLayout en action package eclipse.workbench.eclipseformsexample.views ;

public class TableWrapLayoutPart extends ViewPart {public void createPartControl(Composite parent) {

FormToolkit toolkit = new FormToolkit(parent.getDispl ay());

ScrolledForm form = toolkit.createScrolledForm(parent );form.setText("TableWrapLayout Layout Example");toolkit.decorateFormHeading(form.getForm());

TableWrapLayout layout = new TableWrapLayout();layout.verticalSpacing = 25;form.getBody().setLayout(layout);

layout.numColumns = 3;Label label;TableWrapData td;

label = toolkit.createLabel(form.getBody(), "What ha ppened? Remember that we are ...", SWT. WRAP);td = new TableWrapData();td.colspan = 3;label.setLayoutData(td);

...}

}

Classe TableWrapLayoutPart.java du projet eclipseformsexample

Création de l’agent de placement

TableWrapLayout

TableWrapData fournit des paramètres de TableWrapLayout

spécifique à label


keul

keul

.blo

gspo

t.com

Eclipse Forms : ColumnLayout

� L’agent de placement ColumnLayout se comporte comme

RowLayout

� Il permet d’agencer des composants uniquement en colonne

dans la mesure du possible

� Si pas assez de place débordement sur une nouvelle ligne

� Il contrôle le nombre de colonne minimum et maximum qui

peut être créé

� ColumnLayout() : création d’un ColumnLayout avec une colonne

minimum et trois colonnes maximums

� Paramétrages après sa construction

� int minNumColumns : nombre de colonne minimum

� int maxNumColumns : nombre de colonne maximum


keul

keul

.blo

gspo

t.com


� Exemple : ColumnLayout en action package eclipse.workbench.eclipseformsexample.views ;

public class ColumnLayoutPart extends ViewPart {public void createPartControl(Composite parent) {


ScrolledForm form = toolkit.createScrolledForm(parent );form.setText("TableWrapLayout Layout Example");toolkit.decorateFormHeading(form.getForm());

ColumnLayout layout = new ColumnLayout();layout.minNumColumns = 1;layout.maxNumColumns = 2;form.getBody().setLayout(layout);

Label label;ColumnLayoutData cld = new ColumnLayoutData();

label = toolkit.createLabel(form.getBody(), "First Content used to demonstrate ColumnLayout", SWT.WRAP);

label.setLayoutData(cld);

label = toolkit.createLabel(form.getBody(),"Second Content used to demonstrate ColumnLayout", SW T.WRAP);

label = toolkit.createLabel(form.getBody(), "Third Content used to d emonstrate ColumnLayout", SWT.WRAP);

cld = new ColumnLayoutData();label.setLayoutData(cld);

}}

Classe ColumnLayoutPart.java du projet eclipseformsexample

1 colonne minimum et 2

colonnes maximum


keul

keul

.blo

gspo

t.com


� Exemple (suite) : ColumnLayout en action

Espace suffisante pour

créer 2 colonnes

Espace insuffisant pour

créer 2 colonnes

Même si l’espace est suffisant, la

troisième colonne n’est pas créée


keul

keul

.blo

gspo

t.comEclipse Forms : ExpandableComposite

� Le composant ExpandableComposite permet de réduire ou

déplier un composant de manière à masquer la complexité

de grandes interfaces

Le composant

ExpandableComposite est constitué d’un titre

Une icône pour le rendu qui

indique si le composant est en

mode réduit ou déplié

Lorsque le composant

ExpandableComposite est déplié, le composant client est

affiché (Control ou Composite)


keul

keul

.blo

gspo


� Un composant ExpandableComposite se construit

� ExpandableComposite createExpandableComposite(Composite c, int

style) : création à partir d’un objet Toolkit

� TWISTIE et TREE_NODE : icône pour le rendu qui indique si l’état

réduit ou déplié

� CLIENT_INDENT : indentation par rapport au titre

� EXPANDED : dans l’état déplié à la construction

� NO_TITLE : pas de titre

� Des méthodes pour modifier son comportement

� void setText(String p) : modifie le titre

� void setClient(Control client) : modifie le composant client

� void addExpansionListener(IExpansionListener list) : ajout d’un

listener pour être informé du changement d’état (réduit ou déplié)


keul

keul

.blo

gspo


� Exemple : ExpandableComposite en action package eclipse.workbench.eclipseformsexample.views ;

public class ExpandableCompositePart extends ViewPart {public void createPartControl(Composite parent) {


final ScrolledForm form = toolkit.createScrolledForm( parent);form.setText("Expandable Composite Example");toolkit.decorateFormHeading(form.getForm());

TableWrapLayout layout = new TableWrapLayout();form.getBody().setLayout(layout);

ExpandableComposite ec = toolkit.createExpandableComposite(form.getBody(), ExpandableComposite.CLIENT_INDENT | ExpandableComposite.TREE_NODE);

ec.setText("This is the first Expandable composite title");

Composite expandableClient = toolkit.createComposite (ec);expandableClient.setLayout(new GridLayout());toolkit.createButton(expandableClient, "Radio 1", S WT.RADIO);toolkit.createButton(expandableClient, "Radio 2", S WT.RADIO);

ec.setClient(expandableClient);ec.addExpansionListener(new ExpansionAdapter() {

public void expansionStateChanged(ExpansionEvent e) {form.reflow(true);

}});

}}

Classe ExpandableCompositePart.javadu projet eclipseformsexample

Création d’un

ExpandableCompositeavec un style particulier


keul

keul

.blo

gspo

t.com

Eclipse Forms : Section

� Le composant Section se comporte comme le composant

ExpandableComposite en ajoutant

� une description au dessous du titre

� une titre avec une apparence différente

Le composant Section est constitué d’un titre décoré

Le composant Section est constitué d’un composant

description (Control)

Lorsque le composant Section est déplié, le

composant client est affiché (Control ou Composite)


keul

keul

.blo

gspo

t.com

Eclipse Forms : Section

� Exemple : Section en action package eclipse.workbench.eclipseformsexample.views ;

public class SectionCompositePart extends ViewPart {public void createPartControl(Composite parent) {


final ScrolledForm form = toolkit.createScrolledForm( parent);form.setText("Section Composite Example");toolkit.decorateFormHeading(form.getForm());

TableWrapLayout layout = new TableWrapLayout();form.getBody().setLayout(layout);

Section section = toolkit.createSection(form.getBody(),Section.DESCRIPTION | Section.TITLE_BAR | Section.TWISTIE

| Section.EXPANDED);TableWrapData td = new TableWrapData(TableWrapData.F ILL_GRAB);section.setLayoutData(td);

section.setText("Section title");section

.setDescription("This is the description that goes bel ow the title");

Composite sectionClient = toolkit.createComposite(se ction);sectionClient.setLayout(new GridLayout());toolkit.createButton(sectionClient, "Radio 1", SWT. RADIO);toolkit.createButton(sectionClient, "Radio 2", SWT. RADIO);section.setClient(sectionClient);

}}

Classe SectionCompositePart.java du projet eclipseformsexample

Si style DESCRIPTION est précisé,

une zone pour une description est

prévue sous le titre


keul

keul

.blo

gspo

t.com

Eclipse Forms : PageBook

� Le composant PageBook permet d’empiler plusieurs pages

(Composite) et de choisir celle qui sera visible

� Ce composant est décrit par la classe ScrolledPageBook

� Chaque page est un Composite qui peut contenir

directement des objets Control ou des objets Composite

� Différents méthodes pour son utilisation

� Composite createPage(Object key) : création d’une page identifiée

par key

� Control getCurrentPage() : récupère la page en cours

� void showPage(Object key) : affiche la page identifié par key


keul

keul

.blo

gspo

t.com


� Exemple : PageBook en action package eclipse.workbench.eclipseformsexample.views ;

public class PageBookPart extends ViewPart {public void createPartControl(Composite parent) {


final ScrolledForm form = toolkit.createScrolledForm( parent);form.setText("PageBook Composite Example");toolkit.decorateFormHeading(form.getForm());

TableWrapLayout layout = new TableWrapLayout();layout.numColumns = 2;layout.topMargin = 0;form.getBody().setLayout(layout);

final ScrolledPageBook pageBook = toolkit.createPageBook(form.getBody(), SWT.BORDER);

Composite page1 = pageBook.createPage("page 1");page1.setLayout(new GridLayout());Composite sectionClient1 = toolkit.createComposite( page1);sectionClient1.setLayout(new GridLayout());toolkit.createButton(sectionClient1, "Radio 1", SWT .RADIO);toolkit.createButton(sectionClient1, "Radio 2", SWT .RADIO);GridData layoutData = new GridData(GridData.FILL_BOTH );sectionClient1.setLayoutData(layoutData);

... // Suite dans le prochain transparent.}

}

Classe PageBookPart.java du projet eclipseformsexample

Création d’un composant

ScrolledPageBook


keul

keul

.blo

gspo

t.com


� Exemple (suite) : PageBook en action package eclipse.workbench.eclipseformsexample.views ;

public class PageBookPart extends ViewPart {public void createPartControl(Composite parent) {

// Suite du précédent transparent

Composite page2 = pageBook.createPage("page 2");page2.setLayout(new GridLayout());Composite sectionClient2 = toolkit.createComposite( page2);sectionClient2.setLayout(new GridLayout());toolkit.createButton(sectionClient2, "Radio 1", SWT .CHECK);toolkit.createButton(sectionClient2, "Radio 2", SWT .CHECK);layoutData = new GridData(GridData.FILL_BOTH);sectionClient2.setLayoutData(layoutData);

TableWrapData td = new TableWrapData(TableWrapData.F ILL_GRAB);td.heightHint = 80;td.colspan = 2;pageBook.setLayoutData(td);

pageBook.showPage("page 1");

final Button createButton = toolkit.createButton(form .getBody(), "Show Page 1", SWT.FLAT);createButton.addSelectionListener(new SelectionAdap ter() {

public void widgetSelected(SelectionEvent e) { pageBook.showPage("page 1"); }

});final Button createButton2 = toolkit.createButton(fo rm.getBody(), "Show Page 2", SWT.FLAT);createButton2.addSelectionListener(new SelectionAda pter() {

public void widgetSelected(SelectionEvent e) { pageBook.showPage("page 2"); }

});}

}

Classe PageBookPart.java du projet eclipseformsexample

A l’ouverture de la vue, la page

identifiée par « page 1 » sera visible


keul

keul

.blo

gspo

t.com

Eclipse Forms : FormText

� Nous avons vu précédemment que pour créer du contenu texte avec des liens hypertextes, on utilisait une combinaison d’objets Label et Hyperlink

� Cela peut devenir assez contraignant de manipuler des composants SWT (répétition et lourdeur du code)

� Le composant FormText permet de résoudre en offrant

� Un rendu de texte (avec retour automatique à la ligne)

� Une gestion automatique des liens hypertextes (tout mot débutant par http:// est désigné comme URL)

� Une prise en compte des balises proches du HTML

� Le point d’entrée du composant FormText reste du texte

� void setText(String text, boolean parseTags, boolean expandURLS) : le contenu à afficher est défini dans text. Si parseTags vaut TRUEles balises dans text sont prises en compte. Si expandURLS vaut TRUE la gestion automatique des liens hypertextes est activée


keul

keul

.blo

gspo

t.com


� FormText peut traiter du contenu XML dont la balise racine

doit être form

� Les balises suivantes peuvent être enfants de form

� p : définit un paragraphe, l’attribut suivant est autorisé

� vspace : si true espace vertical ajouté, si false pas d’espace

� li : définit des listes d’élément, les attributs suivants sont autorisés

� vspace : si true espace vertical ajouté, si false pas d’espace

� style : le style de la puce bullet, text ou image

� value : valeur pour le style uniquement pour text et image

� indent : espace en pixel pour indenter le texte après la puce

� bindent : espace en pixel pour indenter la puce


keul

keul

.blo

gspo

t.com


� Des sous balises à p et li peuvent être utilisées

� img : afficher une image, l’attribut suivant est autorisé

� href : référence de l’image (voir transparent suivant)

� align : alignement de l’image par rapport au texte. Les valeursautorisées sont top, middle et bottom

� a : afficher un lien, les attributs suivant sont autorisés

� href : lien hypertexte envoyé à l’événement

� nowrap : si true le lien peut être coupé

� b et br : pour afficher le texte en gras et retour à la ligne

� span : spécifie couleur et fonte du texte

� color : référence de la couleur (voir transparent suivant)

� font : référence de la fonte (voir transparent suivant)

� nowrap : si true le texte peut être coupé

� control : pour ajouter un control SWT (FormText étant le parent)

� href : référence au control (voir transparent suivant)


keul

keul

.blo

gspo

t.com


� La particularité du composant FormText est de dissocier la

définition des ressources (Image, Couleur et Fonte) de la

structure de la page

� La définition est réalisée par directement par l’API de

FormText ce qui permet d’utiliser des ressources déjà

définies dans le Workbench

� void setImage(String key, Image img) : création d’une référence

d’une image identifiée par key

� void setFont(String key, Font font) : création d’une référence d’une

fonte identifiée par key

� void setColor(String key, Color color) : création d’une référence

d’une couleur identifiée par key

� void setControl(String key, Control control) : création d’une

référence sur un Control SWT identifiée par key

keul

keul

.blo

gspo

t.com


� Exemple : FormText en action

Tout ce contenu est défini

dans un texte décoré de

balises HTML

<form>Here is some plain text for the text to render; this t ext is at <a href=\"http://www.eclipse.org\" nowrap=\"true\">http://www.eclipse.org</a> web site .

 This text is in header font and color.

This line will contain some bold and some <sp an font=\"code\">source text. We can also add<img href=\"image\"/> an image.

<li>A default (bulleted) list item.</li><li>Another bullet list item.</li><li style=\"text\" value=\"1.\">A list item with text .</li><li style=\"text\" value=\"2.\">Another list item wit h text</li><li style=\"image\" value=\"image\">List item with a n image bullet</li><li style=\"text\" bindent=\"20\" indent=\"40\" val ue=\"3.\"> A list item with text.</li><li style=\"text\" bindent=\"20\" indent=\"40\" val ue=\"4.\"> A list item with text.</li> leading blanks; more white \n\n new line s \n more bb white . </form>

Utilisation d’une fonte et

d’une couleur spécifiques

Ajout de liens hypertextes

Des puces qui peuvent prendre

des apparences différentes

keul

keul

.blo

gspo

t.com


� Exemple (suite) : FormText en actionpackage eclipse.workbench.eclipseformsexample.views ;

public class FormTextPart extends ViewPart {public void createPartControl(Composite parent) {

...StringBuffer buf = new StringBuffer();buf.append("<form>");buf.append("Here is some plain text for the text to r ender; ");buf.append("this text is at <a href=\"http://www.eclips e.org\" "

+ "nowrap=\"true\">http://www.eclipse.org</a> web s ite.");buf.append("");buf.append(""

+ "This text is in header font and color." );buf.append("This line will contain some bold and "

+ "some source text. ");buf.append("We can also add <img href=\"image\"/> an image.");buf.append("<li>A default (bulleted) list item.</li> ");buf.append("<li>Another bullet list item.</li>");buf.append("<li style=\"text\" value=\"1.\">A list i tem with text.</li>");buf.append("<li style=\"text\" value=\"2.\">Another list item with text</li>");buf.append("<li style=\"image\" value=\"image\">Lis t item with an image bullet</li>");buf.append("<li style=\"text\" bindent=\"20\" inden t=\"40\" value=\"3.\">"

+ "A list item with text.</li>");buf.append("<li style=\"text\" bindent=\"20\" inden t=\"40\" value=\"4.\">"

+ "A list item with text.</li>");buf.append(" leading blanks; more white \n\n new "

+ "lines \n more bb white . ");buf.append("</form>");

// Suite dans le prochain transparent.}

}

Classe FormTextPart.java du projet eclipseformsexample

La fonte identifiée par

header est référencée dans la suite


keul

keul

.blo

gspo

t.com


� Exemple (suite) : FormText en action



// Suite du précédent transparent FormText formText = toolkit.createFormText(form.getBo dy(), true);formText.setWhitespaceNormalized(false);

formText.setImage("image", Activator.getDefault().getImageRegistry().get(Activator.TINY_ECLIPSE_LOGO));

formText.setColor("header", toolkit.getColors().getColor(IFormColors .TITLE));

formText.setFont("header", JFaceResources.getHeaderFont());formText.setFont("code", JFaceResources.getTextFont());

formText.setText(buf.toString(), true, false);

formText.addHyperlinkListener(new HyperlinkAdapter( ) {public void linkActivated(HyperlinkEvent e) {

System.out.println("Link active: " + e.getHref());}

});}

}


Les espaces « enchainés » ne

sont pas pris en comptes

Création d’une référence

Image identifiée par image

Création d’une référence

Color identifiée par header

Création de références

Font identifiées par header et code

Ajout d’un écouteur sur les liens

hypertextes découverts par FormText


keul

keul

.blo

gspo

t.com


� Exemple : FormText et la gestion des espaces



...FormText formText = toolkit.createFormText(form.getBo dy(), true);formText.setWhitespaceNormalized(true);...

}}


Prise en compte des

espaces successifs

keul

keul

.blo

gspo

t.com


� Exemple : FormText et l’intégration d’objets Control SWTpackage eclipse.workbench.eclipseformsexample.views ;

public class FormTextWithSWTControlPart extends ViewP art {public void createPartControl(Composite parent) {

...StringBuffer buf = new StringBuffer();buf.append("<form>");buf.append("");buf.append("Here is some plain text for the text to rend er; ");buf.append("this text is at <a href=\"http://www.eclips e.org\" "

+ "nowrap=\"true\">http://www.eclipse.org</a> web s ite."+ "<control href=\"mybutton\"/>");

buf.append("<control href=\"mytable\"/>");buf.append("");buf.append("</form>");

FormText formText = toolkit.createFormText(form.getBo dy(), true);formText.setWhitespaceNormalized(false);

Button myButton = new Button(formText, SWT.FLAT);myButton.setText("Bonjour");formText.setControl("mybutton", myButton);

Table createTable = toolkit.createTable(formText, SWT.FULL_SELECTION);createTableViewer(createTable);formText.setControl("mytable", createTable);

formText.setText(buf.toString(), true, false);}

}

Classe FormTextWithSWTControlPart.javadu projet eclipseformsexample

Construction des

deux objets Controldont le parent est

FormText

FormText ne gère pas la destruction des objets

Control (dispose)

Dans le contenu

texte, liaison avec

deux objets Control


keul

keul

.blo

gspo

t.com

Eclipse Forms : MasterDetailsBlock

� Le composant MasterDetailsBlock est un patron de conception

orienté graphique qui permet de séparer un objet Form en

deux parties

� Master : un composant Viewer offrant une sélection (ListViewer,

TableViewer, TreeViewer, …)

� Details (DetailsPart) : un ensemble de propriétés (affichées par des

composants SWT) qui réagit à la sélection du Master

� La partie Details est composé d’un ensemble de DetailsPage

� Le choix de la DetailsPage est fonction de l’élément sélection-

né dans la partie Master

� Les parties Master et Details sont contenues dans un

SashForm permettant à l’utilisateur de modifier la taille de

chaque partie


keul

keul

.blo

gspo

t.com


Partie Master

Partie Details (DetailsPart)

Des actions peuvent être définies

spécifiquement pour le MasterDetailsBlock

A chaque modification de sélection de la partie

Master, choix de la DetailsPage et modification de son contenu


keul

keul

.blo

gspo

t.com


� Un composant MasterDetailsBlock est défini par la classe

abstraite MasterDetailsBlock

� Trois méthodes doivent être implémentées

� void createMasterPart(IManagedForm mf, Composite parent) :

construction de l’IHM de la partie Master

� void createToolBarActions(IManagedForm mf) : ajout des actions

spécifiques pour le MasterDetailsBlock

� void registerPages(DetailsPart detailsPart) : ajout de nouveaux

objets DetailsPages dans le DetailsPart

� Le composant MasterDetailsBlock nécessite l’utilisation d’un

objet IManagedForm

� IManagedForm encapsule un composant Form et lui ajoute

des méthodes pour gérer son cycle de vie


keul

keul

.blo

gspo

t.com


� Exemple : Initialiser un composant MasterDetailsBlock


public class MasterDetailsBlockPart extends ViewPart {

public MasterDetailsBlockPart() {}

@Overridepublic void createPartControl(Composite parent) {

FormToolkit toolkit = new FormToolkit(parent.getDispl ay());ScrolledForm form = toolkit.createScrolledForm(parent );form.setText("MasterDetails block Example");toolkit.decorateFormHeading(form.getForm());

MyMasterDetailsBlock refMasterDetailsBlock = new MyMa sterDetailsBlock();ManagedForm refManagedForm = new ManagedForm(toolkit, form);refMasterDetailsBlock.createContent(refManagedForm);

}

@Overridepublic void setFocus() {}

}

Classe MasterDetailsBlockPart.java du projet eclipseformsexample

Construction d’un

MasterDetailsBlock (voir implémentation dans la suite)

Construction d’un ManagedFormà partir d’un Form

Associer le ManagedForm au

MasterDetailsBlock


keul

keul

.blo

gspo

t.com


� Exemple (suite) : Construire l’IHM de la partie Masterpackage eclipse.workbench.eclipseformsexample.views ;

public class MyMasterDetailsBlock extends MasterDetai lsBlock {protected void createMasterPart(final IManagedForm man agedForm, Composite parent) {

FormToolkit toolkit = managedForm.getToolkit();Section section = toolkit.createSection(parent, Sect ion.DESCRIPTION | Section.TITLE_BAR);section.setText("Persons");section.setDescription("The list contains objects from the model whose details are ...");

Composite client = toolkit.createComposite(section, SWT.WRAP);Table t = toolkit.createTable(client, SWT.FULL_SELE CTION);...toolkit.paintBordersFor(client);section.setClient(client);

final SectionPart spart = new SectionPart(section);managedForm.addPart(spart);viewer = new TableViewer(t);viewer.addSelectionChangedListener(new ISelectionChangedListener() {

public void selectionChanged(SelectionChangedEvent event) {managedForm.fireSelectionChanged(spart, event.getSelection());

}});viewer.setContentProvider(new MyStructuredContentPr ovider());viewer.setLabelProvider(new MyTableLabelProvider()) ;viewer.setInput(...);

}...

}

Classe MyMasterDetailsBlock.java du projet eclipseformsexample

Création d’une SectionPart pour être gérée par ManagedForm

A chaque changement de la

sélection, la SelectionPart est notifiée


keul

keul

.blo

gspo

t.com


� Exemple (suite) : Ajouter des actionspackage eclipse.workbench.eclipseformsexample.views ;

public class MyMasterDetailsBlock extends MasterDetai lsBlock {... Suite du précédent transparent.

protected void createToolBarActions(IManagedForm manag edForm) {final ScrolledForm form = managedForm.getForm();Action haction = new Action("hor", Action.AS_RADIO_B UTTON) {

public void run() {sashForm.setOrientation(SWT.HORIZONTAL);form.reflow(true);

}};haction.setToolTipText("Horizontal Orientation");haction.setImageDescriptor(Activator.getDefault().g etImageRegistry()

.getDescriptor(Activator.IMG_HORIZONTAL));Action vaction = new Action("ver", Action.AS_RADIO_B UTTON) {

public void run() {sashForm.setOrientation(SWT.VERTICAL);form.reflow(true);

}};vaction.setToolTipText("Vertical Orientation");vaction.setImageDescriptor(Activator.getDefault().g etImageRegistry()

.getDescriptor(Activator.IMG_VERTICAL));form.getToolBarManager().add(haction);form.getToolBarManager().add(vaction);

}...

}


Ajout des actions au

ManagedForm


keul

keul

.blo

gspo

t.com


� Exemple (suite) : Ajouter des DetailsPage


public class MyMasterDetailsBlock extends MasterDetai lsBlock {... Suite du précédent transparent.

protected void registerPages(DetailsPart detailsPart) {detailsPart.registerPage(TablePerson.class, new MyDetailsPage(viewer));

}}


Quand l’élément sélectionné est de type

TablePerson la page MyDetailsPage sera affichée dans la partie Details du

composant MasterDetailsBlock


keul

keul

.blo

gspo

t.com


� Un DetailsPage est utilisé pour construire les interfaces

utilisateur de la partie Details

� Pour rappel la partie Details est composé d’un ensemble de

DetailsPage

� Un DetailsPage est défini par l’interface IDetailsPage

� void initialize(IManagedForm form) : appelée lors de la construction d’un

objet IDetailsPage et permet de stocker un objet IManagedForm

� void createContents(Composite parent) : construction de l’IHM

� void selectionChanged(IFormPart part, ISelection selection) : appelée quand

la partie Master a notifié d’un changement

� La notification du changement est réalisée par la méthode

fireSelectionChanged(IFormPart, ISelection) d’un objet IManagedForm


keul

keul

.blo

gspo

t.com


� Exemple (suite) : Création d’un DetailsPagepackage eclipse.workbench.eclipseformsexample.views ;

public class MyDetailsPage implements IDetailsPage {...public void createContents(Composite parent) {

FormToolkit toolkit = mform.getToolkit();Section s1 = toolkit.createSection(parent, Section. DESCRIPTION | Section.TITLE_BAR);s1.setText("Person Edit Details");s1.setDescription("Set the properties of the selecte d Person object.");...tabText = new Text[4];tabText[0] = addNewLabelText(client, "Name", new Mo difyListener() {

public void modifyText(ModifyEvent e) {input.setName(tabText[0].getText());ref.refresh(input);

}});...toolkit.paintBordersFor(s1);s1.setClient(client);

}private Text addNewLabelText(Composite client, String name, ModifyListener ref) {

FormToolkit toolkit = mform.getToolkit();toolkit.createLabel(client, name);Text text = toolkit.createText(client, "", SWT.SINGLE ); //$NON-NLS-1$text.addModifyListener(ref);GridData gd = new GridData(GridData.FILL_HORIZONTAL | GridData.VERTICAL_ALIGN_BEGINNING);gd.widthHint = 10;text.setLayoutData(gd);createSpacer(toolkit, client, 10);return text;

}... // Suite dans le prochain transparent.

}

Classe MyDetailsPage.java du projet eclipseformsexample

Cette méthode est utilisée pour

construire l’IHM de la DetailsPage

Chaque modification de l’IHM

impacte la partie modèle


keul

keul

.blo

gspo

t.com


� Exemple (suite) : Création d’un DetailsPagepackage eclipse.workbench.eclipseformsexample.views ;

public class MyDetailsPage implements IDetailsPage {... // Suite du précédent transparent.

public void initialize(IManagedForm form) {this.mform = form;

}

public void selectionChanged(IFormPart part, ISelecti on selection) {IStructuredSelection ssel = (IStructuredSelection) se lection;if (ssel.size() == 1) {

input = (TablePerson)ssel.getFirstElement();} else {

input = null;}update();

}

private void update() {tabText[0].setText(input.getName());tabText[1].setText(input.getFirstName());tabText[2].setText(input.getSportName());tabText[3].setText(Integer.toString(input.getOld()) );flag.setSelection(input.isVegetarian());

}

... // D’autres méthodes qui sont implémentées à vid e.}

Classe MyDetailsPage.java du projet eclipseformsexample

Cette méthode est appelée, lors

de la modification de la sélection

de la partie Master

L’objet de la sélection de

type TablePerson est

conservé

Tous les éléments graphiques sont mis

à jour en fonction de nouvelles valeurs

contenues dans la sélection courante


keul

keul

.blo

gspo

t.comEclipse Forms : Multi-page FormEditor

� Un composant FormEditor permet d’ajouter des Forms dans un MultiPageEditorPart

� Pour rappel un MultiPageEditorPart est un éditeur avec plusieurs pages où chaque page peut contenir

� un éditeur (EditorPart) ou

� un composant SWT

� Un FormEditor permet d’ajouter des FormPage ayant le

comportement d’un EditorPart mais supportant les Forms

Une page contenant un éditeur dont le contenu est représenté

via des Forms


keul

keul

.blo

gspo


� Exemple : Créer un FormEditor avec deux pages

public class SimpleFormEditor extends FormEditor {

public SimpleFormEditor() {}

protected void addPages() {try {

this.addPage(new FirstFormPage(this));this.addPage(new SecondFormPage(this));

} catch (PartInitException e) {e.printStackTrace();

}}

public void doSave(IProgressMonitor monitor) {}

public void doSaveAs() {}

public boolean isSaveAsAllowed() {return false;

}}

Classe SimpleFormEditor.java du projet eclipseformsexample

Un FormEditor se comporte comme un MultiPageEditorPart.

Des informations supplémentaires sont disponibles dans le support de

cours sur les éditeurs

Deux pages ont été ajoutées au FormEditor


keul

keul

.blo

gspo


� Exemple (suite) : Créer un FormEditor avec deux pagespublic class FirstFormPage extends FormPage {

public FirstFormPage(FormEditor f) {super(f, "first","FirstPage");

}

protected void createFormContent(IManagedForm managedF orm) {FormToolkit toolkit = managedForm.getToolkit();

final ScrolledForm form = managedForm.getForm();form.setText("First Page Content");toolkit.decorateFormHeading(form.getForm());


// Label component.toolkit.createLabel(form.getBody(), "Eclipse Form La bel");

}}

public class SecondFormPage extends FormPage {

public SecondFormPage(FormEditor f) {super(f, "second","SecondPage");

}

protected void createFormContent(IManagedForm managedF orm) {FormToolkit toolkit = managedForm.getToolkit();

final ScrolledForm form = managedForm.getForm();form.setText("Second Page Content");toolkit.decorateFormHeading(form.getForm());


// Button component with push style.toolkit.createButton(form.getBody(), "Eclipse Form B utton", SWT.PUSH);

}}

Classe FirstFormPage.java du projet eclipseformsexample

Classe SecondFormPage.java du projet Eclipseformsexample

construction d'eclipse forms avec la plateforme eclipse

Technology

workbench eclipse forms

web eclipse forms

comeclipseforms eclipse

getdisplay eclipse forms

fr eclipse forms

eclipse formstoolkit

eclipse formsdepuis

workbencheclipse forms