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: – .py : the application code – .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, , )

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, , , )

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, , ,)

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, , )

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, , , , )

Note: this dialog will accept several blank values: result = dialog.fileDialog(self, ,’’,’’,’’)

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 Dialog component returns a wxPython DialogResults object which contains 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