Nebula Gallery widget : new features

Happy New Year to everyone !!! :-)

During the christmas and new year holidays, I had some free time to improve the Nebula Gallery widget. Here is the list of the new features :

  • Animations : Expanding and closing of groups is now animated. The animation code is from SAT. Expand and collapse animations can be chosen between all existing SAT animations including Exponential, Elastic or Bounce or by any custom animation which implements IMovement. See video above (you may need to go to my blog, as youtube videos are not supported by planet eclipse or google reader).

    DefaultGroupRenderer#setAnimation(boolean enable)

    DefaultGroupRenderer#setAnimationLength(int timems)

    DefaultGroupRenderer#setAnimationCloseMovement(IMovement mov)

    DefaultGroupRenderer#setAnimationOpenMovement(IMovement mov)

    It’s now easy to add additional effects, like zooming on mouse over.

    The ScrollingSmoother class which replaces the default scrolling behavior by a custom effect is now included in the bundle.

    Note : Only Linear animation has been included with the widget. You can get additionnal animations with this bundle org.sharemedia.ui.sat.easing.

  • Images and descriptions for groups : images and descriptions are now displayed for groups.

    Up to 3 lines of text are supported, simply by using GalleryItem#setText( int index, String text) with id=0 for the main label and id=1 or id=2 for the two descriptions lines.

  • Lower quality on user actions : Since this widget can draw easily draw more than 20 images at every redraw, the framerate can become very low with large images. This new mode reduce the quality of images (disables antialias or interpolation) when the user is resizing or scrolling the widget in order to get ultra fast redraws.

    While scrolling you would get this quality :

    Low quality

    500 ms after the last action, the content is updated with a better quality :

    High quality

    Gallery#setLowerQualityOnUserAction( boolean enable)

    Gallery#setHigherQualityDelay( int timems)

  • Decorators : support for decorators has been added in the widget. This allows to scale decorators differently from the main image, and solves resize problems with transparent images (reported by Justin Dolezy, see here). Decorators can be specified using GalleryItem#setData(String id, Object value) as single images or arrays of images.

    All four corners are supported, and decorators are automatically resized if there is no enough room to draw all of them :

  • Quality settings: It’s now possible to change the quality settings for the graphic context. Previously quality was always set to the maximum (antialias = on and interpolation = high). Quality can now be reduced when needed.

    public void setAntialias(int antialias)

    public void setInterpolation(int interpolation)

  • Virtual groups: The widget supports SWT.VIRTUAL, which create items where they are first used. But as the widget needs to know the size of every group, they are all created right await while items are still created on demand.

    The new lazy groups mode allows to create groups only when they get visible. Until that moment, a default value is used for every groups making the content creation even more lazy. This feature uses exactly the same code as the standard virtual mode.

    public void setVirtualGroups(boolean virtualGroups)

    public void setVirtualGroupDefaultItemCount(int defaultItemCount)
    Set the default item count. Since changing on-the-fly the size of a group changes the size and position of the slider, using a realistic value reduces makes this update less noticeable.

    public void setVirtualGroupsCompatibilityMode(boolean compatibilityMode)
    This mode can cause issue with code that set the slider size programatically (like ScrollingSmoother). The compatibility mode ensure that only groups after the current group can be uninitialized.

  • Always expanded : : if you don’t need to expand/collapse groups, you can use DefaultGroupRenderer#setAlwaysExpanded to remove the button in the title bar and display groups as expanded whatever their state is. With this option, the Gallery widget looks like it was on the very first versions.

    DefaultGroupRenderer#setAlwaysExpanded( boolean enable )

The code has been commited to Nebula’s CVS. Everyone can test this new version and give feedback. Have fun :)




  • Thanks for it :)
    will try it and give the result :D
  • Hi CantY

    Sorry for the delay, I've just added a hover snippet for the Gallery widget

    See :
    http://dev.eclipse.org/viewcvs/index.cgi/org.ec...

    http://dev.eclipse.org/viewcvs/index.cgi/org.ec...

    I'll need the latest version of Gallery from cvs
  • Ok, forget the code of my previous post. I've made a clean and tested class that does what you want, including color fading between background and hover colors.

    I'll commit it to the nebula CVS tomorrow. (I'm awake since 4:30 AM, I just need some sleep right now :) )
  • till now, mousehover is not working :(
    and don't have any idea to make that work :)
  • Ok, I updated the code to prevent that. Is mouseHover working for you ?
  • I use that in my code than i debug the code, i get null in item :(
  • You can try something like that and use
    gallery.addMouseTrackListener( new HoverListener() );

    package org.eclipse.swt.nebula.snippets.gallery;

    import org.eclipse.nebula.widgets.gallery.Gallery;
    import org.eclipse.nebula.widgets.gallery.GalleryItem;
    import org.eclipse.swt.events.MouseEvent;
    import org.eclipse.swt.events.MouseTrackListener;
    import org.eclipse.swt.graphics.Color;
    import org.eclipse.swt.graphics.Point;
    import org.eclipse.swt.widgets.Display;

    public class HoverListener implements MouseTrackListener {

    GalleryItem current = null;
    Color hoverColor = new Color(Display.getCurrent(), 255, 0, 0);
    Color defaultcolor = new Color(Display.getCurrent(), 255, 0, 0);

    public HoverListener() {
    }

    public void mouseEnter(MouseEvent e) {
    }

    public void mouseExit(MouseEvent e) {
    if (current != null) {
    current.setBackground(defaultcolor);
    }
    current = null;
    }

    public void mouseHover(MouseEvent e) {
    GalleryItem item = ((Gallery) e.widget).getItem(new Point(e.x, e.y));

    if (item != current) {
    if( current != null){
    current.setBackground(defaultcolor);
    }
    if( item != null){
    item.setBackground(hoverColor);
    }
    current = item;
    }

    }

    public void dispose() {
    hoverColor.dispose();
    defaultcolor.dispose();
    }
    }


    BUT, it seems that mouseHover is not working for me. Strange since this is SWT's Control code. I need to investigate that. You can simulate mouseHover by combinaing mouseEnter/Exit and mousemove,

    If you manage to get this working, please submit your code, this could be integrated to the gallery widget or provided as a snippet.
  • Hiii....
    i need help to add mousehover listener in gallery :(
    Can you tell me how to change the background of item/group item when mouse hover on that item..

    :)

    Thanks
  • Wow have you been busy! Awesome set of features there - the bling is coming home!
    Haven't had a chance to look at the JFace stuff - desperately trying to get my own house in order, but its hard not to get side-tracked and play with some some cool new stuff :)
  • Wayne Beaton
    Cool
blog comments powered by Disqus