[4.1] How do I use ToolBuilder to construct a three pane browser?

Hello

I would like to construct a three pane browser to inspect a dictionary
of dictionaries (see data structure example code below). How do I do
this using the ToolBuilder? I would like to learn to use it.

The class comment of ToolBuilder
"I am a tool builder, that is an object which knows how to create
concrete widgets from abstract specifications. Those specifications
are used by tools which want to be able to function in diverse user
interface paradigms, such as MVC, Morphic, Tweak, wxWidgets etc"

What I have done so far it to construct a two pane browser for
browsing a dictionary showing only the keys not the instance
variables. I did this by subclassing DictionaryInspector and
overriding 4 methods. (see screen shot)

I assume for the Three pane browser I'd have to construct a three pane
browser from scratch using ToolBuilder.

myLessons := Dictionary new.

myLessons at: 'lesson1' put: ((((Dictionary new
        at: 'section1' put: 'the string for section 1 of lesson01'; yourself)
        at: 'section2' put: 'the string for section 2 of lesson01';  yourself)
        at: 'section3' put: 'the string for section 3 of lesson01'; yourself)).
       
myLessons at: 'lesson2' put: (((((Dictionary new
        at: 'section1' put: 'the string for section 1 of lesson2'; yourself)
        at: 'section2' put: 'the string for section 2 of lesson2';  yourself)
        at: 'section3' put: 'the string for section 3 of lesson2'; yourself))
        at: 'section4' put: 'the string for section 4 of lesson2'; yourself).
       
myLessons at: 'lesson3' put: ((((Dictionary new
        at: 'section1' put: 'the string for section 1 of lesson3'; yourself)
        at: 'section2' put: 'the string for section 2 of lesson3';  yourself)
        at: 'section3' put: 'the string for section 3 of lesson3'; yourself)).
       
myLessons explore

Thank you for suggestions/hints or maybe just the answer in advance.
For me this is an example for constructing more complex things.

Hannes

_______________________________________________
Beginners mailing list
[hidden email]
http://lists.squeakfoundation.org/mailman/listinfo/beginners

On 19.04.2010, at 11:45, Hannes Hirzel wrote:
Maybe look at Browser>>buildWith: or all the other buildWith: implementations? No need to subclass DictionaryInspector, I'd simply subclass Model.

You would have two lists, and a text pane. Your model will have to provide methods to get the list and get/set the current index. E.g. #lessonList, #lessonListIndex, #lessonListIndex: and #sectionList, #sectionListIndex, #sectionListIndex:.

When you select something in the lesson list, #lessonListIndex: will be sent. In response, you would send "self changed: #sectionList" which will cause the section list to be updated. Etc.

- Bert -


_______________________________________________
Beginners mailing list
[hidden email]
http://lists.squeakfoundation.org/mailman/listinfo/beginners

On 19.04.2010, at 12:02, Bert Freudenberg wrote: After actually having a look, Browser>>buildWith: etc. are already specialized for code tools. No need for that.

Also, for lists as in your case, working with indices for the selection is less convenient than with objects.

So here's a build method for your model - just implement all the accessors and it works. A complete UI in one method ;)

buildWith: builder
        ^builder build:
                (builder pluggableWindowSpec new
                        model: self;
                        children: {
                                (builder pluggableListSpec new)
                                        model: self;
                                        list: #lessonList;
                                        getSelected: #lesson;
                                        setSelected: #lesson:;
                                        frame: (0@0 corner: 0.5@0.2).
                                (builder pluggableListSpec new)
                                        model: self;
                                        list: #sectionList;
                                        getSelected: #section;
                                        setSelected: #section:;
                                        frame: (0.5@0 corner: 1@0.2).
                                (builder pluggableTextSpec new)
                                        model: self;
                                        getText: #contents;
                                        frame: (0@0.2 corner: 1@1).
                        })




- Bert -

PS: I'd consider it cheating if you look at this:
_______________________________________________
Beginners mailing list
[hidden email]
http://lists.squeakfoundation.org/mailman/listinfo/beginners

Bert
Thank you for this second mail. I actually was struggling with
converting the 'lesson1', 'lesson2' etc back to the index.

I had a method

lessonListIndex: aLessonString
        lessonListIndex := self lessonList indexOf: aLessonString.
        self changed: #sectionList

Your 'buildWith: builder' looks very need. So I'll go for that do not
go for Integer indices.

I'll try it - without looking at your solution :-)

