Introduction to Python
GUI
Python GUI
Python is capable of utilizing a gui module which allows the
developer to include a gui as one of the program’s components.
The module for the components can be accessed through importing
the necessary libraries into your code, in order to utilize its
functions.
Syntax:
from tkinter import *
This is the approach to include all the available functions for GUI.
tkinter is a library name from which gui functions and commands are
stored in.
It is important to make sure you import first before using any tkinter
commands in your program.
Creating your Frame
First thing you need to understand that in creating frame objects, the properties of the object should
first be set.
Create an instance of the frame, which indicates that everything you will be inserting within the
frame should be included in the instance of the frame.
from tkinter import * The myroot=TK is the instance of the
tkinter, meaning it allows us to insert
objects within that frame.
myroot=Tk()
The [Link]() will allow the
program to continuously show the
[Link]() created frame without it the frame
created will instantly be removed.
Objects can now be inserted from
your frame.
Tkinter Widgets
Widgets are actual objects which can be inserted within your frame. Here
are some examples:
Widget Description
Button The Button is used to add various kinds of buttons to the python application.
Canvas The canvas widget is used to draw the canvas on the window.
CheckButton The Checkbutton is used to display the CheckButton on the window.
Entry The entry widget is used to display the single-line text field to the user. It is
commonly used to accept user values.
Frame It can be defined as a container to which, another widget can be added and
organized.
Label A label is a text used to display some message or information about the other
widgets.
ListBox The ListBox widget is used to display a list of options to the user.
MenuButton The Menubutton is used to display the menu items to the user.
Menu It is used to add menu items to the user.
Message The Message widget is used to display the message-box to the user.
RadioButton The Radiobutton is different from a checkbutton. Here, the user is
provided with various options and the user can select only one
option among them.
Scale It is used to provide the slider to the user.
ScrollBar It provides the scrollbar to the user so that the user can scroll the
window up and down.
Text It is different from Entry because it provides a multi-line text field
to the user so that the user can write the text and edit the text
inside it.
Toplevel It is used to create a separate window container.
Spinbox It is an entry widget used to select from options of values.
PanedWindo It is like a container widget that contains horizontal or vertical
panes.
LabelFrame A LabelFrame is a container widget that acts as the container
MessageBox This module is used to display the message-box in the desktop based
applications.
Tkinter Geometry
Geometry represents how the object shall be displayed or appear on the
window frame.
pack() method
Places an object following attribute values. However, pack allows you to insert
objects easier but with less possible customization options for positioning.
Options
Expand Fills up available space if true
Fill Fills up space according to an x and y coordinate
Side Represents the side of the parent to which the
object will be placed.
pack() Application
The lbl is a label which is supposed to be
inserted in the window.
from tkinter import * Using the method pack() and without
any changed property. By default, the
myroot=Tk() object will appear on the available space
on the window.
lbl = Label(myroot, text="this is my text")
[Link]()
[Link]() Alternatively if you want to use options
for pack method simply add it.
[Link](side=left) As you can see we used side and set the
object to the left of the window.
You can use multiple options by
separating them using comma(,)
grid() method
Places an object following a tabular manner of placing an object. This allows
you to have a more formal and aligned format for your objects.
Options
column,row Represents from which grid of the frame the object
will appear.
columnspan,rowspan Represents how many columns/rows the object will
occupy in terms of spacing
ipadx,ipady Represents the space before displaying an object
from inside the grid.
padx,pady Represents the space before displaying an object
from outside the grid.
Sticky Allows the object to stick with any available space
given that the object is smaller than the size of the
grid.
grid() Application
from tkinter import * Here we have 2 labels and
following the grid method.
myroot=Tk() We used the row and column
option in order from which or how
lbla = Label(myroot,text = "Name1") the object will be positioned in
[Link](row = 0, column = 0) our window.
lblb = Label(myroot,text = "Name2") Since both object has the same
[Link](row = 1, column = 0) column we can assume that the
2nd label will appear just below
the 1st label.
[Link]()
place() method
Places an object following the x and y coordinates of the workspace.
Options
anchor Represents the position of the object based on the
container
bordermode Sets a border for object it can be set to inside or
outside
height,width Refers to width and height in pixels
relwidth,relheight Ranging from 0.0-1.0 with the parent’s height and
width. Represents percentage
relx,rely Ranging from 0.0-1.0 with the direction within the
frame. Represents percentage
x,y Refers to the actual x and y axis in the frame.
place() Application
from tkinter import *
myroot=Tk()
Similar with the grid, the place
lbla = Label(myroot,text = "Name1") follows the x and y axis of the
[Link](x = 0, y = 0) window frame.
lblb = Label(myroot,text = "Name2") Regardless on what approach you
[Link](x = 30, column = 20) use it is very easy to position your
objects..
[Link]()
Tkinter Button
A tkinter widget which is used to insert clickable buttons in your work frame.
Syntax:
Mybtn=Button(myroot, options)
Option Description
activebackground It represents the background of the button when the
mouse hover the button.
activeforeground It represents the font color of the button when the
mouse hover the button.
Bd It represents the border width in pixels.
Bg It represents the background color of the button.
Command It is set to the function call which is scheduled when
the function is called.
Fg Foreground color of the button.
Font The font of the button text.
Height The height of the button. The height is represented in
the number of text lines for the textual lines or the
number of pixels for the images.
Highlightcolor The color of the highlight when the button has the focus.
Image It is set to the image displayed on the button.
justify It illustrates the way by which the multiple text lines are
represented. It is set to LEFT for left justification, RIGHT
for the right justification, and CENTER for the center.
Padx Additional padding to the button in the horizontal
direction.
pady Additional padding to the button in the vertical
direction.
Relief It represents the type of the border. It can be SUNKEN,
RAISED, GROOVE, and RIDGE.
State This option is set to DISABLED to make the button
unresponsive. The ACTIVE represents the active state of
the button.
Underline Set this option to make the button text underlined.
Width The width of the button. It exists as a number of letters
for textual buttons or pixels for image buttons.
Wraplength If the value is set to a positive number, the text lines will
be wrapped to fit within this length.
Tkinter Entry
A tkinter widget which is used to textfields from which the user may input any
values.
Syntax:
Mytxtbox=Entry(myroot, options)
Option Description
bg The background color of the widget.
bd The border width of the widget in pixels.
cursor The mouse pointer will be changed to the cursor type set to the arrow,
dot, etc.
exportselecti The text written inside the entry box will be automatically copied to the
on clipboard by default. We can set the exportselection to 0 to not copy this.
fg It represents the color of the text.
font It represents the font type of the text.
highlightbackground It represents the color to display in the traversal highlight
region when the widget does not have the input focus.
highlightcolor It represents the color to use for the traversal highlight rectangle
that is drawn around the widget when it has the input focus.
highlightthickness It represents a non-negative value indicating the width of the
highlight rectangle to draw around the outside of the widget
when it has the input focus.
insertbackground It represents the color to use as background in the area covered
by the insertion cursor. This color will normally override either
the normal background for the widget.
insertborderwidth It represents a non-negative value indicating the width of the 3-D
border to draw around the insertion cursor. The value may have
any of the forms acceptable to Tk_GetPixels.
insertofftime It represents a non-negative integer value indicating the number
of milliseconds the insertion cursor should remain "off" in each
blink cycle. If this option is zero, then the cursor doesn't blink: it
is on all the time.
insertontime Specifies a non-negative integer value indicating the number of
milliseconds the insertion cursor should remain "on" in each blink
cycle.
insertwidth It represents the value indicating the total width of the insertion
cursor. The value may have any of the forms acceptable to
Tk_GetPixels.
justify It specifies how the text is organized if the text contains multiple
lines.
relief It specifies the type of the border. Its default value is FLAT.
selectbackground The background color of the selected text.
selectborderwidth The width of the border to display around the selected task.
selectforeground The font color of the selected task.
show It is used to show the entry text of some other type instead of the
string. For example, the password is typed using stars (*).
textvariable It is set to the instance of the StringVar to retrieve the text from the
entry.
width The width of the displayed text or image.
xscrollcommand The entry widget can be linked to the horizontal scrollbar if we want
the user to enter more text then the actual width of the widget.
Button Application
from tkinter import * Here we created 1 button and 1
textbox. This code utilizes
myroot=Tk() positioning so that it would
lbl = Label(myroot, text=“Enter your Name:") appear that the purpose of the
[Link](x=0,y=0) form is for logging in.
Txtbx=Entry(myroot)
[Link](x=50,y=0)
btn = Button(myroot,text = “LogIn")
[Link](x=0,y=30)
[Link]()
Try it yourselves
Try creating a form with more objects in it.
Try
using the positioning options, and try to
observe when is the best time to use each of
them.
Feelfree to use more than one option for the
widget. This will further allow you to customize
your work.