Display properties for list data on a XML multiview panel

Tuesday Apr 17, 2007

This blog entry is a continuation of the last entry. In the last entry, I showed you how to get hold of the underlying Top component on any SectionInnerPanel in a XML multiview. In this current entry, we will see how to make use of this concept to display list data properties on a SectionInnerPanel. For this, the first part and the second part are pre-requisites if you are new to multiview concepts.

Contents

1. Basics
2. A bit of code to glue nodes and their properties to the top component
3. And see, we are done!

Here is the complete source code for this blog entry.

Basics

I am again going to use the Book Example that originally used by Geertjan in his tutorial. The Book
example code extends from my earlier blog entries (i.e., it will have Visual library 2.0 implementation within XML multiview). Let's create another multiview element to show the top component selection and property display of selected nodes in this new multiview element. This new multiview element will have a JList to show the chapters as rows. Each chapter's properties such as title and paragraph are shown in the Netbeans properties window upon selection of the row.

This is an example to show the mighty power of XML multiview API that, you can implement multiple visualizations for a single XML file based on your need simultaneously. 

First, we create a new multiview element named 'Table' along side of 'Design' and 'Graph' multiviews. Open up BookDataObject.java and add the following view.

private static class TableView extends DesignMultiViewDesc {
        private int type;
     TableView(BookDataObject dObj, int type) {
            //super(dObj, "Design"+String.valueOf(type));
            super(dObj, "Table");
            this.type=type;
     }
        
     public org.netbeans.core.spi.multiview.MultiViewElement createElement(){
            BookDataObject dObj = (BookDataObject)getDataObject();
            return new TableToolBarMVElement(dObj);
     }
        
     public java.awt.Image getIcon() {
            return 
org.openide.util.Utilities.loadImage(
"org/netbeans/modules/bookmultiview/Datasource.gif"); //NOI18N
     }
        
     public String preferredID() {
            return "book_multiview_design"+String.valueOf(type);
     }
}

 and update the

getMultiViewDesc()

method as follows:

 protected DesignMultiViewDesc[] getMultiViewDesc() {
        return new DesignMultiViewDesc[]{
            new DesignView(this,TYPE_TOOLBAR),
            new GraphView(this,TYPE_TOOLBAR),
            new TableView(this,TYPE_TOOLBAR)
        };
    }

 The code in the bold face shows the new addition. Copy any existing ToolBarMVElement (say, GraphToolBarMVElement.java) file and rename it to TableToolBarMVElement.java. Copy GraphPanelFactory.java to TablePanelFactory.java and GraphPanel.java to BookTablePanel.java.

Edit them appropriately by removing the unwanted code. Add a JList on the BookTablePanel.java and read all the chapters and fill them in the list.

Here is the dry run.

Connect Top component, nodes, properties window

Now comes the interesting part. Open up  TableToolBarMVElement.java and override getLookup() method to place the topcomponent handle in the lookup, just as described in the last blog entry.

public Lookup getLookup() {
        return new ProxyLookup(new Lookup[] { 
            Lookups.singleton(callback.getTopComponent()),
              super.getLookup()});
}

Now open the BookTablePanel.java and implement the selection event handling of the chapterlist and add the code to get the top component, create nodes, attach properties to them and make the nodes active.

Handling the selection event for JList:

chapterList.addListSelectionListener(new ListSelectionListener() {
            public void valueChanged(ListSelectionEvent e) {
                //Ignore extra messages.
                if (e.getValueIsAdjusting()) return;
                
                String chapterName = (String)chapterList.getSelectedValue();
                selectTableData(chapterName);
            }
            
});

Handle the selection:

private void selectTableData(String chapterName) {
        for(Chapter chapter : book.getChapter()) {
            if(chapter.getTitle().equals(chapterName)) {
                // found the selected chapter.
                // Get the topcomponent handle from the global lookup.
                // Global lookup always has the currently active component.
                TopComponent currentMVComponent = 
(TopComponent)Utilities.actionsGlobalContext().lookup(
                        TopComponent.class);
                // Setup explorer manager to the current top component.
                ExplorerManager explorerManager =
                        ExplorerManager.find(currentMVComponent);
                // Setup nodes and attach properties to them.
                PropertyNode propertyNode = new PropertyNode(chapter);
                explorerManager.setRootContext(
                        propertyNode
                        );
                try {
                    // Make the node active.
                explorerManager.setSelectedNodes(new Node[]{propertyNode});
                    System.out.println("Got top component : " + 
         currentMVComponent.getClass().getName());
                    currentMVComponent.setActivatedNodes(new Node[] 
			{propertyNode});
                } catch (PropertyVetoException ex) {
                    ex.printStackTrace();
                }
                
            }
        }
} 

Create nodes and attach properties: 

private class PropertyNode extends AbstractNode {
        private Chapter chapter;
        PropertyNode(Chapter chapter) {
            super(Children.LEAF);
            this.chapter = chapter;
            //setShortDescription("Chapter Properties");
            setDisplayName("Chapter Properties");
            
        }
	// Create property sheets         
        protected Sheet createSheet() {
            
            Sheet sheet = Sheet.createDefault();
            Sheet.Set set = sheet.createPropertiesSet();
            try {
                
                Property titleProp = 
new PropertySupport.Reflection(chapter, String.class, "getTitle", 
   "setTitle");
                        
                Property paragraphProp = 
new PropertySupport.Reflection(chapter, String[].class, 
  "getParagraph", "setParagraph");

                titleProp.setName("Title");
                titleProp.setShortDescription("The title of the chapter");
                paragraphProp.setName("Paragraphs");
      paragraphProp.setShortDescription("The paragraphs of the chapter");
                set.put(titleProp);
                set.put(paragraphProp);
            } catch (NoSuchMethodException ex) {
                ErrorManager.getDefault().notify(ex);
            }
            sheet.put(set);
            return sheet;
        }
}

Run the BookMultiview Suite:

The next imape shows the default list editor presented when you click the ellipsis button (...) for the 'Paragraphs' property in the properties window. Note there is no code written to enable this. The properties API takes care of supplying the appropriate  property editor upon specifying the property type. In this case, the 'Paragraphs' is specified as array of strings.

One more thing we can do here is we can automatically open the properties window when the 'Table' multiview becomes active. The following code opens up the properties window if its not already open. Thanks to Sarjay for providing the help. We will code this in BookTablePanel.java constructor.

TopComponent t = WindowManager.getDefault().findTopComponent("properties");
        if(t != null && !t.isOpened()) {
            t.open();
}

Thanks to Explorer and Property sheet API and Nodes API.

Like this post? | | | |

Posted at 11:42AM Apr 17, 2007 by Vadiraj Deshpande in NetBeans
Tags: data jlist netbeans properties xml-multiview-editor