Hannes

On 4/19/10, Bert Freudenberg <[hidden email]> wrote: _______________________________________________
Beginners mailing list
[hidden email]
http://lists.squeakfoundation.org/mailman/listinfo/beginners

Bert

This was a very helpful learning experience.

Crucial is that lesson and section are the keys (strings) of the dictionaries.

Very neat that only a model class with the GUI code defined in one
method is needed.

Thank you!

Hannes

On 4/19/10, Hannes Hirzel <[hidden email]> wrote: _______________________________________________
Beginners mailing list
[hidden email]
http://lists.squeakfoundation.org/mailman/listinfo/beginners

And here is the code written along the same lines for a simple
dictionary browser (the initial example).

     MyDictionaryInspector example

or

d := Dictionary new.
d at: 'green' put: 'gruen'.
d at: 'red' put: 'rot'.
d at: 'blue' put: 'blau'.
inspector := MyDictionaryInspector new dictionary: d.
ToolBuilder open: inspector label: 'MyDictionaryInspector'.



Hannes

"-------------------------------------------------------------------------------------------------------------------------"

'From Squeak4.1 of 17 April 2010 [latest update: #9956] on 20 April
2010 at 9:06:08 am'!
Model subclass: #MyDictionaryInspector
        instanceVariableNames: 'dictionary key'
        classVariableNames: ''
        poolDictionaries: ''
        category: 'HHWorkplace2010'!
!MyDictionaryInspector commentStamp: 'hjh 4/20/2010 04:41' prior: 0!
A MyDictionaryInspector is a Model for a dictionary which has a
user-friendly view. It does not show internal things like the regular
DictionaryInspector which is as well a subclass of Model. Note: It
might have been an idea to subclass StringHolder instead of model.

more see class side example

April 2010
!


!MyDictionaryInspector methodsFor: 'toolbuilder' stamp: 'hjh 4/20/2010 04:08'!
buildWith: builder
        "self example"
        ^builder build:
                (builder pluggableWindowSpec new
                        model: self;
                        children: {
                                (builder pluggableListSpec new)
                                        model: self;
                                        list: #keysList;
                                        getSelected: #key;
                                        setSelected: #key:;
                                        frame: (0@0 corner: 0.5@1.0).
                                (builder pluggableTextSpec new)
                                        model: self;
                                        getText: #contents;
                                        setText: #contents:;
                                        frame: (0.5@0 corner: 1.0@1.0).
                        })
! !


!MyDictionaryInspector methodsFor: 'accessing' stamp: 'hjh 4/20/2010 04:21'!
contents
        key isNil ifTrue: [^''].
        ^dictionary at: key! !

!MyDictionaryInspector methodsFor: 'accessing' stamp: 'hjh 4/20/2010 04:19'!
dictionary: aDictionary
        dictionary := aDictionary! !

!MyDictionaryInspector methodsFor: 'accessing' stamp: 'hjh 4/20/2010 04:10'!
key
        ^ key! !

!MyDictionaryInspector methodsFor: 'accessing' stamp: 'hjh 4/20/2010 04:25'!
key: aString
        key := aString.
        self changed: #contents.! !

!MyDictionaryInspector methodsFor: 'accessing' stamp: 'hjh 4/20/2010 04:20'!
keysList
        ^ dictionary keys! !

"-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- "!

MyDictionaryInspector class
        instanceVariableNames: ''!

!MyDictionaryInspector class methodsFor: 'documentation' stamp: 'hjh
4/20/2010 04:41'!
example
"self example"
        | example |
        example := self new.
        example dictionary: self exampleDictionary.
        ^ToolBuilder open: example label: 'MyDictionaryInspector - Colors'! !

!MyDictionaryInspector class methodsFor: 'documentation' stamp: 'hjh
4/20/2010 04:18'!
exampleDictionary

        | d |
        d := Dictionary new.
        d at: 'red' put: 'rot'.
        d at: 'blue' put: 'blau'.
        d at: 'green' put: 'gruen'.
        d at: 'yellow' put: 'gelb'.
        d at: 'orange' put: 'orange'.
        d at: 'brown' put: 'braun'.
        d at: 'white' put: 'weiss'.
        d at: 'black' put: 'schwarz'.
        ^d! !


On 4/19/10, Hannes Hirzel <[hidden email]> wrote:
_______________________________________________
Beginners mailing list
[hidden email]
http://lists.squeakfoundation.org/mailman/listinfo/beginners