Tkinter GUIs Computer Science and Software Engineering

Slides:



Advertisements
Similar presentations
Computer Science 112 Fundamentals of Programming II User Interfaces
Advertisements

Noadswood Science,  To know how to use Python to produce windows and colours along with specified co-ordinates Sunday, April 12, 2015.
Chapter 6 Graphical User Interface (GUI) and Object-Oriented Design (OOD)
® IBM Software Group © 2006 IBM Corporation JSF Tab Controls This Learning Module shows how to develop server-side EGL applications with dynamic content.
Escape A sticky man adventure using TKINTER python module By: Channing Burgess.
Computer Science 111 Fundamentals of Programming I User Interfaces Introduction to GUI programming.
Microsoft Visual Basic 2005 CHAPTER 9 Using Arrays and File Handling.
1 Visual Basic for Applications (VBA) for Excel Prof. Yitzchak Rosenthal.
Tip Calculator App Building an Android App with Java © by Pearson Education, Inc. All Rights Reserved.
CS 355 – PROGRAMMING LANGUAGES Dr. X. Copyright © 2012 Addison-Wesley. All rights reserved.1-2 Topics Scope Scope and Lifetime Referencing Environments.
Java Software Solutions Lewis and Loftus Chapter 10 1 Copyright 1997 by John Lewis and William Loftus. All rights reserved. Graphical User Interfaces --
Guide to Programming with Python Chapter Ten GUI Development: The Mad Lib Program.
Ras Bodik CS 164 (Fall 2004) 1 A Small GUI Language.
Object Oriented Software Development 9. Creating Graphical User Interfaces.
More on Hierarchies 1. When an object of a subclass is instantiated, is memory allocated for only the data members of the subclass or also for the members.
Computer Science 112 Fundamentals of Programming II Command Buttons and Responding to Events.
1 Computer Science of Graphics and Games MONT 105S, Spring 2009 Session 20 Graphical User Interface (GUI)
Python Programming Graphical User Interfaces Saad Bani Mohammad Department of Computer Science Al al-Bayt University 1 st 2011/2012.
Computing Science 1P Lecture 17: Friday 23 rd February Simon Gay Department of Computing Science University of Glasgow 2006/07.
Object-Oriented Design Simple Program Design Third Edition A Step-by-Step Approach 11.
Visual C# 2012 How to Program © by Pearson Education, Inc. All Rights Reserved.
Visual C# 2012 How to Program © by Pearson Education, Inc. All Rights Reserved.
How the Session Works Outline Practical on arrival Talk 1 Reflect on practical Clarify concepts Practical exercises at your own pace Talk 2: Further concepts.
Build-A-Button Glenn G. Chappell U. of Alaska Fairbanks CS 381 Lecture Notes Wednesday, October 8, 2003.
Graphical User Interface You will be used to using programs that have a graphical user interface (GUI). So far you have been writing programs that have.
Topics Introduction Scene Graphs
Copyright © 2015 Pearson Education, Inc. Publishing as Pearson Addison-Wesley C H A P T E R 13 GUI Programming.
Class Builder Tutorial Presented By- Amit Singh & Sylendra Prasad.
Lesson 3 - The Entry Box.. Last week We produced a Tkinter window with a label and a button Now we are going to create a new program that creates a Button.
Visual Basic for Application - Microsoft Access 2003 Programming applications using Objects.
Creating visual interfaces in python
Guide to Programming with Python
T U T O R I A L  2009 Pearson Education, Inc. All rights reserved Student Grades Application Introducing Two-Dimensional Arrays and RadioButton.
Ganga/Dirac Data Management meeting October 2003 Gennady Kuznetsov Production Manager Tools and Ganga (New Architecture)
COMPSA Exam Prep Session by Paul Allison On: April 8th from 1:30-3:00 Location TBA Winter 2016CISC101 - Prof. McLeod1.
See Winter 2016CISC101 - Prof. McLeod1.
PROGRAMMING USING PYTHON LANGUAGE ASSIGNMENT 1. INSTALLATION OF RASPBERRY NOOB First prepare the SD card provided in the kit by loading an Operating System.
Adding Tables to Slides Lesson 5. Software Orientation Tables are designed to organize data in columns and rows, as shown at right. The Table Tools Design.
IS 350 Course Introduction. Slide 2 Objectives Identify the steps performed in the software development life cycle Describe selected tools used to design.
Unit 2 Technology Systems
Java FX: Scene Builder.
Topics Graphical User Interfaces Using the tkinter Module
Graphical User Interfaces (GUIs)
Understand the Fundamentals of Classes
Chapter Topics 15.1 Graphical User Interfaces
HCI/CHI: Computer-Human Interaction
Java Programming: From Problem Analysis to Program Design,
Programming In Any Language With “Hello, World!” Examples
Chap 7. Building Java Graphical User Interfaces
Chapter 16 – Programming your App’s Memory
GUI Using Python.
Graphical User Interfaces -- Introduction
Fundamentals of Python: From First Programs Through Data Structures
Procedural Abstraction Object-Oriented Code
EE 422C Java FX.
This Week: Tkinter for GUI Interfaces Some examples
Abstract Data Types and Encapsulation Concepts
© 2016 Pearson Education, Inc.,Hoboken, NJ. All rights reserved.
VISUAL BASIC.
I210 review.
Fundamentals of Programming I Windows, Labels, and Command Buttons
Review Session Biggest discrepancy questions
Computer Science 111 Fundamentals of Programming I Text Areas
Computer Science 111 Fundamentals of Programming I User Interfaces
Topics Graphical User Interfaces Using the tkinter Module
Chapter 15: GUI Applications & Event-Driven Programming
Constructors, GUI’s(Using Swing) and ActionListner
The University of Texas – Pan American
Starter Activities GCSE Python.
Presentation transcript:

