GWT Ext - How to enhance an image with mouse events

If you need to display buttons with dimensions bigger than 16x16 pixels the the GWT-Ext isn't very friendly ... you have to use the class "Image" that renders any image resource (bmp, gif, png). Also, you need to have the mouse events enabled, for being able to click on the "bigger image button".

For achieving this goal I've extended the "Image" class with the event "mouse-down", for simulating the click,  like in the below code sample:

import com.gwtext.client.core.EventCallback;
import com.gwtext.client.core.EventManager;
import com.gwtext.client.core.EventObject;
import com.gwtext.client.core.ListenerConfig;
import com.gwtextux.client.widgets.image.Image;
import com.gwtextux.client.widgets.image.ImageListener;
import com.gwtextux.client.widgets.image.ImageListenerAdapter;


/**
 * The class IvImage extends the com.gwtextux.client.widgets.image.Image with
 * the "mouseDown" event.
 *
 * @author SCC
 *
 */
public class IvImage extends Image {


/**
* The interface IvImageListener extends the base ImageListener with the
* "onMouseDown()" function
*/
public interface IvImageListener extends ImageListener {
/**
* Fires when this image is clicked down (pressed)
*
* @param image
*            this
* @param e
*            the event object
*/
public void onMouseDown(Image image, EventObject e);

/**
* Fires when this image is right-button clicked down.
*
* @param image
*            this
* @param e
*            the event object
*/
public void onContextMenu (Image image, EventObject e);
}


/**
* The class IvImageListenerAdapter extends the base ImageListenerAdapter
* with the "onMouseDown()" function
*/
public static class IvImageListenerAdapter extends ImageListenerAdapter implements IvImageListener {


/**
* {@inheritDoc}
*/
public void onMouseDown(final Image image, final EventObject e) {
}


/**
* {@inheritDoc}
*/
public void onContextMenu(Image image, EventObject e) {
}
}


private ListenerConfig listenerConfig = new ListenerConfig();


/**
* @param id
* @param imgURL
*/
public IvImage(final String id, final String imgURL) {
super(id, imgURL);


listenerConfig.setPreventDefault(true);
}


/**
* Add a listener.
*
* @param listener
*            the listener
*/
public void addListener(final IvImageListener listener) {
super.addListener(listener);


final IvImageListener fListener = listener;
final Image me = this;


final EventCallback onMouseDown = new EventCallback() {
public void execute(final EventObject e) {
fListener.onMouseDown(me, e);
}
};


  final EventCallback onContextMenu = new EventCallback(){
public void execute(EventObject e) {
fListener.onContextMenu(me, e);
}  
 };
    
 EventManager.addListener(getElement(), "mousedown", onMouseDown, listenerConfig);
 EventManager.addListener(getElement(), "contextmenu", onContextMenu, listenerConfig);
}


}

New stuff related with this subject will be posted soon - stay close!

Cheers!

No comments:

Post a Comment