[python] GUI programming tkInter (Canvas)

 

마지막으로 알아보고자 하는 위젯은 Canvas 이다.

그림, 텍스트,프레임, 그리고 다른 위젯으로 덮을 수 있는 평평한 직사각형의 표면이다.

 

해당 위젯은 스스로 스크롤 하고 다양한 이벤트에 반응할 수 있다.

Canvas는 필요한 것은 모두 갖추고 있다.

---

import tkinter as tk

root = tk.Tk()

canvas = tk.Canvas(root, width=400, height=400, bg="yellow")
canvas.create_line(10, 380, 200, 10, 380, 380, 10, 380)
button = tk.Button(root, text="Quit", command=root.destroy)

canvas.grid(row=0)
button.grid(row=1)

root.mainloop()

해당 코드를 실행시키면, 노란색 배경의 삼각형이 그려진 캔버스가 생성된다.

canvas_object = tk_object.Canvas(master_object, option...)

해당 생성자를 통해 canvas 위젯 객체를 만들 수 있다.

옵션에 해당하는 키워드 인자는 아래와 같이 캔버스의 속성을 지정한다.

그중 유용하게 쓰이는 키워드 인수는 다음과 같다.

캔버스 속성(property)	속성의 역할
borderwidth	캔버스의 테두리 (default : 2px)
background / bg	캔버스 테두리의 색상 (default : 기본 창의 색상과 동일)
height	캔버스의 높이 (px)
width	캔버스의 너비 (px)

 

 

• create_line()

canvas_object.create_line(x0, y0, x1, y1, ..., xn, yn, option...)

해당 메서드는 지정된 좌표(x0, y0)에서 시작해서 지정된 좌표(xn, yn)로 끝난다.

각 위치의 쌍은 하나의 점을 표현한다.

선하나를 그리기 위해서는 4개의 값이 필요하다.

option 값은 다음과 같다.

옵션 이름	옵션 의미
arrow	일반적으로 끝을 특별하게 마감하지 않지만, 화살촉으로 마감하고 싶다면 사용할 수 있고, FIRST : 체인의 시작 LAST : 체인의 끝 BOTH : 양쪽  으로 화살표가 그려진다.
fill	체인의 색상 (옵션을 빈 문자열로 설정하면 선이 투명해진다.)
smooth	연결된 포물선 세트를 사용하여 체인의 모서리를 둥글게 설정한다. smooth=Ture
width	선 너비 (default : 1px)

import tkinter as tk

root = tk.Tk()

canvas = tk.Canvas(root, width=400, height=400, bg="yellow")
canvas.create_line(10, 380, 200, 10, 380, 380, 10, 380
                   , arrow= tk.BOTH, fill="red", smooth=True, width=3)
button = tk.Button(root, text="Quit", command=root.destroy)

canvas.grid(row=0)
button.grid(row=1)

root.mainloop()

해당 코드를 실행하면, 약간은 괴이하지만, 옵션을 알기 쉽다.

 

 

• create_rectangle()

canvas_object.create_rectangle(x0, y0, x1, y1, option...)

각 두개의 모서리(x0,y0) (x1,y1)에 대해 직사각형을 그리게 된다.

option 값은 다음과 같다.

옵션 이름	옵션 의미
outline	사각형의 가장자리 색상(빈 문자열 지정시 투명해진다.)
fill	직사각형 내부 생상
width	픽셀 단위의 사각형 모서리의 너비(default : 1px)

import tkinter as tk

root = tk.Tk()
canvas = tk.Canvas(root, width=400, height=400, bg="yellow")
canvas.create_rectangle(200, 100, 300, 300, fill="red", outline='white', width=5)
button = tk.Button(root, text="Quit", command=root.destroy)

canvas.grid(row=0)
button.grid(row=1)

root.mainloop()

직사각형을 볼 수 있다.

 

 

• create_polygon()

canvas_object.create_polygon(x0, y0, x1, y1,..., xn, yn, option...)

다각형을 그리는 것은 매우 비슷하지만, 차이점은 마지막 부분이 자동으로 첫번째 점에 연결된다는 점이다.

import tkinter as tk

root = tk.Tk()
canvas = tk.Canvas(root, width=400, height=400, bg="black")
canvas.create_polygon(20, 380, 200, 68, 380, 380, outline='red', width=5, fill='yellow')
button = tk.Button(root, text="Quit", command=root.destroy)

canvas.grid(row=0)
button.grid(row=1)

root.mainloop()

처음에 create_line() 과 동일한 모양의 삼각형이 나오지만, 인자가 훨씬 줄어든 것을 비교해볼 수 있다.

 

 

• create_oval()

canvas_object.create_oval(x0, y0, x1, y1, option...)