Tkinter GUIs Computer Science and Software Engineering © 2014 Project Lead The Way, Inc.

GUI Toolkits Often implemented in several languages Presentation Name Course Name Unit # – Lesson #.# – Lesson Name GUI Toolkits Often implemented in several languages Some commonly used toolkits: wx, Tk, Qt Toolkits offer widgets and event handlers for you to subclass* * More on what subclassing is later Tkinter is a GUI toolkit. There are lots of toolkits out there. The toolkits have basic similarities. Tk is implemented in several languages, including Java and C++, and it is the standard toolkit in Python.

Widgets Toolkits offer widgets and event handlers Presentation Name Course Name Unit # – Lesson #.# – Lesson Name Widgets Toolkits offer widgets and event handlers This window shows many of Tkinter’s widget classes. The first column contains a Checkbox, a Button, and a Scale for sliding. The second column contains a Canvas for drawing on and a Text window for displaying and editing text. The rightmost column contains four Radio buttons (named after the pop-out buttons that were used for years to select preset radio stations in automobiles). Standard UI design makes users expect that round, small buttons like these come in a set and that only one will be selectable at a time from the group.

The Simplest Tkinter Program Presentation Name Course Name Unit # – Lesson #.# – Lesson Name The Simplest Tkinter Program One class in the Tkinter library is the Tk(). You should only instantiate one of these in your program. It will be the parent (or grandparent, or great grand parent, or …) of all other windows and widgets you create. Parent?! That will explain why we called it root.

CS Concept: Root in a Tree Presentation Name Course Name Unit # – Lesson #.# – Lesson Name CS Concept: Root in a Tree Tree: Each node has one parent Root of a Tree: All nodes in the tree descend from the root Not all trees have roots A tree is a structure where every node has exactly one parent. Only a root node, which is at the top of the tree, has no parent. If some nodes have two parents, like human family trees, we would have to call it a graph, a broader category than “tree”. A tree is a specific type of data structure in computer science. The root Tk() instance you create is the root in your program of all the other windows and widgets the application creates.

The Widgets: Canvas Has methods for drawing items on the canvas Presentation Name Course Name Unit # – Lesson #.# – Lesson Name The Widgets: Canvas Has methods for drawing items on the canvas Items can be changed You can draw on a Canvas object. Line 4 instantiates a Canvas. Notice the constructor wants to know the widget’s parent in the first argument. Line 5 places the Canvas in its parent, the root window. We will use the grid() method for every widget. More on that later. Line 6 draws an item on the Canvas. The items are objects, too, not just pixel manipulations like in the last lesson. The command in the lower right could be used to move the item. Notice that the method is being called on the Canvas, not on the item. The Canvas object keeps data relating to its items. You can see the data or change it, but you have to ask the Canvas object to do that for you. This is called data hiding or encapsulation. Concerns with details about how the Canvas code is handling the items is kept separate, encapsulated in the Canvas code.

grid() the Geometry Manager Presentation Name Course Name Unit # – Lesson #.# – Lesson Name grid() the Geometry Manager Columns 0 1 2 1 2 3 Rows The grid method lets you specify the row and column for each widget. The Canvas was placed in row=0, column=1. The Text widget is spanning two rows, starting in row 2. It is also in the southeast corner of its cell.

The Widgets: Checkbutton Presentation Name Course Name Unit # – Lesson #.# – Lesson Name The Widgets: Checkbutton A checkbutton toggles between checked and unchecked.

The Widgets: Scale Allows user to input a value within a range Presentation Name Course Name Unit # – Lesson #.# – Lesson Name The Widgets: Scale Allows user to input a value within a range The Scale is a sliding widget. The from _ and to arguments configure its range. The from_ has an underscore because from is a reserved word in Python.

The Widgets: Text Allows user to edit text in a window Presentation Name Course Name Unit # – Lesson #.# – Lesson Name The Widgets: Text Allows user to edit text in a window Displays text in the window This is a Text widget. Like most of the widgets, it can be instantiated with optional arguments to configure it, like height and width for this one. The rowspan and sticky arguments are used in this call to grid().

Geometry Manager Options Presentation Name Course Name Unit # – Lesson #.# – Lesson Name Geometry Manager Options Columns 0 1 2 1 2 3 Rows The grid method lets you do some rough arrangement. Other geometry managers can give you more fine-grained control. The Canvas was placed in row=0, column=1. The Text widget is spanning two rows, starting in row 2. It is also in the southeast corner of its cell.

Presentation Name Course Name Unit # – Lesson #.# – Lesson Name The Widgets: Scale Many widgets need a special variable (a TkVariable object) to connect to TkVariables: IntVar DoubleVar StringVar BoolVar There are four classes in Tkinter for special variables. These are not widgets, but instead they work with widgets. IntVar is one of the four Tkinter variable classes. We need one of those to give the Scale constructor its “variable” argument. Later we can get the speed with the get() method of the Tk Variables, as shown in the lower right.

The Widgets: Button Presentation Name Course Name Unit # – Lesson #.# – Lesson Name The Widgets: Button Buttons are connected to handlers with the command argument. Define the handler first. Then use that function name with the command argument. This button’s handler is doing two things: 1. The handler increments the variable times_pressed. (What role is this variable playing?) 2. The handler calls two methods on the Text widget. These methods display some text and move the Text’s viewing window. END is a Tkinter constant useful for a Text widget.

CS Concept: Scope and Namespaces Presentation Name Course Name Unit # – Lesson #.# – Lesson Name CS Concept: Scope and Namespaces Scope is a fundamental CS concept. Scope is where you can get a variables value using the variable’s name. In Python each PY file (called a module) has its own namespace that encompasses other namespaces inside the file. The module/file’s namespace is called the “global” scope while the program is running. Each def and class statement create a nested scope inside the scope where the command is executed. In Python the interpreter will look in the namespace of successively larger scopes for a variable when you refer to it, and it will use the first one it comes to. (Nested namespaces create a tree of namespaces!) However, when you ASSIGN to a variable, if the variable is not in the most local scope, the interpreter will create a new variable with that name in the local namespace. So line 18 will create a new variable times_pressed that exists only inside of the def pressed block. As soon as that block is done executing, the new variable will be garbage collected. Declare global inside a function def if you want to assign to a variable in the global scope.

The Widgets: Text Allows user to edit text in a window Presentation Name Course Name Unit # – Lesson #.# – Lesson Name The Widgets: Text Allows user to edit text in a window Displays text in the window This is a Text widget. Like most of the widgets, it can be instantiated with optional arguments to configure it, like height and width for this one. The rowspan and sticky arguments are used in this call to grid().