본문 바로가기

[Tkinter] 59강 Canvas 아이템 좌표 직접 다루기(coords)

@도마22026. 2. 19. 18:00
728x90


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

58강에서는
itemconfig()를 이용해
Canvas 아이템의 모양과 속성을 변경했습니다.

이번 강의에서는
Canvas 아이템의 좌표를 직접 읽고, 설정하는 방법,
coords() 메서드를 다룹니다.

이번 강의의 목표는 분명합니다.
Canvas 아이템을
이동량이 아니라 “위치 자체”로 제어하는 감각을 익히는 것입니다.


move와 coords의 결정적 차이

먼저 차이를 명확히 정리해야 합니다.

  • move() → 이동량(dx, dy) 기준
  • coords() → 실제 좌표 값 기준
canvas.move(item, 10, 0)
canvas.coords(item, 50, 80, 120, 140)

두 메서드는
용도가 완전히 다릅니다.


coords 기본 사용 형태

canvas.coords(item_id)

현재 좌표를
리스트 형태로 반환합니다.

또는

canvas.coords(item_id, x1, y1, x2, y2)

좌표를
직접 설정합니다.


사각형 좌표 확인 예제

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(60, 60, 140, 120, fill="skyblue")

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

window.mainloop()

출력 결과는
다음과 같은 형태입니다.

[60.0, 60.0, 140.0, 120.0]

coords로 위치를 “순간 이동”시키기

canvas.coords(box, 120, 40, 200, 100)

이 코드는
이전 위치와 관계없이
해당 좌표로 즉시 이동시킵니다.


버튼으로 좌표 재설정하기

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(40, 80, 100, 140, fill="orange")

def move_to_center():
    canvas.coords(box, 120, 60, 180, 120)

tk.Button(window, text="중앙 이동", command=move_to_center).pack(pady=10)

window.mainloop()

이제
Canvas 객체를
정확한 위치로 배치할 수 있습니다.


도형 종류별 좌표 구조

Canvas 아이템마다
좌표 구조가 다릅니다.

  • Line → [x1, y1, x2, y2]
  • Rectangle / Oval → [x1, y1, x2, y2]
  • Text → [x, y]
  • Image → [x, y]

이 차이를
항상 의식해야 합니다.


텍스트 좌표 변경 예제

text_id = canvas.create_text(80, 60, text="텍스트")

canvas.coords(text_id, 150, 100)

텍스트는
한 점 좌표로
위치가 결정됩니다.


coords로 크기 조절하기

coords는
위치뿐 아니라
크기 변경에도 사용됩니다.

canvas.coords(box, 50, 50, 200, 150)

사각형의
크기가
즉시 변경됩니다.


move와 coords를 함께 쓰는 이유

실무에서는
두 메서드를
함께 사용합니다.

  • 초기 배치 → coords
  • 사용자 조작 → move

이 조합이
가장 자연스럽습니다.


coords 사용 시 주의할 점

다음 실수는
아주 흔합니다.

  • 좌표 개수 틀림
  • 도형 타입과 좌표 구조 혼동
  • None ID에 coords 호출

coords는
정확성을 요구하는
메서드입니다.


Canvas 제어 단계 요약

여기까지 오면
Canvas 제어 흐름은 다음과 같습니다.

  • ID로 식별
  • move로 이동
  • delete로 제거
  • itemconfig로 변경
  • coords로 위치 제어

이제
Canvas는
완전히 제어 가능합니다.


이번 강의 핵심 정리

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

  • coords는 실제 좌표를 다룬다
  • move는 이동량, coords는 위치 기준
  • 도형마다 좌표 구조가 다르다
  • 크기 변경도 coords로 가능하다

다음 강의 예고

다음 강의에서는
Canvas 아이템의 그리기 순서와 레이어 개념을 다룹니다.

이제
겹침과 우선순위를
제어합니다.


728x90
도마2
@도마2 :: 도마의 코드노트

초보자를 위한 코딩 강의를 정리합니다. 파이썬부터 C#, Unity 게임 제작까지 차근차근 기록합니다. — 도마

목차