Squeak
  QotD    "To be or not to be" – Shakespeare
View this PageEdit this PageUploads to this PageHistory of this PageTop of the SwikiRecent ChangesSearch the SwikiHelp Guide
Introduction to The Browser
Last updated at 8:40 am UTC on 11 March 2007
This page contains a simplistic walk through of the browser with some basic examples and screenshots. It is meant to be a part of the Squeak Tutorial being (slowly) written by the documentation team.

Introduction


The Browser is probably the most fundamental tool in any Smalltalk system. It allows the programmer to explore the classes, methods and variable defined int he system and how they are organised. The Browser also used to rite code and reorganise it and various options are available to help automate common operations.

Opening The Browser


Left-clicking on the background of the Squeak image will open the World menu.

3.9WorldMenu.jpg

The World menu allows access to much of the functionality of Squeak. To access the various tools we open the 'Open' menu.

3.9OpenMenu.jpg

The Open menu lists many of the available programming tools and here we can select Browser.

3.9BrowserOnStartup.jpg

This is the Browser when we first open it. The Browser is divided into 5 panes, four across the top and one below. The four along the top allow us to navigate, the pane below displays the code we have selected. If we take each pane one at a time, from the left.

Category Pane


The Category Pane displays a list of categories in the system. Categories are simply a way or organising classes into easy to remember groups and do not actually have any influence on the code of a program. categories are also used as the organisational unit of the Monticello source code control system, the subject of a later tutorial. when first opened the categories are not alphabetically sorted. We can sort the categories by right-clicking and selecting Alphabetize from the context menu.

3.9BrowserCategoryMenu.jpg

If we want to create a new category, we simply select Add Item from the same context menu and enter the name of our new category in the dialog that appears. Also on this menu is the always useful Find Class, this pops up a dialog we can use to search for and go straight to a particular class. Take some time to browse through the categories to see what is available.

3.9BrowserDialogCreateCatagory.jpg

Class Pane


The Class Pane displays a list of classes within the currently selected category. If you select a class it's basic definition will be displayed in the lower pane. In Smalltalk the definition information is real code and can be edited and saved. To create a class we would firat create a category if necessary and then seelct it. This will bring up the default class definition which we can alter and save.

Object subclass: #NameOfSubclass
	instanceVariableNames: ''
	classVariableNames: ''
	poolDictionaries: ''
	category: 'MyNewCategory'


We simply change the name of the class and save to create a new one.

3.9BrowserCreateClass.jpg

To add an instance variable we type its name between the quotes as seen in the screenshot below and again save.

3.9BrowserCreateInstanceVariable.jpg

Method Categories Pane


Many classes have large numbers of messages and in order to help organise them we use method categories. Again these have no real influence on how the code works but help organise it and make it more manageable. In this method categories are very like the class categories. If we right click on the method category pane we can see the context menu that allows us to create and organise the categories. If we select a particular method category it will then display only the methods within that category, click – all – to see all the methods of the class.

3.9BrowserProtocolMenu.jpg

Method Pane


The method pane shows the methods for the class that are within the currently selected category, here we see a screenshot of a class with a method selected showing the code of that method.

3.9BrowserMethodSelected.jpg

When the code of a method is displayed we can edit it and save to make changes. If we want to create a new method then we simply select the appropriate method category and ensire that we don't have a current method selected. This will display some default code in the lower pane that we simple override and save to create our method.

messageSelectorAndArgumentNames
	"comment stating purpose of message"

	| temporary variable names |
	statements