CS108 Lecture 28: Graphical User Interface: Using PythonCard - PDF document

CS108 Lecture 28: Graphical User Interface: Using PythonCard Dialogs Aaron Stevens 8 April 2009 1 Overview/Questions – How do we start developing GUI applications? – Programming with events: Some useful starter code. – Using the PythonCard Code Editor. – Using pre-made dialogs to create snazzy looking GUI applications with very little new code. 2 1

PythonCard GUI: Getting Started We will have 2 files for any PythonCard GUI application we create: – <filename>.py : the application code – <filename>.rsrc.py : the resource file, which defines the layout of the GUI widgets and their properties. We will begin our GUI programming by using some starter code which creates a basic window. – starter01.py : the application code – starter01.rsrc.py : the resource file 3 GUI Applications: Getting Started The starter code creates this basic window: which has a single button on it. We’ll come back to how to design such a window next time.  Notice the window takes on the “native” look and feel for either Windows or Mac, as needed. 4 2

GUI Applications: Getting Started The starter code has a simple class definition as well, which we will modify: 5 GUI Applications: Getting Started Notice the following things about this starter code: – Class Minimal inherits from model.Background – Some event handler methods have been defined. 6 3

PythonCard Code Editor PythonCard GUI applications do not seem to run nicely in IDLE on Windows. – Seems to work fine on Mac OSX. – Works for me on Windows on my Mac. The PythonCard distribution comes with its own tool, called Code Editor. – Look for it:  Start / Programs / PythonCard / Code Editor 7 Using an Event Handler We can test out these event handlers by writing some code in the methods, and seeing when it executes. For example: 8 4

Dialogs Dialogs are windows which are used for specific user-interactions. Several common dialogs appear in many programs: – Message box – Text entry – Scrollable text output – Single/multiple choice (select from a list) – Pick a color – Open a file 9 Dialogs Dialogs are windows which are used for specific user-interactions. Several common dialogs appear in many programs: – Message box – Text entry – Scrollable text output – Single/multiple choice (select from a list) – Pick a color – Open a file 10 5

Modality Modality refers to a dialog (window) being optional or required. – A modal window must be “dismissed” by the user before returning to the “parent” window. – A non-modal window can be ignored. 11 Message Dialog The Message Dialog produces this kind of window: It is invoked using this general form: result = dialog.messageDialog(self, <message>, <title>) Print out return value to see its elements. Note optional parameters for icon, buttons. 12 6

Text Entry Dialog The Text Entry dialog produces this kind of window: It is invoked using this general form: result = dialog.textEntryDialog(self, <message>, <title>, <defaultText>) Print out return value to see its elements. 13 Single Choice Dialog The Single Choice Dialog produces this kind of window: It is invoked using this general form: result = dialog.singleChoiceDialog(self, <message>, <title>,<list>) Print out return value to see its elements. Note optional parameters for icon, buttons. 14 7

Scrolled Message Dialog The Scrolled Message Dialog produces this kind of window: It is invoked using this general form: result = dialog.scrolledMessageDialog(self, <message>, <title>) Print out return value to see its elements. 15 File Dialog The File Dialog produces this kind of window: It is invoked using this general form: result = dialog.fileDialog(self, <message>, <path>, <filename>, <wildcard>) Note: this dialog will accept several blank values: result = dialog.fileDialog(self, <message>,’’,’’,’’) Print out return value to see its elements. 16 8

About the Dialogs’ Return Values Each provides data back to the programmer using an object of type DialogResults , which provides data members to read user responses. – The API page lists the specific return parameters, which are data members of the result object.* Example (for Single Choice Dialog): print result.selection *Note: the API page is wrong when it says that the return value is a dict object. It should read: "The <whatever>Dialog component returns a wxPython DialogResults object which contains <number> values, as shown in the following table." 17 From Dialogs to Applications We can apply the input, process, output design pattern for GUI applications using dialogs: – Present a dialog to the user, and collect some input. – Use that input in processing. – Present the output in another GUI dialog. 18 9

Take-Away Points – PythonCard files: .rsrc.py , .py – PythonCard Code Editor – Using the PythonCard pre-packaged dialogs 19 Student To Dos – Readings: The PythonCard Dialogs: (today) http://pythoncard.sourceforge.net/dialogs/index.html The PythonCard Resource editor (next week) http://pythoncard.sourceforge.net/resource_editor_overview.html – Install wxPython and PythonCard ** only needed if you want to do hws on your own computer – Aaron’s Office Hours changed this week only:  Friday: Cancelled – NO LECTURE on FRIDAY 4/10 – HW12 is due TUESDAY 4/14 20 10