4.2.1 Pop up ¶

The class PopUpMenu provides an easy way to render a dialog that displays information, asks the user for confirmation, or ask the user to select an option. It is similar to the JavaScript DOM functions alert and confirm. For example:

Figure 4.1: A pop up menu to inform

PopUpMenu inform: 'Something interesting just happened.'.

Figure 4.2: A pop up menu to answer Yes or No

likesIceCream := PopUpMenu confirm: 'Do you like ice cream?'.
likesIceCream print. "prints true or false"

Figure 4.3: A pop up menu to select among two choices

likesIceCream := PopUpMenu
    confirm: 'Do you like ice cream?'
    trueChoice: 'Love it!'
    falseChoice: 'Not for me'.
likesIceCream print. "prints true or false"

Figure 4.4: A pop up menu to select among several choices

color := PopUpMenu withCaption: 'Choose a color.' chooseFrom: #('red' 'green' 'blue').
color print. "prints choice index 1, 2, or 3"

4.2.2 Selection menu ¶

The SelectionMenu class is a subclass of PopupMenu, it gives a bit more flexibility to the developer. Indeed, once the user selected a menu entry, instead of returning this index entry as PopUp Menu does, it returns an associated object to this entry. It is therefore more flexible.

For example,

labels := #('Red sky at sunset' 'A Clockwork Orange'
   'Yellow submarine' 'Green peace' 'The Blue dot' 'Purple rain').
lines := #(3 6). "draw lines after these indexes"
menu := SelectionMenu labels: labels lines: lines.
selection := menu startUpMenu.
selection print. "prints the selected menu entry index"

still returns the index of the selected menu entry, which may not be very helpful.

Figure 4.5: A selection menu without title

What we want is a color object instead of an index. To do so, we tell SelectionMenu about a collection of colors from which to obtain the returned value depending on the user selected menu entry.

...
colors := {Color red . Color orange. Color yellow . Color green . Color blue . Color purple}.
menu := SelectionMenu labels: labels lines: lines selections: colors.
selection := menu startUpMenu.
selection print. "prints the selected color"

In the following example we demonstrate a use case of SelectionMenu in a MenuDemo class

Object subclass: #MenuDemo
   instanceVariableNames: 'colorButton statusLabel window'
   classVariableNames: ''
   poolDictionaries: ''
   category: 'Demos'

Figure 4.6: A button to invoke a selection menu

We put in place all the widgetery involved.

initialize

colorButton := PluggableButtonMorph
   model: self
   action: #openMenu
   label: 'Select Color'.
statusLabel := LabelMorph contents: ''.

window := SystemWindow new.
window layoutMorph separation: 10.
window
   setLabel: 'Menu Demo';
   addMorph: colorButton;
   addMorph: statusLabel;
   openInWorld;
   morphExtent: (300 @ window layoutMorph minimumExtent y)

Once the button is clicked, we request at run time the menu with the appropriate selection of colors from which to pick an answer.

colorMenu

^ SelectionMenu 
   labels: #('Red sky at sunset' 'A Clockwork Orange' 'Yellow submarine' 'Green peace'
      'The Blue dot' 'Purple rain')
   selections: {Color red . Color orange. Color yellow . Color green . Color blue . Color purple}

Figure 4.7: A selection menu open

then we adjust the window color and button label accordingly

openMenu

| selectedColor |
(selectedColor := self colorMenu startUpMenu) ifNotNil: [
   colorButton label: selectedColor name.
   statusLabel contents: ('You selected {1}.' format: { selectedColor name }).
   window layoutMorph color: (selectedColor alpha: 0.6) ]

Figure 4.8: Result of the user selection in the menu

To run this, evaluate MenuDemo new in a Workspace.

4.2.3 String request ¶

The class StringRequestMorph prompts the user to enter a text response. It can verify the response using a provided block that returns a Boolean value indicating whether the response is valid. It can also evaluate a block if the user clicks the cancel button.

For example:

Figure 4.9: A StringRequestMorph open

StringRequestMorph
    request: 'Comment'
    initialAnswer: 'no comment'
    verifying: [ :answer | answer isEmpty not ]
    do: [ :answer | answer print ]
    orCancel: [ 'canceled' print ].