X

Geertjan's Blog

  • October 11, 2007

PropertyEditorSupport.paintValue

Geertjan Wielenga
Product Manager
I've been trying to see how much can be done with the PropertyEditorSupport.paintValue, partly because the development team we met in Budapest want to display an image in a properties sheet. It doesn't seem to be possible, the drawImage doesn't seem to work, from what I can tell. However, some other humble effects are possible, such as rectangles with rounded corners:

@Override
public void paintValue(java.awt.Graphics g, java.awt.Rectangle box) {
Rectangle r = g.getClipBounds();
g.drawRoundRect(1, 1, 270, 16, 10, 10);
g.drawString(getAsText(), box.x + 5, box.y + 15);
}

Assuming isPaintable is true, the above results in:

And a bit more can be done, like this:

@Override
public void paintValue(java.awt.Graphics g, java.awt.Rectangle box) {
Rectangle r = g.getClipBounds();
g.setColor(Color.yellow);
g.fillRoundRect(1, 1, 270, 16, 10, 10);
g.drawRoundRect(1, 1, 270, 16, 10, 10);
g.setColor(Color.blue);
g.drawString(getAsText(), box.x + 5, box.y + 15);
}

And that results in:

But it would be cool if at least a 16x16 icon could be shown. Ideally, the cell space would be extendable so that larger pictures could be shown. But, I'm sure that that isn't possible at all and a custom editor would need to be created, though that wouldn't display pictures within the cell itself.

Update: If you follow the discussion in the comments to this blog entry, you will end up with an icon in the property sheet, as shown here:

Join the discussion

Comments ( 14 )
  • Balazs Thursday, October 11, 2007

    Hi Geertjan!

    Actually trying myself also and finally after talking to you we don't want to display a big image this way anymore, but created a custom renderer and a custom property window instead :-)

    However I find this is still interesting and useful for small visual decorations for example.


  • Geertjan Thursday, October 11, 2007

    Cool. Can you share the code? I guess you have some kind of panel that appears when the user clicks the small "..." button and then you shown the image there?


  • guest Thursday, October 11, 2007

    The property editor for an image has a thumbnail property. The thumbnail property draws a scaled view of the image. You can look into how that is accomplished.


  • Geertjan Thursday, October 11, 2007

    Wow, 67.161.134.47, that's a great idea!


  • Balazs Thursday, October 11, 2007

    Actually not yet, but that's a brilliant idea (I will try it). The custom renderer I use is for the list view (and not tweaking the "standard" properties display), where the tricky part was how to get the node to be rendered inside the JList which is embedded inside of it.

    First I've set the custom renderer in my new list view class:

    public class ThumbnailListView extends org.openide.explorer.view.ListView

    {

    // ... whatever code here...

    private void setMyRenderer()

    {

    // I'm accessing the embedded JList and set my renderer:

    this.list.setCellRenderer( new MyRenderer() );

    }

    }

    The custom renderer (MyRenderer) is then a simple ListCellRenderer, where the most important function is the rendering function for the corresponding node:

    public Component getListCellRendererComponent( JList list, Object value, int index, boolean isSelected, boolean cellHasFocus )

    {

    MyNode node = (MyNode) Visualizer.findNode( value );

    // ... from here I can access anything from my node

    // ... do the rendering

    return this;

    }


  • Geertjan Thursday, October 11, 2007

    Hi Balazs, that sounds interesting, I will study it. Following the advice received above, I now have a 16x16 icon in the property sheet, here is all the code, with the location of the image hardcoded (you would replace it somehow, but that's not relevant here):

    @Override

    public void paintValue(Graphics g, Rectangle r) {

    ImageIcon icon = null;

    icon = new javax.swing.ImageIcon(getClass().getResource("/org/yourorghere/module1/marilyn.gif"));

    if (icon != null) {

    int iconWidth = icon.getIconWidth();

    int iconHeight = icon.getIconHeight();

    // Shrink image if necessary.

    double scale = (double) iconWidth / iconHeight;

    if (iconWidth > r.width) {

    iconWidth = r.width;

    iconHeight = (int) (iconWidth / scale);

    }

    if (iconHeight > r.height) {

    iconHeight = r.height;

    iconWidth = (int) (iconHeight \* scale);

    }

    // Try to center it if it fits, else paint as much as possible.

    int x;

    if (iconWidth < r.x) {

    x = (r.x - iconWidth) / 2;

    } else {

    x = 5; // XXX Indent.

    }

    int y;

    if (iconHeight < r.y) {

    y = (r.y - iconHeight) / 2;

    } else {

    y = 0;

    }

    Graphics g2 = g.create(r.x, r.y, r.width, r.height);

    g.drawImage(icon.getImage(), x, y, iconWidth, iconHeight, null);

    }

    }


  • Geertjan Thursday, October 11, 2007
  • Prashant Friday, April 24, 2009

    Great blog Geertjan. I am not sure whether my problem links directly to this topic or not. But still.

    I am using Nimbus look and feel for my netbeans RCP application. Everything seems to work ok, but the property rows (in properties panel) are alternately colored with grey background. Any clue as to how can i override this to show only white color in the background as happens by default with NB.

    Thanks in advance.


  • Gabriel Tuesday, September 22, 2009

    Hi!

    I'm building a custom EnumPropertyEditor, for which I've already built an InplaceEditor formed up by a JPanel that contains a JComboBox. I want to be able to show the my InplaceEditor in the PaintValue(), but i haven't succeeded. The editor area appears blank, but when i click inside it, the InplaceEditor shows up.

    My question is, why I can't show the same Component returned by the getComponent() of the InplaceEditor as the paintValue() of the PropertyEditor?

    Thanks!


  • Nick Dunn Thursday, May 20, 2010

    Geertjan,

    Thanks for this code snippet. You're always a big help with this NetBeans Platform stuff, and this really helped me out of a jam.

    If people are wondering what the offsets are for in the drawString call, the y offset is due to the fact that drawString takes in the (x,y) location of the lower left corner of the string (the baseline), whereas the box's Y location is the top of the box.


  • Xavier Friday, February 25, 2011

    Hi,

    I have the same question of @Prashant, anyone has a tip for this?

    thanks!


  • Geertjan Wielenga Friday, February 25, 2011

    Is your problem with Nimbus? Or what? If it relates to Nimbus, then see the Nimbus documentation about the many ways you can override Nimbus settings.


  • vince Tuesday, May 31, 2011
    Hi,
    I'm working on an instruction editor that enables user to execute instruction. What i want is a button where there is normally a field (property). Thanks to an inplace editor i can display this button on user click but it is not displayed the rest of the time.
    Do you have any idea how to display a button in a property editor?
    Really nice blog by the way!
    Thanks
  • guest Thursday, December 11, 2014

    Hello,

    I am newbie in using outline View . I am facing a small problem in customizing the look of my outline view . I don't want the eclipses icon on every cell of my outline view want to remove it . please require help on this.


Please enter your name.Please provide a valid email address.Please enter a comment.CAPTCHA challenge response provided was incorrect. Please try again.Captcha