X

Geertjan's Blog

  • July 10, 2011

Custom Tabbed Toolbar with Corporate Image and Central Registry Integration

Geertjan Wielenga
Product Manager

In the last two days, you have read in this blog how to replace the default menu bar from the NetBeans Platform with your own custom menu bar. The reason for doing so was, initially, to display a corporate image. So, what about the NetBeans Platform toolbar? How would one provide a custom toolbar that replaces the one provided by the NetBeans Platform? By the way, that's exactly what someone named Matt asked at the end of the first of the two blog entries on menu bar replacement: "Do you know if it's possible to do the same thing for the toolbar (eg. use a custom image as background)?"

Well, here's what you'll be able to do/have by the end of this blog entry, i.e., you'll not have a menu bar at all, instead you'll have a tabbed toolbar that replaces the NetBeans Platform toolbar, the content of the toolbar will be the same as the original NetBeans Platform toolbar, and you'll also have a corporate image in the background of the toolbar:

Above, the custom toolbar is installed in NetBeans IDE. But it could be installed in any NetBeans Platform application, instead. The content you see above is not hardcoded into the toolbar; instead, the Action entries within the "Toolbars" folder in the central registry are used to populate the toolbar. It works out of the box, but you'll probably want to provide your own corporate image, rather than the one that you see above. 

To jump straight to the source code, go here on java.net where all the source code for the custom toolbar, with all the related configurations, is found:

http://java.net/projects/nb-api-samples/sources/api-samples/show/versions/7.0/misc/TabbedToolbar

OK. Now let's go through it all step by step.

  1. Chris Bohme from PinkMatter is not only responsible for the famous PinkMatter NetBeans Platform Ribbon toolbar, but also for a toolbar that is tabbed without having any Flamingo integration. So follow the steps in this article with code by Chris to get started with the tabbed toolbar.

  2. OK. Now that we've followed Chris's steps, let's plug in the "Toolbars" folder from the central registry, rather than the dummy code provided in the article. Here's the rewritten "ToolbarComponentProvider", take note of the fact that I use MigLayout to add the JButtons to the JPanels:









    public abstract class ToolbarComponentProvider {
    public abstract JComponent createToolbar();
    public static ToolbarComponentProvider getDefault() {
    ToolbarComponentProvider provider = Lookup.getDefault().lookup(ToolbarComponentProvider.class);
    if (provider == null) {
    provider = new DefaultToolbarComponentProvider();
    }
    return provider;
    }
    private static class DefaultToolbarComponentProvider extends ToolbarComponentProvider {
    @Override
    public JComponent createToolbar() {
    JTabbedPane pane = new JTabbedPane();
    FileObject tbFolder = FileUtil.getConfigFile("Toolbars");
    for (FileObject oneTbFolder : FileUtil.getOrder(Arrays.asList(tbFolder.getChildren()), true)) {
    JPanel panel = new MyPanel(new MigLayout("align right"));
    if (oneTbFolder.isFolder()) {
    pane.add(oneTbFolder.getName(), panel);
    for (FileObject oneTb : FileUtil.getOrder(Arrays.asList(oneTbFolder.getChildren()), true)) {
    try {
    DataObject dob = DataObject.find(oneTb);
    Object instanceObj;
    InstanceCookie ck = dob.getCookie(InstanceCookie.class);
    try {
    instanceObj = ck.instanceCreate();
    } catch (Exception ex) {
    instanceObj = null;
    }
    if (instanceObj instanceof Action) {
    JButton button = new JButton();
    Actions.connect(button, (Action) instanceObj);
    panel.add(button);
    }
    } catch (DataObjectNotFoundException ex) {
    Exceptions.printStackTrace(ex);
    }
    }
    }
    }
    pane.setPreferredSize(new Dimension(100, 70));
    return pane;
    }
    }
    }

  3. In the code above, reference is made to "MyPanel". Here it is, it's the same as any other JPanel except that it handles MigLayout and that it paints the corporate image, the same way as done in the MenuBar examples from the previous days:









    public class MyPanel extends JPanel {
    private final Paint bannerPaint = makeBannerPaint();
    MyPanel(MigLayout migLayout) {
    super(migLayout);
    }
    @Override
    protected void paintComponent(Graphics g) {
    Graphics2D g2 = (Graphics2D) g;
    g2.setPaint(bannerPaint);
    g2.fillRect(0, 0, getWidth(), getHeight());
    }
    private Paint makeBannerPaint() {
    BufferedImage img = (BufferedImage) ImageUtilities.loadImage("org/tabbed/toolbar/banner.jpg");
    return new TexturePaint(img, new Rectangle(0, 0, img.getWidth(), img.getHeight()));
    }
    }

  4. Optionally, remove the menu bar, using the layer file to do so, i.e., add a hidden tag for the Menu folder. Then the menu bar is gone, in the same way as the toolbar was gone in the previous two blog entries. However, of course, that's not a requirement to make the custom toolbar work. It might be a solution to save real estate in the application, i.e., only provide a toolbar and put all your actions into its panels.

That's it, you're done. Note that the buttons in the toolbar are aligned right, thanks to MigLayout. Also note that each panel displays the same image. Optionally, you could have a different image for each panel in the toolbar. In fact, for each panel in the toolbar, you could provide a unique JPanel, instead of sharing a single JPanel between all of the toolbar panels.

Just get the full source code from the link above and you'll have everything you need. Probably simply replace the banner image with your own and then you're ready to use it out of the box. Big plus is that the vertical space taken up by this toolbar is much less than the PinkMatter/Flamingo toolbar.

Join the discussion

Comments ( 2 )
  • Matt Monday, July 11, 2011

    Great post! Thanks a lot Geertjan!


  • Leon Victor Wednesday, December 12, 2012

    I am facing same problem with little issue in NetBeans platform toolbar. But I got solution from your post. Thanks for your help me.


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