[Tkinter] 56강 Canvas 아이템 이동(move)시키기

---

---

이 강의는 Tkinter GUI 강의 56강입니다

55강에서는
Canvas에 그려진 객체를 식별하기 위한
아이템 ID 개념을 배웠습니다.

이번 강의에서는
그 ID를 이용해
Canvas 아이템을 실제로 이동시키는 방법을 다룹니다.

이번 강의의 목표는 분명합니다.
Canvas 객체를
좌표 기준으로 움직이는 감각을 익히는 것입니다.

---

Canvas 아이템은 어떻게 이동하는가

Canvas 아이템은
좌표를 “다시 설정”하는 방식이 아닙니다.

Canvas는
이동량(dx, dy) 을 기준으로 움직입니다.

---

move 메서드 기본 형태

canvas.move(item_id, dx, dy)

• item_id : 이동할 Canvas 아이템 ID
• dx : x축 이동 거리
• dy : y축 이동 거리

양수면

• 오른쪽 / 아래
  음수면
• 왼쪽 / 위

---

가장 단순한 이동 예제

import tkinter as tk

window = tk.Tk()
window.geometry("320x240")

canvas = tk.Canvas(window, width=300, height=200, bg="white")
canvas.pack(pady=20)

box = canvas.create_rectangle(50, 80, 120, 140, fill="skyblue")

canvas.move(box, 50, 0)

window.mainloop()

사각형이 오른쪽으로
이동된 상태로 표시됩니다.

---

move는 “누적 이동”이다

중요한 개념 하나입니다.

move는 절대 좌표가 아니라 누적 이동이다

canvas.move(box, 10, 0)
canvas.move(box, 10, 0)

결과적으로
x축으로
20 이동합니다.

---

버튼으로 이동시키기

Canvas 이동은
이벤트와 함께 쓰일 때
의미가 생깁니다.

import tkinter as tk

window = tk.Tk()
window.geometry("320x240")

canvas = tk.Canvas(window, width=300, height=200, bg="white")
canvas.pack()

box = canvas.create_rectangle(50, 80, 120, 140, fill="orange")

def move_right():
    canvas.move(box, 10, 0)

tk.Button(window, text="→", command=move_right).pack(pady=10)

window.mainloop()

버튼을 누를 때마다
사각형이
조금씩 이동합니다.

---

네 방향 이동 예제

def move_left():
    canvas.move(box, -10, 0)

def move_right():
    canvas.move(box, 10, 0)

def move_up():
    canvas.move(box, 0, -10)

def move_down():
    canvas.move(box, 0, 10)

이 구조는
키보드 이동, 드래그 이동의
기초가 됩니다.

---

여러 아이템을 동시에 이동시키기

move는
하나의 ID뿐 아니라
여러 ID에도 적용할 수 있습니다.

items = [
    canvas.create_rectangle(30, 30, 80, 80, fill="red"),
    canvas.create_rectangle(100, 30, 150, 80, fill="blue")
]

for item in items:
    canvas.move(item, 20, 20)

이 개념은
그룹 이동의
기초입니다.

---

이동 후 위치를 알고 싶다면

Canvas는
아이템의 현재 좌표를
직접 제공합니다.

coords = canvas.coords(box)
print(coords)

반환 값은
도형 종류에 따라
좌표 리스트입니다.

---

초보자가 자주 하는 오해

다음은
아주 흔한 오해입니다.

• move는 좌표를 “설정”한다 X
• move는 좌표를 “더한다” O

이 차이를 이해하지 못하면
이동 로직이
꼬이기 시작합니다.

---

Canvas 이동은 애니메이션의 출발점

Canvas 이동은
다음 단계로
자연스럽게 이어집니다.

• 드래그 이동
• 키보드 이동
• 타이머 기반 이동
• 애니메이션

모든 움직임의 시작이
바로 move입니다.

---

이번 강의 핵심 정리

이번 강의에서 꼭 기억해야 할 내용입니다.

• canvas.move(id, dx, dy)로 이동한다
• dx, dy는 이동량이다
• move는 누적 이동이다
• ID가 있어야 이동이 가능하다

---

다음 강의 예고

다음 강의에서는
Canvas 아이템을 삭제(delete)하는 방법을 다룹니다.

이제
Canvas 객체를
생성 → 이동 → 제거
까지 완성합니다.

---