Simple Example for an OutlineView

Here's a simple example for an OutlineView, following a request on the dev mailing list.
  1. We start by creating a Customer object:
    public class Customer {
    
        String name;
        
        String city;
        
        int age;
        
        boolean married;
        
    }
  2. Next, in the above class, create getters and setters for all the fields.

  3. Now set a dependency on the "Nodes API", the "ETable and Outline", and the "Explorer & Property Sheet API".

  4. Let's now create a Node that will wrap the above Customer object:
    public class CustomerNode extends BeanNode {
    
        public CustomerNode(Customer bean) throws IntrospectionException {
            super(bean);
            setDisplayName(bean.getName());
            setShortDescription(bean.getCity());
        }
        
    }

    So now we have a Node that wraps our model object. The Node provides human friendly attributes (e.g., a display name and a tooltip) to JavaBeans, such as, in this case, our model object.

  5. Now we'll create a factory class for creating the above Node:
    public class CustomerChildFactory extends ChildFactory<Customer> {
    
        @Override
        protected boolean createKeys(List<Customer> toPopulate) {
            Customer c1 = new Customer("Tom", "London", 23, true);
            Customer c2 = new Customer("Dick", "New York", 27, false);
            Customer c3 = new Customer("Harry", "Amsterda,", 26, true);
            toPopulate.add(c1);
            toPopulate.add(c2);
            toPopulate.add(c3);
            return true;
        }
    
        @Override
        protected Node createNodeForKey(Customer key) {
            CustomerNode node = null;
            try {
                node = new CustomerNode(key);
            } catch (IntrospectionException ex) {
                Exceptions.printStackTrace(ex);
            }
            return node;
        }
    
    }
  6. Let's now display our Node in an OutlineView.

    Create a new TopComponent, using the Window wizard to do so. Then add code to the generated TopComponent, as follows:

    public final class DemoTopComponent extends TopComponent implements ExplorerManager.Provider {
    
        private static final String PREFERRED_ID = "DemoTopComponent";
        private static DemoTopComponent instance;
        private ExplorerManager em = new ExplorerManager();
    
        public DemoTopComponent() {
            initComponents();
            setName(NbBundle.getMessage(DemoTopComponent.class, "CTL_DemoTopComponent"));
            setToolTipText(NbBundle.getMessage(DemoTopComponent.class, "HINT_DemoTopComponent"));
    
            //Set the layout so that we can easily add the OutlineView:
            setLayout(new BorderLayout());
            
            //Create children, using the factory class we created:
            Children kids = Children.create(new CustomerChildFactory(), true);
            
            //Create a root node:
            Node rootNode = new AbstractNode(kids);
            
            //Create the OutlineView:
            OutlineView ov = new OutlineView();
            
            //Set the columns of the outline view,
            //using the name of the property
            //followed by the text to be displayed in the column header:
            ov.setPropertyColumns(
                    "city", "City",
                    "age", "Age",
                    "married", "Married");
            
            //Hide the root node, since we only care about the children:
            ov.getOutline().setRootVisible(false);
            
            //Add the OutlineView to the TopComponent:
            add(ov, BorderLayout.CENTER);
            
            //Set the root of the ExplorerManager:
            em.setRootContext(rootNode);
            
            //Put the Nodes into the Lookup of the TopComponent,
            //so that the Properties window will be synchronized:
            associateLookup(ExplorerUtils.createLookup(em, getActionMap()));
    
        }
    
        @Override
        public ExplorerManager getExplorerManager() {
            return em;
        }
    
        ...
        ...
        ...
    

Run the module and here's the result:

Comments:

I'm looking for a such simple example !
Great !

Posted by Constantin Drabo on September 14, 2010 at 07:06 PM PDT #

Geertjan, thank you for this simple Example

I read the customers from database.

How do i save changes back to database?

EntityManager em = Lookup.getDefault().lookup(EntityManagerInterface.class).getEntityManager();
@Override
protected boolean createKeys(List<Kunden> toPopulate) {
@SuppressWarnings("unchecked")
List<Kunden> l = em.createQuery("select k from Kunden k").getResultList();
for (Kunden k : l) {
toPopulate.add(k);
}
return true;
}

Posted by Rami Swailem on September 14, 2010 at 10:02 PM PDT #

Hi Constantin, good to hear. Hi Rami, go here for the tutorial you'll find helpful:
http://platform.netbeans.org/tutorials/nbm-crud.html

Posted by Geertjan Wielenga on September 15, 2010 at 02:05 AM PDT #

Is there any way to persist the widths of the columns in the table, and the width of the tree, as I have achieved this via a hack in TreeView, but hoped there might be an easier way if I switch to Outline view.

Posted by David Irving on October 12, 2010 at 08:56 PM PDT #

I have been trying to use this, to produce a graphical tooltip, concerning the contents of the node that the mouse is over.
To do this, I need to get at the Outline component, but this is not in a public package.
Any idea how I might go about getting hold of the Node the mouse is over.

Thanks in anticipation.

Posted by David Irving on October 12, 2010 at 09:23 PM PDT #

Get the selected Node from the ExplorerManager.

Posted by Geertjan on October 13, 2010 at 12:29 AM PDT #

Hi Geertjan,

very cool tutorial. Really, really useful.

I was wondering though:

a. how can you get rid of the title "Nodes" and replace it with "Name"?
b. how can you make the table read-only; I know that you can remove the setter methods from Customer bean, but then the table has a grey colour; the white colour that appears when you can edit the table is preferrable?
c. how can you get rid of the ... buttons?

Answering these questions would make your article even more useful.

Posted by jkost on November 12, 2010 at 04:36 AM PST #

Changing the label of the nodes column from "Nodes" to "Name" may be accomplished by passing a parameter to the constructor:

OutlineView ov = new OutlineView("Name");

Posted by Hermien Pellissier on December 06, 2010 at 10:37 PM PST #

!! Muchas gracias Geertjan !!
Estuve tres días buscando un ejemplo sencillo para poder comprender el uso del OutlineView. Gracias por compartir tus conocimientos.

Posted by guest on July 01, 2011 at 04:01 AM PDT #

Changing the label of the nodes column from "Nodes" to "Name" may be accomplished by passing a parameter to the constructor:

OutlineView ov = new OutlineView("Name");

or

OutlineView ov = new OutlineView();
ov.getOutline().getColumnModel().getColumn(0).setHeaderValue("Name");

Posted by Burhan Yang on July 31, 2012 at 11:21 AM PDT #

Geertjan,

Good tutorial. I have used your code in combination with a SQlite database. I ran into the problem that the ResultSet is too big for the outlineview (300.000 records). I have tried to find a solution but i did not succeed.

Can you point me the right direction?

Posted by dethleffs on August 16, 2012 at 06:19 AM PDT #

Geertjan,

Good material! Thanks.
But the following line is errorneous under Netbeans IDE 7.3 Beta.
Why?

ov.getOutline().setRootVisible(false);

Posted by guest on October 15, 2012 at 06:53 AM PDT #

Geertjan,

Good material! Thanks.
But the following line is errorneous under Netbeans IDE 7.3 Beta.
Why?

ov.getOutline().setRootVisible(false);

Posted by guest on October 15, 2012 at 06:58 AM PDT #

Because you don't have a dependency on the "ETable and Outline" module.

Posted by Geertjan on October 15, 2012 at 08:12 AM PDT #

Hi
How can I get the complete source code, it seems something is missing in the end!
I need the source code for TreeTable desperately. Thanks for your help.
Mortoza

Posted by guest on December 23, 2012 at 10:55 PM PST #

There is no code missing. Just follow the steps.

Posted by Geertjan on December 24, 2012 at 03:52 AM PST #

Those ... at the end refer to the code that you'll automatically have if you follow the instructions in the blog entry and use the New Window wizard to create your TopComponent. Just follow the instructions in the blog entry, e.g., "Create a new TopComponent, using the Window wizard to do so."

Gj

Posted by Geertjan on December 24, 2012 at 07:33 AM PST #

public final class DemoTopComponent extends TopComponent implements ExplorerManag

Should be

public final class DemoTopComponent extends TopComponent implements ExplorerManager.Provider

Posted by guest on March 06, 2013 at 10:13 PM PST #

Hi all ! I am developing a project for managing worker evidentions which has an explorer window - with worker nodes (belonging to org unit,..), and a editor window which I want to fill with details a for selected node (worker node from the explorer window) - classic master-detail.
I put database stuff into separate module, which consists prepared queries which are visible throug platfom of course, so I just want to achieve this:
1. from the worker explorer window, I select a worker node and a date (they are in proxylookup).
2. in details window, I get those data through listeners, send them to query, get results from query, that is, List<Result>, and populate to outLineView.
3. In case that I select diferent node or a date, of course, just want to refresh results in detail table.
Just that.
ProxyLookup has workerID, and selected date, so, do I have to construct a node in order to fill up a detail table, or is it better to wrap this informations in explorer window, and provide this wrapped node to a explorer lookup ?
I would be very thankfull, for a description ! Thanks in advance !!!

Posted by guest on April 14, 2013 at 01:50 AM PDT #

Post a Comment:
  • HTML Syntax: NOT allowed
About

Geertjan Wielenga (@geertjanw) is a Principal Product Manager in the Oracle Developer Tools group living & working in Amsterdam. He is a Java technology enthusiast, evangelist, trainer, speaker, and writer. He blogs here daily.

The focus of this blog is mostly on NetBeans (a development tool primarily for Java programmers), with an occasional reference to NetBeans, and sometimes diverging to topics relating to NetBeans. And then there are days when NetBeans is mentioned, just for a change.

Search

Archives
« April 2014
SunMonTueWedThuFriSat
  
12
13
14
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today