George Quine
George Quine

Reputation: 1

Tkinter - rotate image with slider simultaneously

UPDATED -

New to tkinter

Is it possible to rotate a picture by using a slider simultaneously.

I have an image of a rotatory dial, beneath this image is a slider listed from 0 to 360. I would like the image to rotate clockwise as the slider is moved from 0 to 360, and anticlockwise as the slider is returned from 360 to 0.

ROTATION OF IMAGE WITH SLIDER WORKS CORRECTLY

I have ran into a bug, the image is black. Perhaps the image is too zoomed in? Apologies, I am new to python and tkinter.

Here is how the GUI should look Correct GUI

THIS IS HOW THE GUI LOOKS NOW Incorrect GUI with Slider

THIS IS HOW THE GUI LOOKS REMOVING THUMBNAIL LINE THUMBNAIL

Here is the updated code

# import necessary modules
from tkinter import * 
from tkinter import ttk
from PIL import Image, ImageTk

 
root = Tk()
root.title("Gesture Detection Application")
root.geometry("400x320") # set starting size of window
root.maxsize(400, 320) # width x height
root.config(bg="#6FAFE7") # set background color of root window
 
Heading = Label(root, text="Demonstrator Application2", bg="#2176C1", fg='white', relief=RAISED)
Heading.pack(ipady=5, fill='x')
Heading.config(font=("Font", 20)) # change font and size of label
   

image = Image.open("rotate_dial.png")
width, height = image.size
image.thumbnail((width/5, height/5))
photoimage = ImageTk.PhotoImage(image)
image_label = Label(root, image=photoimage, bg="white", relief=SUNKEN)
image_label.image = photoimage
image_label.pack(pady=5)

def rotate_image(degrees):
    new_image = image.rotate(-int(degrees))
    photoimage = ImageTk.PhotoImage(new_image)
    image_label.image = photoimage #Prevent garbage collection
    image_label.config(image = photoimage)
    

w2 = Scale(root, from_=0, to=360, tickinterval= 30, orient=HORIZONTAL, length=300, command = rotate_image)
w2.pack()
w2.set(0)
                                                                                            
root.mainloop()

Upvotes: 0

Views: 840

Answers (1)

Henry
Henry

Reputation: 3944

You can rotate the image using PIL (which you've already imported). You can link it to the Scale by adding a command.

image = Image.open("rotate_dial.png")
width, height = image.size
image.thumbnail((width/5, height/5))
photoimage = ImageTk.PhotoImage(image)
image_label = Label(root, image=photoimage, bg="white", relief=SUNKEN)
image_label.pack(pady=5)

def rotate_image(degrees):
    new_image = image.rotate(-int(degrees))
    photoimage = ImageTk.PhotoImage(new_image)
    image_label.image = photoimage #Prevent garbage collection
    image_label.config(image = photoimage)
    

w2 = Scale(root, from_=0, to=360, tickinterval= 30, orient=HORIZONTAL, length=300, command = rotate_image)

Instead of creating a PhotoImage initially, it now creates a PIL Image object. It then uses the height and width and the thumbnail function to replace the subsample. Then it uses ImageTk to turn it into a tkinter PhotoImage which is shown in the label. The Scale now has a command, rotate_image, which recieves the scale value, which is the number of degrees, and then uses PIL to create a new rotated image, which is then turned into a PhotoImage and displayed in the label by changing it's image with .config. Now when you move the slider, the image rotates with it.

Upvotes: 1

Related Questions