【Python】マウス操作でTkinterキャンバス上の画像を移動する方法

TkinterのCanvas（キャンバス）ウィジェットは、Tkinterライブラリの中でも特に汎用性の高いウィジェットの一つです。図形や画像の描画、アニメーションオブジェクトの作成など、幅広い用途に活用できます。

キャンバス上の画像を移動させるには、move()メソッドを使用します。move(Image, x, y)のように、対象の画像と移動先の座標を引数として渡すことで、オブジェクトを任意の方向へ動かせます。なお、画像を移動・再配置できるようにするには、画像をグローバル変数として宣言しておく必要があります。

画像をキャンバス内で移動可能にする手順

• まず、Canvasウィジェットを定義し、画像を追加します。
• move()関数を定義し、画像がキャンバス内で動的に動けるようにします。
• マウスボタンのイベントと、画像を移動させる関数をバインド（関連付け）します。

サンプルコード

# 必要なライブラリをインポート
from tkinter import *
from PIL import Image, ImageTk

# tkinterフレームのインスタンスを作成
win = Tk()

# ウィンドウサイズを設定
win.geometry("700x350")

# Canvasウィジェットを定義
canvas = Canvas(win, width=600, height=400, bg="white")
canvas.pack(pady=20)

# Canvasウィジェットに画像を追加
image = ImageTk.PhotoImage(Image.open('logo.png'))
img = canvas.create_image(250, 120, anchor=NW, image=image)

def left(e):
    x = -20
    y = 0
    canvas.move(img, x, y)

def right(e):
    x = 20
    y = 0
    canvas.move(img, x, y)

def up(e):
    x = 0
    y = -20
    canvas.move(img, x, y)

def down(e):
    x = 0
    y = 20
    canvas.move(img, x, y)

# 画像をキャンバス内で移動させる関数を定義
def move(e):
    global image
    image = ImageTk.PhotoImage(Image.open('logo.png'))
    img = canvas.create_image(e.x, e.y, image=image)

# move関数をマウスのドラッグ操作にバインド
canvas.bind("<B1-Motion>", move)

win.mainloop()

実行結果

上記のコードを実行すると、マウス操作でウィンドウ内を自由に移動できる画像が表示されたウィンドウが起動します。

キャンバス上でクリックしたままドラッグすると、画像がマウスカーソルに追従して動きます。また、方向キーごとの関数（left / right / up / down）をキーボードイベントにバインドすれば、矢印キーによる移動操作も簡単に追加できます。