How to make a GUI using Lisp: DrScheme or Common L

Question

Or the basic work need to do to create a GUI. I know the basic Components of GUI, but where to begin. I'm just a self-study person and I'm reading "How to Design Program" (HtDP) at the end of the book the author suggest that knowledge of GUI and CGI computer network are needed to be a programmer. The information of the last two is easy to find. But it seems there are little book talking about how to create a GUI. I guess maybe it's too "low" in the process designing the computer program that few people even care.

Answer 1

• If you want to just make the simple GUI in Common Lisp, your best choice, in my opinion, is LTK, which is a high-level interface to Tcl/Tk scripting library
• There are plenty of other choices, but they require some vision of what you are trying to achieve. If you want to use one of the wide-spread GUI toolkits (GTK or Qt) there are CL-GTK2 and CommonQt. But you have to first of all understand well, how these toolkits work
• LispWorks provides a very sophisticated GUI-builder library CAPI, which is cross-platform
• On the Mac ClozureCL has good Cocoa bindings
• Finally there's a full-blown native CL solution for GUI - McCLIM - which is very flexible, but pretty involved

Also, if you want to understand GUI and study it from the theoretical point of view, you should learn about various GUI-patterns, such as MVC, Model2, MVVM etc. I don't know about any GUI-framework in Lisp, implementing such patterns, so doing such a project may be an interesting learning experience...

Answer 2

A recent article on the current state of the Common Lisp ecosystem says: CommonQt plus Qtools is the way to go nowadays.

Answer 3

There's a lightweight library for writing simple graphical programs through 2htdp/universe. See: How to Design Worlds.

The basic idea is that modern graphical libraries are highly event-driven: you interact with the external world by responding to events. If you look at it closely enough, the universe library is an implementation of the MVC model: the world is the "Model", the to-draw the "View", and all the other event handlers the "Controller".

If you want to work with more low-level elements in Racket, you can use the racket/gui libraries. These have reference documentation in The Racket Graphical Interface Toolkit. Here's a small example that uses the library:

#lang racket

(require racket/gui/base
         2htdp/image
         (only-in mrlib/image-core render-image))

;; The state of our program is a number.
(define state 0)

;; On a timer tick, increment the state, and refresh the canvas.
;; tick!: -> void
(define (tick!)
  (set! state (add1 state))
  (send THE-CANVAS refresh))


;; When a canvas paints itself, use the following:
;; paint: canvas% dc<%> -> void
(define (paint! a-canvas my-drawing-context)
  (define my-new-scene (text (format "I see: ~a" state) 20 'black))
  ;; Note: we force the canvas to be of a particular width and height here:
  (send a-canvas min-client-width (image-width my-new-scene))
  (send a-canvas min-client-height (image-height my-new-scene))
  (render-image my-new-scene my-drawing-context 0 0))


;; Here, we initialize our graphical application.  We create a window frame...
;; THE-FRAME: frame%
(define THE-FRAME (new (class frame%
                         (super-new)
                         ;; When we close the frame, shut down everything.
                         (define/augment (on-close)
                           (custodian-shutdown-all (current-custodian))))
                       [label "Example"]))


;; and add a canvas into it.
;; THE-CANVAS: canvas%
(define THE-CANVAS (new (class canvas%
                          (super-new)

                          ;; We define a key handler.  Let's have it so it
                          ;; resets the counter on a key press
                          (define/override (on-char key-event)
                            (when (eq? (send key-event get-key-code) 'release)
                              (set! state 0)
                              (send THE-CANVAS refresh))))
                        [parent THE-FRAME]
                        [paint-callback paint!]))

;; We get the frame to show on screen:
(send THE-FRAME show #t)

;; Finally, we set up a timer that will call tick! on every second.
(define THE-TIMER (new timer% 
                       [notify-callback tick!]
                       [interval 1000]))

Answer 4

The documentation for GUI programming in DrRacket (the name of current versions of DrScheme) is here: http://docs.racket-lang.org/gui/index.html

Since you're reading HTDP, this is probably the best option for you right now.