Skip to main content

tkinter Is Weird? Right?,Big Picture

 tkinter Is Weird? Right?

I will say it again for the people in the back. tkinter is horrible. I only showed you this so you will have more love and appreciation for what's coming up next. Click "mark lesson as complete" and skip ahead to Day 70 if tkinter is not your thing.
Most GUI creators have a lovely drag & drop interface that makes life easy. tkinter doesn't, so it can feel awkward, fiddly, and frustrating at times.


However, it does give you full control of your GUI, and it's always good to learn the magic behind the scenes so you have a better understanding of what's going on.
Today, we're going to add images into our tkinter GUI.


👉 Let's start with the basic boilerplate GUI and define an image. To do this, I need to build a canvas and then create the image.


import tkinter as tk
window = tk.Tk()
window.title("Hello World") 
window.geometry("300x200") 

hello = tk.Label(text = "Hello World") 
hello.pack() 
button = tk.Button(text = "Click me!") 
button.pack()
#### NEW BIT ######
canvas = tk.Canvas(window, width = 300, height=150) # Creates a placeholder for the image in the window.
canvas.pack()
image = tk.PhotoImage(file="theFeels.png") # Sets the file name of the image
canvas.create_image(150,1,image=image) #creates image and sets the co-ordinates for it (150 is horizontal center).
######
tk.mainloop()


Note that I've had to upload the image file to my repl. You can just drag & drop it over to your files menu.


Big Picture

You may have noticed that your image is HUGE.
👉 We can use subsample to resize it. I've just included the relevant lines here.

image = tk.PhotoImage(file="theFeels.png") 
image = image.subsample(5) # makes the image smaller by a factor of 5
canvas.create_image(150,1,image=image)

👉 Here's the code that solves that problem. I'm also going to make the button change the image on click. All changes to the code are identified with comments.


import tkinter as tk
window = tk.Tk()
window.title("Hello World") 
window.geometry("300x200") 
def changeImage(): # new Subroutine
  canvas.itemconfig(container, image = newImage) # itemconfig updates our canvas when this sub is called
hello = tk.Label(text = "Hello World") 
hello.pack() 
button = tk.Button(text = "Click me!", command=changeImage) # Given the button a command to call the changeImage subroutine.
button.pack()

canvas = tk.Canvas(window, width = 300, height=150) 
canvas.pack()
image = tk.PhotoImage(file="theFeels.png") 
image = image.subsample(5)
newImage = tk.PhotoImage(file="success.png") # filename of the replacement image assigned to newImage
newImage = newImage.subsample(5) # scaled down the new image
container = canvas.create_image(150,1,image=image) # Assigned create image to the container variable

tk.mainloop()


Comments

Post a Comment

Popular posts from this blog

FOR LOOP , RANGE

  FOR LOOP  A  while  loop is perfect to use when we  don't  know how many times we want the loop to repeat.  If we have an idea of how many times we want the loop to repeat, we can use a  for  loop to loop code in exactly the same way the  while  loop did.  EXAMPLE :  for counter in range(10):   print(counter) RANGE  The  range  function creates a list of numbers in the range you create. If you only give it one number, it will start at  0  and move to a state where the final number is  one less  than the number in the brackets. In this case, the final number would be  9 .  EXAMPLE :  total = 0 for number in range(100) :   total += number   print(total)
Post a Comment
Read more

CONTINUE COMMAND AND EXIT LINE

  The Continue Command  The  continue  command stops executing code in the loop and starts at the top of the loop again. Essentially, we want to kick the user back to the original question. EXAMPLE : while True:   print("You are in a corridor, do you go left or right?")   direction = input("> ")   if direction == "left":     print("You have fallen to your death")     break   elif direction == "right":     continue   else:     print("Ahh! You're a genius, you've won") NOTE :  The  else  statement refers to any input besides left or right (up or esc). Since the user is a winner, we do  not  want to use  break  or it would say they have failed.  EXIT  COMMAND LINE  The previous code continues to loop even after the user has won. Let's fix that with the  exit()  command EXAMPLE: print("Let's play chutes and ladders. Pick ladder or chute.") while...
Post a Comment
Read more

IF AND ELSE STATEMENT

  If Statements    These statements are a bit like asking a question. You are telling the computer:  if  something is true,  then  do this specific block of code. Double equals ( == ) is asking the computer to compare if these two things are  exactly  the same.  EXAMPLE :  myName = input("What's your name?: ") if myName == "David":  What is else? IF  the condition is  not  met with the  if  statement, then we want the computer to do the  else  part instead. Likewise, if the condition  is  met in the  if  statement, then the  else  bit is ignored by the computer. The  else  statement must be the first thing  unindented  after the  if  statement and in line with it    EXAMPLE :  myName = input("What's your name?: ") if myName == "David":  print("Welcome Dude!")  print("You're just the baldest dude I've ever seen...
Post a Comment
Read more