해당 방법은 create_rectangle() 처럼 직사각형의 포인트를 받지만, 해당 포인트를 내접하는 타원형을 그린다.

그렇기 때문에 만약 해당 사각형이 정사각형이였다면, 원은 타원이 아닌 둥근 원이 된다.

import tkinter as tk

root = tk.Tk()
canvas = tk.Canvas(root, width=400, height=400, bg="black")
canvas.create_oval(100, 100, 300, 200, outline='red', width=15, fill='white')
button = tk.Button(root, text="Quit", command=root.destroy)

canvas.grid(row=0)
button.grid(row=1)

root.mainloop()

 

 

• create_arc()

canvas_object.create_arc(x0, y0, x1, y1, option...)

타원영의 일부를 그리기 위해서는 해당 방법을 사용한다.

(x0, y0) (x1, y1) 인 직사각형에 내접하는 타원영의 호를 그리며, 옵션은 create_polygon()과 동일하지만 세가지 새로운 옵션이 있다.

옵션 이름	옵션 의미
style	다음중 하나로 설정할 수 있다. tk.PIESLICE (default) tk.CHORD tk.ARC
start	x 축을 기준으로 호 시작점의 각도.(default : 0) 예를 들어 90은 타원형의 가장 높은 지점을 의미하고, 0은 가장 오른쪽의 지점을 의미한다. 0은 곧 타원 전체를 의미.
extent	시작점을 기준으로 한 호의 길이(몇도인지) 기본 값은 90 으로 타원형의 4분의 1을 의미

import tkinter as tk

root = tk.Tk()
canvas = tk.Canvas(root, width=400, height=400, bg="yellow")
canvas.create_arc(10, 100, 380, 300, outline='red', width=5)
canvas.create_arc(10, 100, 380, 300, outline='blue', width=5, style.tk.CHORD, start=90, fill='white')
canvas.create_arc(10, 100, 380, 300, outline='green', width=5, style.tk.ARC, start=180, extent=180)
button = tk.Button(root, text="Quit", command=root.destroy)

canvas.grid(row=0)
button.grid(row=1)

root.mainloop()

 

 

• create_text()

canvas_object.create_text(x, y, option...)

캔버스 안에 텍스트를 배치한다.

텍스트의 중심이 (x,y) 지점에서 위치한 사각형 안에 배치된다.

옵션 이름	옵션 의미
fill	텍스트의 색상
font	텍스트의 글꼴
justify	텍스트의 정렬 tk.LEFT (default) tk.CENTER tk.RIGHT
text	표시할 텍스트로 줄내림은 \n으로 표현
width	일반적으로 사각형의 너비는 가장 긴 텍스트 줄의 너비와 같다. 너비 옵션을 사용하면 텍스트가 해당 크기에 맞춰 정렬된다.

 

import tkinter as tk

root = tk.Tk()
canvas = tk.Canvas(root, width=400, height=400, bg='blue')
canvas.create_text(200,200, text="Mary\nhad\na\nlittle\nlamb",
                   font=('Courier', 30, 'bold'),
                   justifgy=tk.CENTER,
                   fill='white')
button = tk.Button(root, text="Quit", command=root.destroy)

canvas.grid(row=0)
button.grid(row=1)

root.mainloop()

 

 

• create_image()

canvas_object.create_image(x, y, option...)

이미지의 중심이 (x,y) 지점에 위치하여 배치된다. 

옵션 이름	옵션 의미
image	PhotoImage 객체가 필요하다.

# 예제 코드-> 실행 오류발생 
import tkinter as tk
from PIL import Image, ImageTk # 추가 적용 

root = tk.Tk()
canvas = tk.Canvas(root, width=400, height=400, bg='yellow')
# image = tk.PhotoImage(file='icon.png')  # 예제 코드가 오류 발생함 -> PIL의 Image, Imagetk 이용
image = Image.open('icon.png') # 변경 후
photo = ImageTk.PhotoImage(image) # 변경 후
canvas.create_image(200, 200, image=photo) 
button = tk.Button(root, text="Quit", command=root.destroy)

canvas.grid(row=0)
button.grid(row=1)

root.mainloop()

 

이후 오류에 대해서 확인해볼 사항은 

pk.Photoimage(file=filename)

해당 클래스 생성자를 통해 생성하는 객체가 file이 png와 gif 파일에 적용된다고 했다.

jpg 이미지 같은 경우 위와 같은 방법을 사용한다고 했다.

 

나는 테스트를 위해 jpg 파일을 png로 확장자를 변경하여 사용하였는데,

이에 대해 오류를 확인하고 확장자를 확인해보는 추가 작업이 필요할 것 같다.