GUI components

GUI components

We looked at several programs that used GUI components. The first is TextController. It puts an input field named input at the bottom of the screen and then picks up the contents of that field and draws it on the canvas when the mouse is clicked. It is created and added with

    // the field to hold user input
    def input: TextField = textField.labeled("Type your name")

    // add the actual text field to bottom of window
    append(input)

We access the value in the input field by writing input.text.

The next program is TextButtonController. It contains a text field and a button at the top of the screen.

The most important new feature in this program is the way we program a response to the user pressing the clear button:

    // add the listener
    clearButton.onMousePressDo {mevt:MouseEvent ->
       canvas.clear
    }

We are not defining a method here. Instead we are sending the onMousePressDo method request to the button and associating with it the action (which takes a mouse event as a parameter - which it then ignores - and the clears the canvas). This block must always have a mouse event parameter, even though you will rarely use it.

GUI components