Tkinter canvas 画像生成での配置の起点の指定方法【Python】

はじめに
動作環境
デフォルトは画像の中心座標が起点
配置の起点の変更はオプションの引数anchorを使用する
anchor 値の種類

はじめに

Pyhton Tkinterのcanvasでcreate_imageメソッドで画像生成をするときの配置起点の指定方法についての記事になります。

画像の配置方法を「左上」基準にしたかったのでその実現方法をまとめました。

動作環境

・Kubuntu 22.04

デフォルトは画像の中心座標が起点

何も指定せずcanvasで画像を配置すると、画像の中心座標を起点にして、どこの位置に配置するか。という指定方法になります。

import tkinter

root = tkinter.Tk()
root.title("canvas image test")

cvs = tkinter.Canvas(root, width=600, height=600)
cvs.pack()

# 画像ファイルの指定
img = tkinter.PhotoImage(file="image.png")

# キャンバスに画像を生成
cvs.create_image(300, 300, image=img)

root.mainloop()

Python

実行結果は下記です。(※画像はそれぞれでご用意ください。)

“600×600″の真ん中を起点にしているので、綺麗に画像が配置されました。

もう一つのパターンとして、試しに起点を”0×0″(画面の左上)を指定してみました。

import tkinter

root = tkinter.Tk()
root.title("canvas image test")

cvs = tkinter.Canvas(root, width=600, height=600)
cvs.pack()

# 画像ファイルの指定
img = tkinter.PhotoImage(file="image.png")

# キャンバスに画像を生成 起点を(0,0)にしてみる
cvs.create_image(0, 0, image=img)

root.mainloop()

Python

結果は下記になります。

生成画像の中心を起点にして、”0×0″の位置に配置しているため、このような結果になります。

配置の起点の変更はオプションの引数anchorを使用する

配置の起点の変更はcreate_imageメソッドのオプション引数「anchor」を使用すると実現できます。

今回は「画像の左上を起点」にしたかったため、「anchor=”nw”」と指定します。

import tkinter

root = tkinter.Tk()
root.title("canvas image test")

cvs = tkinter.Canvas(root, width=600, height=600)
cvs.pack()

# 画像ファイルの指定
img = tkinter.PhotoImage(file="image.png")

# キャンバスに画像を生成 属性にanchorを設定(画像の左上を起点)
cvs.create_image(0, 0, image=img, anchor="nw")

root.mainloop()

Python

結果は下記になります。

綺麗に画像が配置できましたね。

画像の配置の起点は、GUIのどの位置に画像を配置するかだったり、ウィンドウと画像のサイズ計算だったり、複数の画像を綺麗に並べるための寸法計算のために重要なので、anchorの引数を知った時は感動しました。

anchor 値の種類

最後にほかの起点の種類をまとめました。

調べてて気づきましたが、”n”とか”s”はたぶん東西南北の英語の略称だと思われます。

値	内容
n	画像の上を起点にする
s	画像の下を起点にする
w	画像の左を起点にする
e	画像の右を起点にする
nw	画像の左上を起点にする
sw	画像の左下を起点にする
ne	画像の右上を起点にする
se	画像の右下を起点にする
center	画像の中心を起点にする