Accueil > Eclipse Nebula, Eclipse RAP, Eclipse RCP, Nebula Picture > Eclipse Nebula Picture Control

Eclipse Nebula Picture Control


In some business application, your model (domain) contains sometimes image byte array (ex : photo for person model, logo for project model, etc). In our XDocReport project, we need to manage photo byte array with SWT control for the person model in our Eclipse RCP/RAP XDocReport, in the resume editor :

This last screenshot is the resume editor in WEB context (Eclipse RAP). Here a screenshot in fat client context (Eclipse RCP) :

After several search, it seems that there is no project which provides a SWT picture control, which works with Eclipse RCP and RAP. So we decided to develop SWT PictureControl and give our code to Eclipse Nebula Project.Today Nebula Team are voting if the project will be accepted or not. Pictur control was accepted by Nebula and today it is stored on Eclipse Nebula Git.

If you are intersted you can read the original bug 365948.

Plug-Ins

Nebula PictureControl contribution provides a SWT control to display an image, remove and modify it. It can be used in the RCP/RAP application context. This control is useful to manage photo, logo in a SWT, RCP and RAP Application. It works with SWT (use org.eclipse.nebula.widgets.picture.PictureControl) and FormToolkit (use org.eclipse.nebula.widgets.picture.FormPictureControl)

The PictureControl contribution zip contains :

  • org.eclipse.nebula.widgets.picture : plugin which contains the Nebula Picture control.
  • org.eclipse.nebula.widgets.picture.snippets : Snippets example with PictureControl.
  • org.eclipse.nebula.widgets.picture.example : eexample which adds a tab demo with picture control in the global Nebula demo..

SimplePictureControl

org.eclipse.nebula.widgets.picture.snippets.SimplePictureControl create a picture control like this :

PictureControl photoControl = new PictureControl(shell);

If you Run org.eclipse.nebula.widgets.picture.snippets.SimplePictureControl, you will see that :

The "Modify" Link opens the file Explorer View to select an image :

After selecting an image, the image appears :

You can click in the "Delete" link to delete the image. It’s possible to get the image as byte array with the following code :

byte[] imageByteArray = photoControl.getImageByteArray();

When image changes, the PictureControl stores the image as byte array and fires events to tell that image has changed. Here a sample code to observe the image changed :

photoControl.addPropertyChangeListener(PictureControl.IMAGE_BYTEARRAY_PROPERTY,
	new PropertyChangeListener() {
		public void propertyChange(PropertyChangeEvent event) {
			byte[] newImage = (byte[]) event.getNewValue();
		}
});

This feature can be useful when you wish bind with JFace Databinding the image byte array with a Model object. Here a sample to bind byte[] Person#getPhoto() :

Person person=...;
IObservableValue uiValue = BeansObservables.observeValue(photoControl, PictureControl.IMAGE_BYTEARRAY_PROPERTY);
IObservableValue modelValue = PojoObservables.observeValue(person, "photo");
bindingContext.bindValue(uiValue, modelValue, null, null);

PictureControlWithDefaultImage

It’s possible to set a default image (PictureControl#getImageByteArray() will return null in this case). If you run org.eclipse.nebula.widgets.picture.snippets.PictureControlWithDefaultImage you will see that :

Here the code to set a default image :

Image defaultImage = new Image(display, PictureControlWithDefaultImage.class.getResourceAsStream("EmptyPhoto.jpg"));
PictureControl photoControl = new PictureControl(shell);
photoControl.setDefaultImage(defaultImage);
About these ads
  1. Daniel Zimmermann
    janvier 9, 2012 à 1:43   | #1

    I’ve just a short Question:
    How did get the PShelf working unter RAP?

  2. Daniel Zimmermann
    janvier 11, 2012 à 3:30   | #3

    Sorry for the delay :-)
    Thanks for your response! I will have a look into it, since I kind of like the PShelf…

  1. janvier 7, 2012 à 6:42   | #1
  2. janvier 8, 2012 à 5:11   | #2

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s

Suivre

Recevez les nouvelles publications par mail.

Joignez-vous à 169 followers

%d bloggers like this: