GUI Programming�Python
Satishkumar L. Varma
Professor, Department of Computer Engineering
PCE, New Panvel
www.sites.google.com/site/vsat2k
Outline
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
2
What is Python
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
3
IDE
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
4
GUI Programming
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
5
GUI Programming
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
6
What is Tkinter
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
7
Tcl and Tk
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
8
Tkinter Programming
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
9
Tkinter Widgets and Hierarchy
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
10
Types of Tkinter Widgets
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
11
SN | Widget | Operator & Description |
1 | Button | The Button widget is used to display the buttons in your application. |
2 | Canvas | The Canvas widget is used to draw shapes, such as lines, ovals, polygons and rectangles, in your application. |
3 | Checkbutton | The Checkbutton widget is used to display a number of options as checkboxes. The user can select multiple options at a time. |
4 | Entry | The Entry widget is used to display a single-line text field for accepting values from a user. |
5 | Frame | Frame widget is used as a container widget to organize other widgets. |
6 | Label | The Label widget is used to provide a single-line caption for other widgets. It can also contain images. |
7 | Listbox | The Listbox widget is used to provide a list of options to a user. |
8 | Menubutton | The Menubutton widget is used to display menus in your application. |
9 | Menu | The Menu widget is used to provide various commands to a user. These commands are contained inside Menubutton. |
10 | Message | The Message widget is used to display multiline text fields for accepting values from a user. |
Types of Tkinter Widgets
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
12
SN | Widget (Operator) | Operator & Description |
11 | Radiobutton | The Radiobutton widget is used to display a number of options as radio buttons. The user can select only one option at a time. |
12 | Scale | The Scale widget is used to provide a slider widget. |
13 | Scrollbar | The Scrollbar widget is used to add scrolling capability to various widgets, such as list boxes. |
14 | Text | The Text widget is used to display text in multiple lines. |
15 | Toplevel | Toplevel widget is used to provide a separate window container. |
16 | Spinbox | Spinbox widget is a variant of the standard Tkinter Entry widget, which can be used to select from a fixed number of values. |
17 | PanedWindow | A PanedWindow is a container widget that may contain any number of panes, arranged horizontally or vertically. |
18 | LabelFrame | A labelframe is a simple container widget. Its primary purpose is to act as a spacer or container for complex window layouts. |
19 | tkMessageBox | This module is used to display message boxes in your applications. |
Standard Attributes
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
13
Geometry Management
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
14
Points To Remember
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
15
Let Us Begin
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
# Tkinter in Python 2 to tkinter in Python 3
import tkinter
top = tkinter.Tk()
# Code to add widgets will go here...
top.mainloop()
16
Add Widget GUI: Label, Entry and Button
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
import tkinter
myGUI = tkinter.Tk()
myGUI.title(‘Add 3 Widgets - Label, Entry and Button’)
label1 = tkinter.Label(myGUI, text="This is Label Widget")
txtentry = tkinter.Entry(myGUI)
btn = tkinter.Button(myGUI, text ="I am Button Widget (Click me)")
#Adding 3 widgets on myGUI
label1.pack()
txtentry.pack()
btn.pack()
17
Add Even on Button Widget
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
import tkinter
def close():
myGUI.destroy()
myGUI = tkinter.Tk()
myGUI.title(‘Add 3 Widgets - Label, Entry and Button’)
label1 = tkinter.Label(myGUI, text="This is Label Widget")
txtentry = tkinter.Entry(myGUI)
btn = tkinter.Button(myGUI, text ="Click me to close appln", command = close)
label1.pack()
txtentry.pack()
btn.pack()
18
Resize and Add Color to GUI
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
import tkinter
def close():
myGUI.destroy()
myGUI = tkinter.Tk()
myGUI.geometry('450x250')
myGUI.configure(background='light blue')
myGUI.title('Add 3 Widgets - Label, Entry and Button')
label1 = tkinter.Label(myGUI, text="This is Label Widget")
txtentry = tkinter.Entry(myGUI)
btn = tkinter.Button(myGUI, text ='Close' , command = close, fg='white', bg='blue')
label1.pack()
txtentry.pack()
btn.pack()
19
Add Canvas Widget to GUI
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
coord = 10, 50, 240, 210
arc = canvas.create_arc(coord, start=0, extent=150, fill="blue")
filename = PhotoImage(file = "sunshine.gif")
image = canvas.create_image(50, 50, anchor=NE, image=filename)
line = canvas.create_line(x0, y0, x1, y1, ..., xn, yn, options)
oval = canvas.create_polygon(x0, y0, x1, y1,...xn, yn, options)
20
Add Canvas Widget to GUI
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
21
Add more Widgets on GUI
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
import sys
from tkinter import *
myGUI = Tk()
nameentry = StringVar()
myGUI.geometry('450x250') # WxH
myGUI.title('Playing with the layout of Buttons')
Label1 = Label(myGUI, text='Enter Text Here').pack()
Textentry1 = Entry(myGUI, textvariable=nameentry).pack()
Button1 = Button(myGUI, text='Button 1').pack(side=LEFT,padx=20)
Button2 = Button(myGUI, text='Button 2').pack(side=LEFT,padx=5)
Button3 = Button(myGUI, text='Button 3').pack(side=RIGHT,padx=20)
Button4 = Button(myGUI, text='Button 4').pack(side=RIGHT,padx=5)
22
Widgets on GUI
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
myGUI = Tk()
nameentry = StringVar()
myGUI.geometry('450x250')# WxH
myGUI.configure(background='light blue')
myGUI.title('Login Screen')
Label1 = Label(myGUI, text='Username').pack()
textentry1= Entry(myGUI, textvariable=nameentry).pack()
Label2 = Label(myGUI, text='Password').pack()
textentry2 = Entry(myGUI).pack()
button1 = Button(myGUI, text='Login', fg = 'white', bg = 'blue').pack()
23
Align Widgets on GUI Using Pack()
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
myGUI = Tk()
nameentry = StringVar()
myGUI.geometry('450x250+400+100')# WxH
myGUI.configure(background='light blue')
myGUI.title('Login Screen')
Label1 = Label(myGUI, text='Username').pack()
textentry1= Entry(myGUI, textvariable=nameentry).pack()
Label2 = Label(myGUI, text='Password').pack(side=LEFT,padx=5)
textentry2 = Entry(myGUI).pack(side=LEFT,padx=50)
button1 = Button(myGUI, text='Login', fg = 'white', bg = 'blue').pack(side=RIGHT,padx=5)
24
Align Widgets on GUI using Place()
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
myGUI = Tk()
myGUI.configure(background='light blue')
myGUI.geometry('450x250+500+200')
myGUI.title('Login Screen')
Label1 = Label(myGUI, text='Username').place(x=20, y=20)
textentry1= Entry(myGUI).place(x=20, y=40)
Label2 = Label(myGUI, text='Password').place(x=20, y=60)
textentry2= Entry(myGUI).place(x=20, y=80)
button1=Button(myGUI, text='Login', fg = 'white', bg = 'blue').place(x=20,y=100)
25
Align Widgets on GUI using Grid()
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
myGUI = Tk()
myGUI.configure(background='light blue')
myGUI.geometry('450x250+500+200')
myGUI.title('Login Screen')
Label1 = Label(myGUI, text='Username').grid(row=0,column=0, sticky=N)
textentry1= Entry(myGUI).grid(row=0, column=1)
Label2 = Label(myGUI, text='Password').grid(row=1,column=0)
textentry2= Entry(myGUI).grid(row=1,column=1)
button1=Button(myGUI, text='Login', fg = 'white', bg = 'blue').grid(row=2,column=1)
26
Align Widgets on GUI using Pack() and Frame()
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
myGUI = Tk()
myGUI.geometry('450x250+500+200')
myGUI.title('Using a Frame')
label1 = Label(myGUI, text="Example of using frames:")
label1.pack()
f = Frame(myGUI)
button1 = Button(f, text="Button 1")
button2 = Button(f, text="Button 2")
button3 = Button(f, text="Button 3")
button1.pack(side=LEFT, padx=5)
button2.pack(side=LEFT)
button3.pack(side=RIGHT,pady=15,padx=50)
f.pack()
27
Align Widgets on GUI using Pack() and 2 Frames
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
myGUI = Tk()
myGUI.geometry('450x250+500+200')
myGUI.title('Using a Frame')
label1 = Label(myGUI, text="Example of using frames:")
label1.pack()
f = Frame(myGUI)
button1 = Button(f, text="Button 1")
button2 = Button(f, text="Button 2")
button1.pack(side=LEFT, padx=5)
button2.pack(side=RIGHT,pady=15,padx=50)
f.pack()
f1 = Frame(myGUI)
button1 = Button(f1, text="Close Button",fg='blue')
button1.pack(side=RIGHT,pady=50,padx=5)
f1.pack()
28
Two GUIs
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
def close():
myGUI.destroy()
myGUI = Tk()
myGUI.configure(background='light blue')
myGUI.geometry('450x200+500+200')
myGUI.title('Login Screen')
Label1 = Label(myGUI, text='Username').place(x=20, y=20)
textentry1= Entry(myGUI).place(x=20, y=40)
Label2 = Label(myGUI, text='Password').place(x=20, y=60)
textentry2= Entry(myGUI).place(x=20, y=80)
button1=Button(myGUI, text='Login', fg = 'white', bg = 'blue').place(x=20,y=100)
button2=Button(myGUI, text='Close', command=close,fg = 'white', bg = 'blue').place(x=300,y=150)
myGUI.mainloop()
###################################
window = Tk()
window.configure(background='light yellow')
window.geometry('450x150+450+450')
window.title('MY Second GUI')
29
Login Message Application (Handle Main and Login GUI)
30
Tkinter Checkbutton
31
Tkinter Listbox
from tkinter import *
import tkinter
def selectItem():
if 1 == 1:
result.set("Selected Item is : ")
else:
result.set("Not selected!")
main = Tk()
main.geometry('450x350+400+200')
imageCanvas = Canvas(main, bg="light yellow", height=250, width=150)
filename = PhotoImage(file = "satish.png")
image = imageCanvas.create_image(150, 20, anchor=NE, image=filename)
Lb1 = Listbox(main)
Lb1.insert(1, "Satish")
Lb1.insert(2, "Harsh")
Lb1.insert(3, "Saransh")
Lb1.insert(4, "Saransh + Harsh")
result = StringVar()
resultLabel = Label(main, textvariable=result,relief=SUNKEN)
#print("Value of ListVar1 = ",str(Lb1.get()))
resultLabel.grid(row=1, column=1,pady=20)
Lb1.grid(row=0, column=0, padx=50)
imageCanvas.grid(row=0, column=1,pady=20)
main.mainloop()
32
Tkinter Menubutton
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
33
Tkinter Message
from tkinter import *
main = Tk()
main.geometry('400x300')
var = StringVar()
label = Message(main, textvariable=var, relief=RAISED )
var.set("Like def, the lambda creates a function \
to be called later. But it returns the function \
instead of assigning it to a name. This is why \
lambdas are sometimes known as anonymous functions. \
In practice, they are used as a way to inline a \
function definition, or to defer execution of a code.")
label.pack(side=LEFT, padx=10, pady=5)
main.mainloop()
34
Tkinter Scale
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
def sel():
selection = "Value = " + str(var.get())
label.config(text = selection)
main = Tk()
main.geometry('400x200+300+200')
main.title('Scale Widget')
var = DoubleVar()
scale = Scale(main, variable = var )
scale.pack(anchor=CENTER,pady=10)
button = Button(main, text="Get Scale Value", command=sel)
button.pack(anchor=CENTER)
label = Label(main,fg='blue')
label.pack()
main.mainloop()
35
Tkinter Scrollbar
from tkinter import *
main = Tk()
main.geometry('500x300+400+200')
main.title('Scrollbar Widget')
scrollbar = Scrollbar(main)
scrollbar.pack(side = LEFT, fill=Y)
mylist = Listbox(main, yscrollcommand = scrollbar.set )
for line in range(50):
mylist.insert(END, "Line number is " + str(line))
mylist.pack(side = LEFT, fill = BOTH,padx=20,pady=5)
scrollbar.config(command = mylist.yview )
imageCanvas = Canvas(main, bg="light yellow", height=250, width=150)
filename = PhotoImage(file = "satish.png")
image = imageCanvas.create_image(150, 20, anchor=NE, image=filename)
imageCanvas.pack(padx=20,pady=5)
36
Tkinter Text
from tkinter import *
def onclick():
pass
main = Tk()
main.geometry('500x300+400+200')
main.title('Text Widget')
text = Text(main,pady=5)
text.insert(INSERT, "Hello.....")
text.insert(END, "Bye Bye.....")
text.pack()
text.tag_add("here", "1.0", "1.4")
text.tag_add("start", "1.6", "1.13")
text.tag_config("here", background="yellow", foreground="blue")
text.tag_config("start", background="blue", foreground="green")
main.mainloop()
37
Tkinter Spinbox
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
main = Tk()
main.geometry('400x200+400+200')
main.title('Spinbox Widget')
w = Spinbox(main, from_=0, to=10)
w.pack(pady=5)
mainloop()
38
Tkinter PanedWindow
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
main = Tk()
main.geometry('400x200+400+200')
main.title('PanedWindow Widget')
m1 = PanedWindow()
m1.pack(fill=BOTH, expand=1)
left = Label(m1, text="left pane 1",bg='red')
m1.add(left)
m2 = PanedWindow(m1, orient=VERTICAL)
m1.add(m2)
top = Label(m2, text="top pane 1/2",bg='blue')
m2.add(top)
bottom = Label(m2, text="bottom pane 2/2",bg='yellow')
m2.add(bottom)
main.mainloop()
39
Tkinter LabelFrame
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
from tkinter import *
main = Tk()
main.geometry('400x200+400+200')
main.title('PanedWindow Widget')
labelframe = LabelFrame(main, text="This is a LabelFrame")
labelframe.pack(fill="both", expand="yes")
left = Label(labelframe, text="Inside the LabelFrame")
left.pack()
main.mainloop()
40
PanedWindow and LabelFrame Widget
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
41
Outline
Satishkumar L. Varma, PCE New Panvel www.sites.google.com/site/vsat2k
42
References
43
Satishkumar Varma, PCE www.sites.google.com/site/vsat2k
Thank You.
Satishkumar Varma, PCE www.sites.google.com/site/vsat2k
44