title: Cropping and displaying images using PIL and Tkinter
body: <p>I am beginning to learn Python after being trapped using VB6 forever. To help myself learn some gui with Tkinter, I'm making a simple slot machine. To animate the wheels, I have a ~300x2000 image that has all of the pictures I intend to use displayed as a strip. About 6 pictures right now. I just show part of the image (wheel) at a time to make it spin. Anyway, I'm having trouble with the part of the code where I come to the end of the image and need to transition from the end of the image back to the beginning (wheel spins down, so the start is the bottom and end is the top).</p>
  
  <p>For some reason, I can't get the images to crop and display correctly, even though I think my script makes sense logically. My code is posted below. You can make an image around the resolution of 300x2000 or so to use with this to see the problem I am having. My code starts printing outside of the area that I want it to show (outside the showsize variable) and I can't figure out why.</p>
  
  <p>Any help with this problem would be much appreciated. It seems that the crops don't cut the images short enough, but all the information that I found about it make me think my script should be working just fine. I've tried to annotate my code to explain what's going on.</p>
  
  <pre><code>from Tkinter import *
  from PIL import Image, ImageTk
  
  def main():
      root = Tk()
      root.title = ("Slot Machine")
      canvas = Canvas(root, width=1500, height=800)
      canvas.pack()
  
      im = Image.open("colors.png")
      wheelw = im.size[0] #width of source image
      wheelh = im.size[1] #height of source image
      showsize = 400 #amount of source image to show at a time - part of 'wheel' you can see
      speed = 3 #spin speed of wheel
      bx1 = 250 #Box 1 x - where the box will appear on the canvas
      by = 250 #box 1 y
      numberofspins = 100  #spin a few times through before stopping
  
      cycle_period = 0  #amount of pause between each frame
  
      for spintimes in range(1,numberofspins):
          for y in range(wheelh,showsize,-speed):  #spin to end of image, from bottom to top
  
              cropped = im.crop((0, y-showsize, wheelw, y))  #crop which part of wheel is seen
              tk_im = ImageTk.PhotoImage(cropped)
              canvas.create_image(bx1, by, image=tk_im)  #display image
  
              canvas.update()                 # This refreshes the drawing on the canvas.
              canvas.after(cycle_period)       # This makes execution pause
  
          for y in range (speed,showsize,speed):  #add 2nd image to make spin loop
              cropped1 = im.crop((0, 0, wheelw, showsize-y)) #img crop 1
              cropped2 = im.crop((0, wheelh - y, wheelw, wheelh)) #img crop 2
              tk_im1 = tk_im2 = None
              tk_im1 = ImageTk.PhotoImage(cropped1)
              tk_im2 = ImageTk.PhotoImage(cropped2)
  
              #canvas.delete(ALL)
              canvas.create_image(bx1, by, image=tk_im2)  ###THIS IS WHERE THE PROBLEM IS..
              canvas.create_image(bx1, by + y, image=tk_im1)  ###PROBLEM
  
              #For some reason these 2 lines are overdrawing where they should be.  as y increases, the cropped img size should decrease, but doesn't
  
              canvas.update()                 # This refreshes the drawing on the canvas
              canvas.after(cycle_period)       # This makes execution pause
  
      root.mainloop()
  
  if __name__ == '__main__':
      main()
  </code></pre>