Tkinter Basics #1 (Intro, Labels, Placements)

Download:

Be sure to check the text-files for the code used in the examples presented below:

You Must:

For starters, you import tkinter.

This allows you use everything in tkinter.

(tk is a python standard)

In tkinter, everything is a widget. The very first you type out is basically a root widget, it’s the GUI window. By python standard, it often is just named ‘root’. For the sake of readability. I will be naming it ‘GUI_Window’.

At the end of a tkinter script. You must put your root’s variable name with the method ‘.mainloop()’. This allows tkinter to loop itself. This basically allows your program to continue executing, follow mouse movements and execute other functions in program based on changing variables, and given inputs. Without this, your program will basically execute the first thing and just stop.

Placements:

Before we get started on creating labels, buttons and entry boxes. We need to understand the 3 types of widget placements:

  • .pack() – This just shoves a widget into the window. You don’t choose where it sits in the GUI, it just follows the same placement. Very basic to use.
  • .grid(row = 0, column = 0) – This places widgets in a grid format with rows and columns. It makes everything look more organised.
  • .place(x =0, y=0) – This place widgets where you want them to be placed in the window. This often comes with a lot of trial and error as you got to place each widget to it’s x & y value on the graph (GUI_Window)

This will make more sense in examples.

Labels:

A label is basically a little output box with a message.

First declare a variable of your choice and write the following: (mine will be MyLabel)

MyLabel = Label(GUI_Window, text = ‘put your text here’)

This creates a Label in GUI_Window and displays the string ‘text’ as an output.

We then need to place the widget somewhere in the window.

We have three choices:

  • pack()
  • grid(row = 0, column = 0)
  • place(x=25,y=25)

Grid Placement | Explained Further:

  Column 0: Column 1: Column 2: Column 3:
Row 0:        
Row 1:        
Row 2:        
Row 3:        
Row 4:        

 

Above is an empty tkinter visualised grid. This should help you understand how grids work a bit more.

If I place a label at row 0, column 0. (Label1.grid(GUI_Window, row = 0, column =0)

And I place a Label at row 1, column 1. (Label2.grid(GUI_Window,row=1, column =1)

My grid will look like this:

  Column 0: Column 1: Column 2: Column 3:
Row 0: Label1      
Row 1:   Label2    
Row 2:        
Row 3:        
Row 4:        

 

This will output as:

However, If I place a label at row 0, column 0.

And I place a label at row 2, column 2.

You would expect the grid to look like this:

  Column 0: Column 1: Column 2: Column 3:
Row 0: Label1      
Row 1:        
Row 2:     Label2  
Row 3:        
Row 4:        

 

Instead, it will display as the exact same output as the last one:

This is because row 1, column 1 is empty. There is nothing stored on that grid. This means that there is nothing to output. It is ignored and row 2, column 2 is put there instead.

  Column 0: Column 1: Column 2: Column 3:
Row 0: Label1 EMPTY EMPTY EMPTY
Row 1: EMPTY EMPTY EMPTY EMPTY
Row 2: EMPTY EMPTY Label2 EMPTY
Row 3: EMPTY EMPTY EMPTY EMPTY
Row 4: EMPTY EMPTY EMPTY EMPTY

 

But if we add an extra label in row 1, column 1. (myLabel3.grid(row = 1, column= 1) Then the labels will proceed to display in the correct grid format:

  Column 0: Column 1: Column 2: Column 3:
Row 0: Label1      
Row 1:   Label3    
Row 2:     Label2  
Row 3:        
Row 4:        

 

Loading