Hi,
Thanks to NIcolai's help with his minimalist example I'm on track now
and finally I have started to understand better the events in Spec. My
problem was in the incorrect use of whenHighlightedItemChanged. Now the
code its working fine and I can browse the tree and see the related
contents on the respective UI panels (see attached screenshot and code
at [*] at the end to see how was solved).
Now I'm facing another issue: As you can see in the attached screenshot
the UI has four parts: A tool bar above all, a tree with the node title
(called node header) at left and a bigger panel at right with node
contents (called node body). I would like to make the node body behave
in a similar way as in my previous non-Spec interface, so it can react
differently according to the node tags. If the node is tagged as code,
it will become a playground with node contents inside such playground.
If node is not tagged it will be a text like now (this is already
working). So my questions are:
1) How can I populate a Spec-Glamour playground with a particular text code?
2) How can I initializeWidgets with some kind of conditions depending on
the kind of selection I have done on the tree? At this moment my
initializeWidgets look like this:
==[2a]===========
GrafoscopioGUI>>initializeWidgets
"Buils graphical interface elements"
windowMainMenu := self windowMainMenu.
tree := self tree.
nodeHeader := self newTextInput.
nodeBody :=
tree selectedItem notNil
ifTrue: [ self updateBody ]
ifFalse: [nodeBody := self newText].
windowMainMenu applyTo: self.
self focusOrder
add: windowMainMenu;
add: tree;
add: nodeHeader;
add: nodeBody.
================
and my updataBody (where I think that this conditional behavior could be
looks like this:
==[2b]===========
GrafoscopioGUI>>updateBody
"update the displayed content associated to the body of a node"
(tree selectedItem content tags = 'código')
ifTrue: [
^ nodeBody text: 'I should be playground because I am
tagged as ', tree selectedItem content tags
]
ifFalse: [
^ nodeBody text: tree selectedItem content body
]
================
So, more precisely, what I need to put in the ifTrue part of [2b] to
make the interface to return a playground with pre-populated code? (is
it the proper place?)
Finally, here is the code that made the tree update properly, just for
the curious ones.
==[*]============
GrafoscopioGUI>>tree
| notebook |
notebook := GrafoscopioNode new becomeDefaultTestTree.
tree := TreeModel new.
tree
roots: notebook children;
childrenBlock: [:node | node children];
displayBlock: [:node | node title ].
tree whenHighlightedItemChanged:
[tree selectedItem notNil
ifTrue: [
self updateHeader.
self updateBody.
]
].
^ tree
================
Cheers,
Offray
On 03/01/16 18:33, Offray Vladimir Luna Cárdenas wrote:
Thanks again Nicolai! I will start from here :-).
Offray
On 03/01/16 18:20, Nicolai Hess wrote:
2016-01-03 23:52 GMT+01:00 Offray Vladimir Luna Cárdenas
<off...@riseup.net>:
Hi,
On 03/01/16 08:45, Nicolai Hess wrote:
There is any way to run a minimal GUI with a tree using your
example? I'm still missing a key concept on how to use spec
and binding between widgets.
what is missing ? this is a minimal gui with a tree component.
Ohh, what is missing is not in the example, but in my
understanding on how to use/start it. I would expect for
something like "example openWithSpec" to start deconstructing it,
but I'm still lost about it. I will be working on it today and
tomorrow to see if I can come with better questions.
Ok, for this example you can just start it with:
TreeDemo new openWithSpec
It opens a window with two panes, the upper pane shows a tree with
some nodes (subclasses of class Morph)
The lower pane shows the text(name) of the selected node. You can
change and accept (cmd+s) the text in the
lower pane, which will update the name of the tree node.
Cheers,
Offray
