1 / 31

Graphical User Interfaces in Haskell

Graphical User Interfaces in Haskell. Koen Lindström Claessen. First a Demo. An editor for simple straight line drawings. Line currently being drawn by dragging the mouse. A graphical user interface. Remove last line drawn. Load and save drawings to files. Saving a Drawing.

carina
Download Presentation

Graphical User Interfaces in Haskell

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Graphical User Interfaces in Haskell Koen Lindström Claessen

  2. First a Demo An editor for simple straight line drawings Line currently being drawn by dragging the mouse A graphical user interface Remove last line drawn Load and save drawings to files

  3. Saving a Drawing File selection dialogue

  4. GUI Libraries • GUI programming is complex • Much graphics programming needed • Many different elements needed (buttons, scroll bars, menus, entry fields…) • It is not practical to write a GUI from scratch • We must use an existing GUI library

  5. Portability • Every platform provides a GUI library… • …but they are all different! • The differences are more than just skin deep • How do we write portable programs with GUIs?

  6. Two Roads to Portability Applications Applications New portable GUI library Portable interface Windows GUI lib Mac GUI library Linux GUI lib Windows Mac Linux Windows Mac Linux • The Java approach • Interfaces ”look funny” • The wxWindows approach • Native look and feel

  7. wxHaskell Haskell applications Industrial strength open source library wxHaskell 500 C++ classes with 4000 methods! wxWindows Windows GUI lib Mac GUI library Linux GUI lib • There are many ”native Haskell” GUI libraries: • More ”Haskellish” • Generally not portable • Generally less complete • wxHaskell is a good compromise. Windows Mac Linux

  8. GHC • wxHaskell only works with GHC • Glasgow Haskell compiler Prog.hs prog Haskell main program ghc –package wx –make Prog -o prog Compiled code A compiled program like any other Cannot call individual functions in an interpreter

  9. Haskell Main Programs • Definition main :: IO () • In module Main (the default) Main programs produce no ”result” – they just do input/output Hello.hs main :: IO () main = do putStrLn ”What is your name?” name <- getLine putStrLn (”Hello ”++name)

  10. Hello with a GUI import Graphics.UI.WX main :: IO () main = start gui gui :: IO () gui = do f <- frame [text := "Hello"] inp <- entry f [] out <- entry f [] but <- button f [ text := "Hello” , on command := do s <- get inp text set out [text := "Hello "++s] ] set f [ layout := floatCentre $ column 5 [ label "What is your name?” , widget inp , widget but , widget out ] ] Import wxHaskell (a hierarchical library) Start up the GUI

  11. GUI Concepts A frame – top level window Panel Panel Panel Several panels contained in one frame Widgets – ”WIndow gaDGETS” Entry fields and buttons are controls

  12. GUI Hierarchy • Every GUI element (except a frame) has a parent • We specify the parent at creation Create a frame (no parent) f <- frame [text := "Hello"] inp <- entry f [] out <- entry f [] but <- button f [text := "Hello", on command := do s <- get inp text set out [text := "Hello "++s]] Create two entry fields (with parent f) Create a button (with parent f) The first parameter of a creation call is always the parent.

  13. Attributes • GUI elements have attributes • Rather like the fields of a record, or components of a data structure • Types: Attr w a • An attribute of type a, for a widget of type w • Attributes can be specified at creation • Type checker ensures attributes match the widget type f <- frame [text := "Hello"] Create a frame with text attribute ”Hello” Do not confuse this with assignment – we are just specifying a list of attribute values

  14. Overloading • The same attribute name can be used with many different widget types • Attribute names are overloaded • Type: text :: Textual w => Attr w String • Same idea used for many, many attributes f <- frame [text := "Hello"] but <- button f [text := "Hello”]

  15. Layout • The layout attribute specifies the appearance on the screen f <- frame [text := "Hello"] set f [layout := floatCentre $ column 5 [label "What is your name?", widget inp, widget but, widget out]] Place argument in the centre of the frame widget converts GUI elements to a layout for inclusion in a frame

  16. Instructions • Controls have attributes which are instructions to follow if the user activates them • A GUI’s purpose is to let a user give instructions to the computer These instructions are followed when the button is pressed but <- button f [text := "Hello", on command := do s <- get inp text set out [text := "Hello "++s]] on creates an instruction attribute

  17. Modifying Attributes • Attributes can be read and modified • Modifying attributes changes what appears on the screen Instructions to read the value of an attribute do s <- get inp text set out [text := "Hello "++s]] Instructions to modify one or more attributes

  18. Invisible Widgets • Some widgets are invisible • They still have attributes that can be set and modified • Examples: • Timer widget • Interval • On command • Variable widget • Value

  19. Functions vs. Instructions Only the knowledge about the string is needed to understand the result… Compare: f :: String -> Int vs g :: String -> IO Int Anything can be used to compute the result: Reading from files, randomness, user input…! Moreover, anything can be modified or changed!

  20. Design Principles • Separate the GUI from the functionality as much as possible • So that the GUI can later be replaced without changing the functionality • Avoid duplicating code as far as possible • So that errors need be fixed only once (c.f. ”cut and paste programming”)

  21. Modelling the State • A GUI is often used to edit or modify something • What is the state?

  22. Examples • Hello.hs • Simple hello example • BouncingBalls.hs • A simple animation containing bouncing balls • Draw.hs • A simple drawing program • Mine.hs • A version of the game minesweeper

  23. How do I find the right function? • Haskell has many hierarchical libraries, with documentation on the web • Every wxHaskell function is documented on the web • Know how to find the documentation!

  24. haskell.org Libraries!

  25. haskell.org/libraries/ Hierarchical libraries! You have these already.

  26. Hierarchical Libraries Lots of modules

  27. Googling wxHaskell Here it is!

  28. wxHaskell Home Page Documentation

  29. wxHaskell Documentation Haddock documentation for wxHaskell General information on wxWidgets – sometimes you have to read this

  30. wxHaskell Haddock Controls: Buttons, entry fields etc Layout: Operators to build layouts Classes: one for each attribute Draw: Functions for drawing on a panel Dialogs: Built-in popups, e.g. for choosing a file And much, much, more! Ignore WXCore! It’s a level below wxHaskell Attributes: defines set, get, (:=), …

  31. Reading • http://wxhaskell.sourceforge.net/ • wxHaskell: A Portable and Concise GUI Library for Haskell, Daan Leijen • Haskell Workshop, Salt Lake City, 2004 • http://www.cs.uu.nl/~daan/download/papers/wxhaskell.pdf

More Related