[ SWT ] Comment réaliser ce composant ?

Version imprimable

17/12/2010, 14h25
gladek

[ SWT ] Comment réaliser ce composant ?

Voici une capture d'ecran :

http://img716.imageshack.us/img716/1...eenshotnne.png

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 :)
17/12/2010, 14h41
Gueritarish

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
17/12/2010, 14h54
gladek

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...
17/12/2010, 15h41
Gueritarish

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:

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.
17/12/2010, 16h31
gladek

Tu as un exemple de code sous la main ou un lien pour m'aider ?
17/12/2010, 16h40
Gueritarish

Citation:

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
17/12/2010, 17h02
gladek

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.
http://img225.imageshack.us/img225/3235/totou.png

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:

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.

21/12/2010, 15h25
gladek
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 :
http://img101.imageshack.us/img101/4885/sdgfsd.png

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 :)
23/12/2010, 18h05
gladek

Je pense avoir trouver la solution :
voici un aperçu gnl :
http://img585.imageshack.us/img585/1386/52400230.png
23/12/2010, 18h09
gladek

Citation:

Envoyé par gladek

Je pense avoir trouver la solution :
voici un aperçu gnl :
http://img585.imageshack.us/img585/1386/52400230.png

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.
28/12/2010, 14h23
gladek
Re, a nouveau un peu d'aide de votre part
voici mon rendu :
http://img337.imageshack.us/img337/1700/28445647.png

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
07/01/2011, 15h43
gladek

[ SWT ] CCombo & Table

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 :

http://img691.imageshack.us/img691/8990/33592593.png

Uploaded with ImageShack.us
01/03/2011, 11h06
L4BiN

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 ?
01/03/2011, 11h23
Gueritarish

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
01/03/2011, 11h28
L4BiN

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

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:

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

01/03/2011, 13h58
L4BiN

OKi merci,

je vais essayer de m'en sortir avec ca... je tient au courant.
01/03/2011, 16h06
L4BiN

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
02/03/2011, 10h33
L4BiN

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.