Before we get on with configuring our widgets, I want to point out a couple of things in our ClassHierarchyBrowser so far. First we have to open it:
ClassHierarchyBrowser open
Executing that in a workspace opens our browser. What I wanted to point out is that there are already things automatically working here. You can right click on the "Class" TreeView pane (upper left pane), and you'll see the standard TreeView popup menu, with the collapse and expand options. You can click on the TextEdit (bottom) pane, and see the standard copy/cut/paste popup menu. You can also do some simple editing. If you do some editing, you'll see that the TextEdit still needs some work.... Well, maybe more than just some... We know that.
Today we simply want to give the TreeView something to display. We'll start with the simplest thing that can possibly work. So, in the #createInterface method, we'll add the following line of code right after the TreeView has been added to the window:
pane tree: (Pollock.Tree
on: Object
childrenBlock: [:each | each subclasses]
hasChildrenBlock: [:each | each subclasses notEmpty]).
The above is published as version 1.3 in the Package named "PollockBlog" on the Cincom public repository.
As you see, the TreeView has a method, named #tree: which allows you to set the tree object that it manages. A Tree is a "new" Pollock domain object, which allows you to specify a target root object (the "on:" argument), a one argument block that allows you to specify how to get children for any item in the tree (the "childrenBlock:" argument), and another one argument block that is evaluated for you to determine if any item in the tree actually has children.
Smalltalk makes an easy thing to model in a tree, since each class in the Smalltalk class hierarchy has a method named subclasses, that answers a collection of direct descendents of any class (or an empty collection if there are no subclasses).
So, let's open it up again, and see what we got...
ClassHierarchyBrowser open
Well, our browser now has a tree in the upper left pane. You can click on it, select items and expand them and contract them with the mouse or menu or keyboard (left and right arrow open/close items) However, when the window opened, we only see "Object" and the expander. That's not what we expect to see. So, let's pre-expand the tree. To do this, we add the following code right after the Tree creation code above:
pane expandRootFully.
Opening it again...
ClassHierarchyBrowser open
That's much better! We can see the whole hierarchy there. We can do all kinds of neat stuff now. We can type stuff in (such as "B") and it will find our class with that name and make it visible. If we press space, it then selects it. While we're typing, we can instead press the ESC key, and the lookup resets itself. We can move the mouse over the tree, and use the mouse wheel to scroll it. But there's at least one affordance missing. Scrollbars. So let's add two more lines of code after the last:
The above two changes are published as version 1.4 in the Package named "PollockBlog" on the Cincom public repository.
Opening it again...
ClassHierarchyBrowser open
There we are, we're almost done. Yes, you'll see we need some cleanup of the scrollbar drawing on the Windows platform, we'll get to it all. Anyway, we have a real hierarchy we can search, and we can scroll, and select and so on. But... By default, a TreeView uses "folder" icons. For now, we'll just turn them off to get a nice simple clean tree view. We add the following to our code:
pane showImages: false.
The above is published as version 1.5 in the Package named "PollockBlog" on the Cincom public repository.
Opening one last time...
ClassHierarchyBrowser open
That's not the only thing we can do with a TreeView. Here are some other capabilities you can play with:
aTreeView fullLineSelection: <aBoolean>
(Default = false. When true, it selects the full visible line, not just the text of the item)
aTreeView showExpanders: <aBoolean>
(Default = true. When false, the [+] and [-] don't show)
aTreeView showLines: <aBoolean>
(Default = true. When false, the lines don't show)
Next time, we'll set up the TreeView so that when you select an item, it fills in the protocol (middle) list.
Previous Topic
