1- Create a category

Before creating a block, you probably need to create a category. By default, in Phratch there are 10 shown categories. Each of these categories has 4 properties:

• a label, which is shown as the name of the category (for example “Motion”)
• a color, which is the color of the blocks inside the category. For now, the category has not necessarily the same color because the display of a category is based on an image in the scrachSkin subdirectory. This point is not explained here. We will use a basic color for the category.
• an order number, which represents the place of your category in the display screen.
• a viewer page, which represents how the category is displayed when we click on it. Most of the categories have the basic behavior (displaying blocks), but sometimes, we can need specific ones. For example,the category “Variables” has some buttons (Make a variable, Make a list and Make a block). Here we will use the basic viewer page.

So, let’s go for creating our own category.
In the Pharo environment, create a class which is a subclass of PhratchCategory, like the following one:

PhratchCategory subclass: #PhratchCategoryMyFirst 
    instanceVariableNames: ''
    classVariableNames: ''
    poolDictionaries: ''
    category: ‘MyOwnBlocks’

In the class side of your new class, add these methods:

color
    ^(Color r: 0.1 g: 0.2 b: 0.7)

where the color can have others values.

label
    ^'my category'

This label will be used to place your future block in this category and is used for the display.

order
    ^9

which gives the place where the category will be placed.

Your first category is done. Congratulation !
To see it in Phratch, just relaunch Phratch, with this command:

PhratchFrameMorph closeAndOpen.

Your empty category is available in the Phratch environment.

A last thing about category: when a category is created, a new setting appears in the Setting browser. This setting allows to show or hide the category in Phratch. By default, the value is true.

2- Create a specific sprite

In Phratch a block is a message sent to a Sprite. By default the Sprite “Sprite1” is a PhratchSpriteMorph. If you need to have a specific behavior, just create a subclass of it. Then, you will have the possibility to select this new specific sprite when creating a new sprite in Phratch.

In this tutorial, we do not create a new sprite. We will use the generic one.

3- Create a first blocks

In PhratchSpriteMorph, create a protocol “*MyOwnBlocks”, to be clean with the modularity of the system.
Then you can add your behavior. It can be what you want. For example, I want to open a Transcript. For that, my method is:

openTranscript
    ^Transcript open

For now, the method is not visible in Phratch. To make it visible, add the following pragma:

openTranscript
    <phratchItem: 'open a transcript'
        kind: #-
        category: 'my category'
        defaultValues: #()
        subCategory: #a
        special: #()>
    ^Transcript open

When updating the view in Phratch, by clicking on “My category” a new block appears. By clicking on this block a transcript appears.
You have written your first block !

4- About the pragma

The pragma used to declare a new block in Phratch has the following form:

<phratchItem: '' kind: #- category: '' defaultValues: #() subCategory: #a special: #()>

• phratchItem contains the label of the block. It contains also the entry for parameters.
• kind is the kind of block. By default “#-“ means that the block is a CommandBlockMorph.
• defaultValues is an array with the default parameter if your block needs them.
• subCategory is a symbol that allows you to order blocks inside your category.
• special is an array with special behavior that should be executed on the block before the block execution (the main use is the parametrization of the block itself).

Let’s go for another example. Write this method, which open a Nautilus browser a a specific class:

openBrowserOn: aStringClass
    <phratchItem: 'open a browser on: $String$'
        kind: #-
        category: 'my category'
        defaultValues: #('Collection')
        subCategory: #a
        special: #()>
    Nautilus fullOnClass: (Smalltalk at: aStringClass asSymbol)

Here, you can see that a parameter is present in phratchItem: this parameter is a String. So, we have a block that open a browser on a class that you can parametrize. The default value is ‘Collection’. You can change it by an existing class.

In Phratch environment, click on this new block, you will see a browser on Collection.

5- Types

All types are declared in the class PhratchType.
Each type is declared with the pragma <phratchType: #’’>. You can browse these methods to see existing types.

6- Kind of blocks

A block can have multiple forms. In our examples, we manipulated the CommandBlockMorph. It exists multiple ones. You can see them as subclasses of BlockMorph.
The main ones are CommandBlockMorph that executes a command, ReporterBlockMorph that returns a value, BooleanBlockMorph that returns a boolean.

I stopped this tutorial here. It is enough to write simple blocks in Phratch. You can discover kinds of block or types by right-clicking on an existing block of the system, then ‘show block’ in the menu. You will see the method and particularly the associated pragma.