tkinter:図形をマウスで動かしたい

実現したいこと
カメラから取り込んだ映像を常に表示させながら、映像上に赤い円を表示してマウスで円を自由に動かしたい。実行するとカメラから取り込んだ映像+赤い円は表示されるが、円をマウスで動かすことができない。
tkinter初心者です。ご回答よろしくお願い致します。

import tkinter as tk
import cv2
from PIL import Image,ImageTk
import numpy as np
import tkinter.filedialog as fl
import tkinter.messagebox as mb
import matplotlib.pyplot as plt
import tkinter.ttk as ttk


root=tk.Tk() 
root.title("RGB Recorder") 
root.geometry("800x600") 
root.resizable(width=False, height=False) 
canvas=tk.Canvas(root, width=640, height=480, bg="white") 
canvas.pack() 
c = cv2.VideoCapture(0)
w, h= c.get(cv2.CAP_PROP_FRAME_WIDTH), c.get(cv2.CAP_PROP_FRAME_HEIGHT)#プロパティの取得

#ここにイベントが発生した時の処理#
pressed_x = pressed_y = 0
item_id=-1


def pressed(event):
    global pressed_x,pressed_y,item_id
    item_id=canvas.find_closet(event.x, event.y)
    tag=canvas.gettags(item_id[0])[0]
    item=canvas.type(tag)
    pressed_x=event.x
    pressed_y=event.y
    
def dragged(event):
    global pressed_x,pressed_y,item_id
    item_id=canvas.find_closet(event.x, event.y)
    tag=canvas.gettags(item_id[0])[0]
    item=canvas.type(tag)
    delta_x = event.x - pressed_x
    delta_y = event.y - pressed_y
    if item == "rectangle":
        x0, y0, x1, y1 = canvas.coords(item_id)
        canvas.coords(item_id, x0+delta_x, y0+delta_y, x1+delta_x, y1+delta_y)
    else:
        x, y = canvas.coords(item_id)
        canvas.coords(item_id, x+delta_x, y+delta_y)
    pressed_x = event.x
    pressed_y = event.y

def idou(event):
    global enn
    enn.delete(0,tk.END)
    enn=canvas.create_oval(10,10,300,300,outline="red",width=5)
    
def update():#update 
    global img, enn 
    global c       
    ret, frame =c.read() 
    #TkInterで表示できる形式に変換する 
    img=ImageTk.PhotoImage(Image.fromarray(cv2.cvtColor(frame, cv2.COLOR_BGR2RGB))) 
    canvas.create_image(w/2,h/2,image=img,tags="img") 
    enn=canvas.create_oval(10,10,300,300,outline="red",width=5,tags="rect")
    
        
    root.after(1,update)  #本関数を再帰的に呼び出す 

#Cameraの設定などは省略してます 
update()

#クリックされたとき
canvas.tag_bind("rect","<ButtonPress-1>",pressed)
canvas.tag_bind("img","<ButtonPress-1>",pressed)
#ドラッグされたとき
canvas.tag_bind("rect","<B1-Motion>",dragged)
canvas.tag_bind("img","<B1-Motion>",dragged)

root.mainloop()

エラーコード

item_id=canvas.find_closet(event.x, event.y)
AttributeError: 'Canvas' object has no attribute 'find_closet'

行動規範の内容に同意します

回答1件

カメラ環境は再現できないので、適当に画像取り込んで試しています。

まずエラーコードそのままですが、Canvasにはfind_closet関数という物はありません。
find_closest関数の間違いだと思います。

そしてdragged関数でitem == "rectangle"の判定をしていますが、
Canvas.typeで"rectangle"を返すのはcreate_rectangle関数で作った矩形ですが、
ソース内では宣言されていません。
代わりにcreate_ovalで作成された"oval"を返す円がこれで判定されていないためエラーになります。

現状この二点を修正すれば元の円が残ったりと怪しい部分は多いですが、
円のドラッグはできるようになります。

とりあえず一旦ここから引き続きご自分で作成を継続してみてください。

python
1def pressed(event):
2    global pressed_x,pressed_y,item_id
3    item_id=canvas.find_closest(event.x, event.y)
4    tag=canvas.gettags(item_id[0])[0]
5    item=canvas.type(tag)
6    pressed_x=event.x
7    pressed_y=event.y
8
9def dragged(event):
10    global pressed_x,pressed_y,item_id
11    item_id=canvas.find_closest(event.x, event.y)
12    tag=canvas.gettags(item_id[0])[0]
13    item=canvas.type(tag)
14    delta_x = event.x - pressed_x
15    delta_y = event.y - pressed_y
16    if item == "oval":
17        x0, y0, x1, y1 = canvas.coords(item_id)
18        canvas.coords(item_id, x0+delta_x, y0+delta_y, x1+delta_x, y1+delta_y)
19    else:
20        x, y = canvas.coords(item_id)
21        canvas.coords(item_id, x+delta_x, y+delta_y)
22    pressed_x = event.x
23    pressed_y = event.y