[ SWT ] Comment réaliser ce composant ?

**gladek** · 17/12/2010, 15h25

Voici une capture d'ecran :

Je debute sous SWT, je ne connais pas le ou les composants pour demarrer sur ce screen.
Tree composé de TreeColumn, puis TreeItem ?

Merci d'avance de votre aide

**Gueritarish** · 17/12/2010, 15h41

Salut,

Quelques questions:
- est-ce que ton appli est un (ou plusieurs) plug-in(s) Eclipse (ou un RCP) ou est-ce une appli SWT classique?
- Ton but est-il d'avoir un composant absolument identique (avec les mêmes fonctionnalités) ou quelque chose d'approchant?
Je te conseille tout d'abord de passer par des composants JFace (qui est un sur-couche à SWT et permet de manipuler des objets métiers).
Dans le cas présent, il te faut utiliser un TreeViewer avec des TreeViewerColumn ainsi que des TreeViewerEditor (pour l'édition de tes cellules).
Tu te créés tes objets métiers adéquat et ensuite il te suffit de les passer au content provider de ton TreeViewer.

Voilà, à+
Gueritarish

**gladek** · 17/12/2010, 15h54

Je developpe une application SWT classique.
Je m'en tiens a SWT car j'y integre de l'openGL.

Mon but est de pouvoir disposé d'une arborescence dans une premiere colonne (Les libellés). Puis dans la seconde colonne de mettre n'importe quel type de composant : checkbox, liste deroulante, couleur, zone de saisie.

Un exemple, je decide de gerer une lampe.
Je choisi la lampe numero 2(liste déroulante), je peux lui choisir une couleur(couleur), une position(zone de saisie) et d'autres attributs...

**Gueritarish** · 17/12/2010, 16h41

Je vois pas ce qui gène d'utiliser JFace et openGL...
Prenons ton exemple:
Tu utilises un TreeViewer, il te suffit de faire:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

myViewer.getTree();

pour te retrouver avec une instance de Tree (qui est ta classe SWT). Comme je l'ai dis précédemment, JFace est une sur-couche de SWT. Un peu comme Swing pour AWT. Tu vas pas me dire que tu préfères coder en AWT plutôt qu'en Swing? Bah c'est pareil pour JFace et SWT.

Ensuite, pour ce qui est de ton arbre tu créés 2 TreeViewerColumn. Tu utilises ensuite un ColumnLabelProvider (pour définir ce qui est affiché dans tes colonnes). Ensuite, sur le second TreeViewerColumn tu donnes son EditingSupport (qui va te permettre de définir les composants servant à l'édition des cellules). Et c'est gagné.

La seule chose un peu exigeante à faire, c'est de bien penser à tes objets métiers.

**gladek** · 17/12/2010, 17h31

Tu as un exemple de code sous la main ou un lien pour m'aider ?

**Gueritarish** · 17/12/2010, 17h40

Envoyé par gladek

Tu as un exemple de code sous la main ou un lien pour m'aider ?

Pour t'aider à coder ton composant?
Bah déjà tu as le tutoriel que j'ai mis dans mon premier post, ensuite tu as les exemples SWT sur lesquels tu peux te baser. Tu as aussi les exemples SWT/JFace sur le site java2s ou sur le wiki d'Eclipse.
Mais commence déjà par le tutoriel, ça va beaucoup t'aider.

Voilà à+
Gueritarish

**gladek** · 17/12/2010, 18h02

Ce lien m'aide beaucoup.
http://dev.eclipse.org/viewcvs/viewv...va?view=markup

Cependant les Provider fournissent une liste d'objets à afficher.
Ligne apres ligne je liste ma collection d'objets
.
Or je cherche a afficher ligne apres ligne les données d'un seul objet.

**gladek** · 17/12/2010, 18h34

Ok j'ai bien lu ton doc, je n'avais pas fait attention au lien dans ton premier post. Merci, tres clair et tres bien expliqué

Je ne suis pas sur que les provider correspondent à mon besoin.
Ils offrent une vue horizontale d'une collection d'objets alors que je souhaite une vue verticale d'un seul objet.

Mon objectif est juste de pouvoir afficher un ecran ayant les fonctionnalités du screenshot. Faut il absolument passer par les providers ?

Je voudrais dans un premier temps avoir un ecran avec une ligne avec un combo, une seconde choix couleur, un troisieme checkbox. Je ne trouve pas de tutorial sur le net...

Le code suivant s'inspire de ce que je peux trouver sur le net

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
TreeItem itemId = new TreeItem(treeCameras, SWT.NONE);
        itemId.setText("Camera id");
        Combo comboId = new Combo(treeCameras, SWT.READ_ONLY);
        comboId.setItems(new String[] { "1", "2", "3" });
        // comboId.setSize(200, 200);
        editor.setEditor(comboId, itemId, 1);
 
        // Test CheckBox
        TreeItem itemActive = new TreeItem(treeCameras, SWT.NONE);
        itemActive.setText("check box");
        Button check = new Button(treeCameras, SWT.CHECK);
        editor.setEditor(check, itemActive, 1);

Malheureusement, la combo apparait sur la seconde ligne (et non sur la 1 comme éspéré) et viens ecraser la combo box attendu en ligne 2.

**gladek** · 21/12/2010, 16h25

J'ai changé d'angle d'attaque.
Je pars sur un composite et j'ajoute les éléments les uns à la suite des autres.

Un Composite principal contenu dans un ExpandBar.
Ce composite a un GridLayout(2, false).

Et j'ajoute les composants(label+composant) les uns à la suite des autres.
Voici le résultat :

Plusieurs questions :

comment réduire les espaces entre lignes des composants ?
aligné mon tree avec les labes précédents
ajouté des valeurs a mes colonnes x,y,z sachant qu'elles proviennent d'un bean.

Merci d'avance

**gladek** · 23/12/2010, 19h05

Je pense avoir trouver la solution :
voici un aperçu gnl :

**gladek** · 23/12/2010, 19h09

Envoyé par gladek

Je pense avoir trouver la solution :
voici un aperçu gnl :

J'utilise une simple Table pour le moment

Je reviens vers vous quand j'aurai implementé chaque type de composant.
A l'heure actuelle marche la combobox et la checkbox.

Il me reste a bosser le "tree" pour la position.

**gladek** · 28/12/2010, 15h23

Re, a nouveau un peu d'aide de votre part
voici mon rendu :

Il me reste qq questions au niveau des elements Ambient, Diffuse et Specular.
la seconde colonne contient un TableItem avec bouton et juste devant une image.

Comment imposer une taille à mon bouton ?
CHanger la couleur de l'image une fois le composant deja dispose() ?
Comment cacher des lignes de ma table ?

Merci d'avance

**gladek** · 07/01/2011, 16h43

Bonjour,

J'ai reussi !!!
Pas de solution miracle, je developpe chacuns des widget a inserer dans ma table.

J'ai donc une Table constitué de TableItem.
Pour chaque item, colonne 2, je remplace l'item de base par mon CustomWidget (via un table editor).
Tous mes CustomWidget étendent Composite.
Je redéfinis les methodes resize, computeSize.
J'ai un internalLayout qui place mes composants dans le composite.

Je définis des events pour les composants actifs.

La base est la, il me reste qq finitions à apporter (Fond gris des combobox, etc...). Voila un aperçu :

Uploaded with ImageShack.us

**L4BiN** · 01/03/2011, 12h06

Bonjour,

la CheckBox dans la seconde colonne m'interesse, c'est exactement ce que je veux mais je ne trouve pas le code pour faire cela. Je comprend pas bien. Puis je avoir un peu d'aide ?

**Gueritarish** · 01/03/2011, 12h23

Salut,

Je te conseille de passer par un TableViewer qui définit plus facilement l'édition des cellules. Tu as un article Eclipse là dessus.
Mais si tu tiens absolument à t'orienter sur du SWT, tu as un exemple d'implémentation (sur un bouton, mais il te suffit de changer le style du bouton et c'est gagné).

Voilà, à+
Gueritarish

**L4BiN** · 01/03/2011, 12h28

Merci,

Dans le cas du TableViewer, il me semble que c'est presque pas possible de définir des checkbox dans une autre colonne que la premiere (juste en definissant le style dans ce cas là). J'ai l'impression qu'il faut que je dessine moi meme l'image de la check box.

Alors peut etre que je vais tester l'autre solution, à moin que tu m'orientes car j'arrive pas bien.

PS: je prefererai mille fois y arrivé via les table viewer, en utilisant je suppose les CheckBoxCellEditor, mais je n'y arrive pas bien. Si tu as un exemple ca m'interesse. Merci

**Gueritarish** · 01/03/2011, 14h22

En fait, tu as un exemple avec le code source dans l'implémentation qui est fournie avec l'article Eclipse que je t'ai donné en lien au-dessus.

Alors, effectivement, il y a un bug Eclipse pour le cas des CheckboxCellEditor qui ne sont pas dans la première colonne. Mais rien ne t'empêche de créer ton propre CellEditor. Ça te prendra pas beaucoup plus longtemps. Une adaptation de l'exemple fournit dans le bug:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
import org.eclipse.jface.viewers.CellLabelProvider;
import org.eclipse.jface.viewers.ColumnLabelProvider;
import org.eclipse.jface.viewers.IStructuredContentProvider;
import org.eclipse.jface.viewers.TableViewer;
import org.eclipse.jface.viewers.TableViewerColumn;
import org.eclipse.jface.viewers.Viewer;
import org.eclipse.jface.viewers.ViewerCell;
import org.eclipse.swt.SWT;
import org.eclipse.swt.custom.TableEditor;
import org.eclipse.swt.layout.FillLayout;
import org.eclipse.swt.layout.RowLayout;
import org.eclipse.swt.widgets.Button;
import org.eclipse.swt.widgets.Composite;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Shell;
import org.eclipse.swt.widgets.TableItem;
 
/**
 * Example usage of none mandatory interfaces of ITableFontProvider and
 * ITableColorProvider
 * 
 * @author Tom Schindl <tom.schindl@bestsolution.at>
 * 
 */
public class ExampleTableViewerWithNativeControls {
 
	private class MyContentProvider implements IStructuredContentProvider {
 
		/**
                 * {@inheritDoc}
                 */
		public Object[] getElements(Object inputElement) {
			return (MyModel[]) inputElement;
		}
 
		/**
                 * {@inheritDoc}
                 */
		public void dispose() {
		}
 
		/**
                 * {@inheritDoc}
                 */
		public void inputChanged(Viewer viewer, Object oldInput, Object newInput) {
		}
	}
 
	public class MyModel {
		public int counter;
 
		public MyModel(int counter) {
			this.counter = counter;
		}
 
		public String toString() {
			return "Item " + this.counter;
		}
	}
 
	public ExampleTableViewerWithNativeControls(Shell shell) {
		final TableViewer v = new TableViewer(shell, SWT.BORDER
				| SWT.FULL_SELECTION);
		v.setContentProvider(new MyContentProvider());
 
		TableViewerColumn column = new TableViewerColumn(v, SWT.NONE);
		column.getColumn().setWidth(200);
		column.getColumn().setText("Column 1");
		column.setLabelProvider(new ColumnLabelProvider() {
 
			public String getText(Object element) {
				return element.toString();
			}
		});
 
		column = new TableViewerColumn(v, SWT.NONE);
		column.getColumn().setWidth(50);
		column.getColumn().setText("Column 2");
		column.setLabelProvider(new CellLabelProvider() {
 
			public void update(ViewerCell cell) {
				TableItem item = (TableItem) cell.getItem();
				if( item.getData("EDITOR") != null ) {
					TableEditor editor = (TableEditor) item.getData("EDITOR");
					editor.dispose();
				}
 
				TableEditor editor = new TableEditor(item.getParent());
				Composite comp = new Composite(item.getParent(),SWT.NONE);
				comp.setBackground(item.getParent().getBackground());
				comp.setBackgroundMode(SWT.INHERIT_DEFAULT);
				RowLayout l = new RowLayout();
				l.marginHeight=0;
				l.marginWidth=0;
				l.marginTop=0;
				l.marginBottom=0;
				comp.setLayout(l);
				new Button(comp, SWT.CHECK);
 
	            editor.grabHorizontal=true;
	            editor.setEditor(comp, item, 1);
			}
		});
 
		MyModel[] model = createModel();
		v.setInput(model);
		v.getTable().setLinesVisible(true);
		v.getTable().setHeaderVisible(true);
	}
 
	private MyModel[] createModel() {
		MyModel[] elements = new MyModel[10];
		for (int i = 0; i < 10; i++) {
			elements[i] = new MyModel(i);
		}
		return elements;
	}
 
	/**
         * @param args
         */
	public static void main(String[] args) {
		Display display = new Display();
		Shell shell = new Shell(display);
		shell.setLayout(new FillLayout());
		new ExampleTableViewerWithNativeControls(shell);
		shell.open();
 
		while (!shell.isDisposed()) {
			if (!display.readAndDispatch())
				display.sleep();
		}
		display.dispose();
	}
}

Voilà, à+
Gueritarish

**L4BiN** · 01/03/2011, 14h58

OKi merci,

je vais essayer de m'en sortir avec ca... je tient au courant.

**L4BiN** · 01/03/2011, 17h06

Du coup je suis passer par la gestion des images dans les cellules... une images complete_tsk et incomplete_tsk sont disponible, et comme je voulai un libéllé avec ma check c'est jolie. (car sans libéllé la check est mis a gauche de la cellule et c'est moins beau).

Merci pour ton aide

Sinon une petite question, est t'il possible de jouer avec les headers d'une table.
Par exemple mettre une comboBox dans l'header ?

Merci d'avance

**L4BiN** · 02/03/2011, 11h33

Bonjour,

Finalement j'utilise la Grid Nebula, qui permet de faire tout ce que je veux. La vue graphique est un peu moins jolie, mais c'est pas tres grave.

[ SWT ] Comment réaliser ce composant ?

SWT/JFace Java

Discussions similaires

Partager

Partager