【Tkinter】canvas Widget内で描かれた、図形や画像を操作する
今回はTkinterで使われるcanvas Widget内で描かれた、図形や画像を操作する方法を解説致します。canvas Widgetを使ってみたい、図形や画像を操作する方法を知りたい方へおすすめです。最後までご覧いただけますと幸いです。
執筆者 - おすすめの記事3選
そもそもTkinterで利用されるcanvas Widgetとは?
Tkinterで利用されるcanvas Widgetとは、Widgetの一種で様々な図形や画像を描画するものを意味します。
具体的にどのような図形や画像を描画できるのか説明すると、
など多岐にわたります。
聞き慣れない言葉がいくつか出てきましたね。。以下の「Tkinterの構成要素」を確認しながら、理解を深めましょう。
Tkinterの構成要素
Tkinterの構成要素として、Window, Frame, Widgetの概念が存在します。
名称 | 説明文 |
---|---|
Window | 画像の緑色枠の部分になります。Tkinter画面全体を表します。 |
Frame | 画像内の紫色枠の部分になります。Widgetが1つ以上ある場合に、取りまとめるものです。 |
Widget | 青色枠で囲まれる部分になります。1つの機能を持つ最小単位 = Widgetと考えると良いでしょう。 |
前の章でTkinterで活用されるcanvas Widgetとは、Widgetの一種で様々な図形や画像を描画するものとお伝えしました。
「Tkinterの構成要素」の画像内では、青色枠に該当するWidgetに対して、編集することになります。
次に実際にcanvas Widget内で描かれた、図形や画像を操作する方法を理解していきましょう。
下準備
今回は先ほど紹介した「Tkinterの構成要素」の画像を元に、canvas Widget内で描かれた、図形や画像を操作する方法に関してお伝え致します。
下にコードを貼り付けておきますので、画像と見比べながら、コードを確認してみてください。できればコードに触れて、一緒にcanvas Widgetを体験しましょう。
1import tkinter as tk
2
3class Application(tk.Frame):
4 def __init__(self, master=None):
5 # Windowの初期設定を行う。
6 super().__init__(master)
7
8 # Windowの画面サイズを設定する。
9 # geometryについて : https://kuroro.blog/python/rozH3S2CYE0a0nB3s2QL/
10 self.master.geometry("300x200")
11
12 # Windowを親要素として、frame Widget(Frame)を作成する。
13 # Frameについて : https://kuroro.blog/python/P20XOidA5nh583fYRvxf/
14 frame = tk.Frame(self.master)
15
16 # Windowを親要素とした場合に、frame Widget(Frame)をどのように配置するのか?
17 # packについて : https://kuroro.blog/python/UuvLfIBIEaw98BzBZ3FJ/
18 frame.pack()
19
20 # frame Widget(Frame)を親要素として、canvas Widgetを作成する。
21 # width : 幅の設定
22 # height : 高さの設定
23 # background : 背景色の設定
24 # 色について : https://kuroro.blog/python/YcZ6Yh4PswqUzaQXwnG2/
25 # Canvasについて : https://kuroro.blog/python/V63iINoXI8iwMeRMEJPK/
26 canvas = tk.Canvas(frame, width=500, height=500, background="white")
27
28 # create_oval : 楕円を描く関数
29 # create_ovalについて : https://kuroro.blog/python/ANyM9WLpd0LSXRQAELOj/
30 canvas.create_oval(200, 100, 10, 20, fill='black')
31
32 # frame Widget(Frame)を親要素とした場合に、canvas Widgetをどのように配置するのか?
33 # packについて : https://kuroro.blog/python/UuvLfIBIEaw98BzBZ3FJ/
34 canvas.pack()
35
36# Tkinter初学者参考 : https://docs.python.org/ja/3/library/tkinter.html#a-simple-hello-world-program
37if __name__ == "__main__":
38 # Windowを生成する。
39 # Windowについて : https://kuroro.blog/python/116yLvTkzH2AUJj8FHLx/
40 root = tk.Tk()
41 app = Application(master=root)
42 # Windowをループさせて、継続的にWindow表示させる。
43 # mainloopについて : https://kuroro.blog/python/DmJdUb50oAhmBteRa4fi/
44 app.mainloop()
上記のコードをPython環境で実行すると、「Tkinterの構成要素」で紹介した画像の結果が表示されます。
図形や画像を操作する際に重要なタグと独自ID
図形や画像を操作するためには、canvas Widgetで用意される関数を利用します。
ただし、canvas Widgetで用意される関数を利用するためには、どの図形や画像に対して操作(関数を実行)するのか指し示す必要があります。
どの図形や画像を操作するのか、指し示すために、タグと独自IDを活用します。
タグ
描画した図形や画像そのものを、自分好みの名前として管理し、図形や画像を操作するために利用します。図形や画像を描画する際にoptionとして、使用します。
タグは単数 or 複数つけられて、単数の場合tag='aiu'
, 複数の場合tag=('eo', 'kaki')
と宣言します。
1# create_oval : 楕円を描画する関数
2# x1座標 : 200, y1座標 : 200, x2座標 : 10, y2座標 : 20
3# <option>
4# tag(タグ) : 描画する楕円に対して、'hoge'と名前付けを行う。
5# タグを単数つける場合 tag='aiu', タグを複数つける場合 tag=('eo', 'kaki')
6canvas.create_oval(200, 100, 10, 20, fill='black', tag='hoge')
独自ID
描画した図形や画像そのものを、独自IDとして管理し、図形や画像を操作するために利用します。図形や画像を描画する際に、戻り値として取得できます。
1# create_oval : 楕円を描画する関数
2# x1座標 : 200, y1座標 : 200, x2座標 : 10, y2座標 : 20
3# 戻り値 : 独自ID
4id = canvas.create_oval(200, 100, 10, 20, fill='black')
図形や画像を操作するための関数
図形や画像を操作するための関数として
- addtag_all
- bbox
- coords
- dchars
- delete
- find_all
- gettags
- insert
- itemcget
- itemconfigure
- move
- moveto
- scale
- select_from, select_to
- select_clear
- select_item
- tag_bind, tag_unbind
- type
があります。順にみていきましょう。
addtag_all
addtag_all関数を利用すると、canvas Widget内で描画される全ての図形や画像にタグを付与できます。
1# canvas Widget内で描画される全ての図形や画像にタグを付与
2# 第一引数 : タグ名
3.addtag_all('タグ名')
で定義されます。戻り値はありません。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1def __init__(self, master=None):
2 ...
3 canvas.create_oval(200, 100, 10, 20, fill='black')
4
5+ canvas.create_oval(100, 300, 50, 20, fill='black')
6+ canvas.create_oval(50, 100, 10, 20, fill='black')
7
8+ canvas.addtag_all('hogehoge')
3つの楕円に対して、hogehogeと名付けられたタグがつけられます。
bbox
bbox関数を利用すると、指定するタグ名 or 独自IDに該当する、図形や画像の位置を取得できます。
1# 指定するタグ名 or 独自IDに該当する、図形や画像の位置を取得
2# 第一引数 : タグ名 or 独自ID
3# 戻り値 : (x1座標, y1座標, x2座標, y2座標)
4.bbox('タグ名') or .bbox('独自ID')
で定義されます。戻り値として、 (x1座標, y1座標, x2座標, y2座標)が返されます。
例えば下準備コードを、以下のように変更すると、
1def __init__(self, master=None):
2 ...
3
4- canvas.create_oval(200, 100, 10, 20, fill='black')
5+ canvas.create_oval(200, 100, 10, 20, fill='black', tag='test')
6
7+ print(canvas.bbox('test'))
以下の画像のように値が返されます。
coords
coords関数を利用すると、指定するタグ名 or 独自IDに該当する、図形や画像の位置や大きさを変更できます。
1# 指定するタグ名 or 独自IDに該当する、図形や画像の位置や大きさを変更
2# 第一引数 : タグ名 or 独自ID
3# 第二引数以降 : x1座標, y1座標, x2座標, y2座標, ...
4# 第二引数以降を指定する際の注意点 : タグ名 or 独自IDに紐づく図形や画像を、描画する際の座標数に合わせて、引数を指定すること。
5# 例えば、create_rectangleの場合は、.coords('タグ名', x1, y1, x2, y2) or .coords('独自ID', x1, y1, x2, y2)
6# 例えば、create_textの場合は、.coords('タグ名', x1, y1) or .coords('独自ID', x1, y1)とする。
7# create_rectangle, create_textについて : https://kuroro.blog/python/ANyM9WLpd0LSXRQAELOj/
8.coords('タグ名', x1, y1, x2, y2, ...) or .coords('独自ID', x1, y1, x2, y2, ...)
で定義されます。戻り値はありません。
coords関数を利用する際は、タグ名 or 独自IDに紐づく図形や画像を、描画する際の座標数 = 第二引数以降の数として、関数を実行ください。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_rectangle(100, 200, 200, 300, tag="testtest", fill='black')
3+ canvas.coords('testtest', 100, 100, 200, 300)
canvas.coords('testtest', 100, 100, 200, 300)
を付けない場合、以下のように描画されますが、
canvas.coords('testtest', 100, 100, 200, 300)
を付けると、以下のように描画されます。
dchars
dchars関数を利用すると、指定するタグ名 or 独自IDに該当する、図形や画像の文字を削除 or 図形や画像の文字列を削除できます。
1# 指定するタグ名 or 独自IDに該当する、図形や画像の文字を削除の場合
2# 第一引数 : タグ名 or 独自ID
3# 第二引数 : 開始index(文字位置)
4# create_textで描画される文字列に対してのみ有効。
5.dchars('タグ名', '開始index(文字位置)') or .dchars('独自ID', '開始index(文字位置)')
6
7# 指定するタグ名 or 独自IDに該当する、図形や画像の文字列を削除の場合
8# 第一引数 : タグ名 or 独自ID
9# 第二引数 : 開始index(文字位置)
10# 第三引数 : 終わりindex(文字位置)
11# create_textで描画される文字列に対してのみ有効。
12# create_textについて : https://kuroro.blog/python/ANyM9WLpd0LSXRQAELOj/
13.dchars('タグ名', '開始index(文字位置)', '終わりindex(文字位置)') or .dchars('独自ID', '開始index(文字位置)', '終わりindex(文字位置)')
で定義されます。戻り値はありません。
dchars関数は、create_textで描画される文字列に対してのみ有効です。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_text(250, 250, text="テストテスト", fill='black', tag="testtest")
3+ canvas.dchars('testtest', 0)
以下の画像のように、先頭の'テ'の文字を削除して、canvas Widgetを描画します。
また下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_text(250, 250, text="テストテスト", fill='black', tag="testtest")
3+ canvas.dchars('testtest', 0, 2)
以下の画像のように、先頭の'テスト'の文字を削除して、canvas Widgetを描画します。
delete
delete関数を利用すると、指定するタグ名 or 独自IDに該当する、図形や画像を全て削除できます。
1# 指定するタグ名 or 独自IDに該当する、図形や画像を全て削除
2# 第一引数 : タグ名 or 独自ID
3.delete('タグ名') or .delete('独自ID')
で定義されます。戻り値はありません。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_oval(200, 100, 10, 20, fill='black', tag='testtest')
3+ canvas.delete('testtest')
以下の画像のようにcanvas Widgetを描画します。
find_all
find_all関数を利用すると、描画される図形や画像の独自ID一覧を取得できます。
1# 描画される図形や画像の独自ID一覧を取得
2# 戻り値 : (独自ID1, 独自ID2, ...)
3.find_all()
で定義されます。戻り値として、(独自ID1, 独自ID2, ...)が返されます。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1+ canvas.create_oval(100, 200, 30, 40, fill='black')
2+ print(canvas.find_all())
以下の画像のように値が返されます。
gettags
gettags関数を利用すると、指定するタグ名 or 独自IDに該当する図形や画像の、タグ名一覧を取得できます。
1# 指定するタグ名 or 独自IDに該当する図形や画像の、タグ名一覧を取得
2# 第一引数 : タグ名 or 独自ID
3# 戻り値 : (タグ名1, タグ名2, ...)
4# 注意点 : タグ名を指定する場合、タグ名に紐づく全ての図形や画像の、タグ名一覧を取得しない。始めてタグ名として宣言した、図形や画像に関するタグ名一覧を取得する。
5.gettags('タグ名') or .gettags('独自ID')
で定義されます。戻り値として、(タグ名1, タグ名2, ...)が返されます。
gettags関数を利用する際、第一引数へタグ名を指定する場合、タグ名に紐づく全ての図形や画像の、タグ名一覧を取得しない。始めてタグ名として宣言した、図形や画像に関するタグ名一覧を取得する。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_oval(200, 100, 10, 20, fill='black', tag='testtest')
3
4+ print(canvas.gettags('testtest'))
以下の画像のように値が返されます。
insert
insert関数を利用すると、指定するタグ名 or 独自IDに該当する図形や画像へ、文字列を挿入できます。
1# 指定するタグ名 or 独自IDに該当する図形や画像へ、文字列を挿入
2# 第一引数 : タグ名 or 独自ID
3# 第二引数 : 挿入先index(文字位置)
4# 第三引数 : 文字列
5# create_textで描画される文字列に対してのみ有効です。
6# create_textについて : https://kuroro.blog/python/ANyM9WLpd0LSXRQAELOj/
7.insert('タグ名', index(文字位置), 文字列) or .insert('独自ID', index(文字位置), 文字列)
で定義されます。戻り値はありません。
insert関数は、create_textで描画される文字列に対してのみ有効です。
例えば下準備コードのcanvas.create_oval(100, 200, 30, 40, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(100, 200, 30, 40, fill='black')
2
3+ canvas.create_text(250, 250, text="テストテスト", fill='black', tag="testtest")
4
5+ canvas.insert('testtest', 1, 'aiueo')
以下の画像のように、'テ'の後に'aiueo'の文字列を挿入して、canvas Widgetを描画します。
itemcget
itemcget関数を利用すると、指定するタグ名 or 独自IDに該当する、図形や画像で設定される、optionの値を取得できます。
1# 指定するタグ名 or 独自IDに該当する、図形や画像で設定される、optionの値を取得
2# 第一引数 : タグ名 or 独自ID
3# 第二引数 : option名
4# 戻り値 : optionの値
5.itemcget('タグ名', option名) or .itemcget('独自ID', option名)
で定義されます。戻り値として、optionの値が返されます。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2
3+ canvas.create_oval(200, 100, 10, 20, fill='black', tag='testtest')
4
5+ print(canvas.itemcget('testtest', 'fill'))
以下の画像のように、fill optionの値が返されます。
itemconfigure
itemconfigure関数を利用すると、指定するタグ名 or 独自IDに該当する、図形や画像へ、optionの設定を行います。
1# 指定するタグ名 or 独自IDに該当する、図形や画像へ、optionの設定
2# 第一引数 : タグ名 or 独自ID
3# 第二引数以降 : option
4.itemconfigure('タグ名', option1, option2, ...) or .itemconfigure('独自ID', option1, option2, ...)
で定義されます。戻り値はありません。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_oval(200, 100, 10, 20, fill='black', tag='testtest')
3+ canvas.itemconfigure('testtest', fill='red')
以下の画像のようにcanvas Widgetを描画します。
move
move関数を利用すると、指定するタグ名 or 独自IDに該当する、図形や画像の移動を行います。
1# 指定するタグ名 or 独自IDに該当する、図形や画像の移動
2# 第一引数 : タグ名 or 独自ID
3# 第二引数 : x座標の移動量(px), 正の値の場合、右に移動量分移動、負の値の場合、左に移動量分移動
4# 第三引数 : y座標の移動量(px), 正の値の場合、下に移動量分移動、負の値の場合、上に移動量分移動
5.move('タグ名', x座標の移動量(px), y座標の移動量(px)) or .move('独自ID', x座標の移動量(px), y座標の移動量(px))
で定義されます。戻り値はありません。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_oval(200, 100, 10, 20, fill='black', tag='testtest')
3
4+ canvas.move('testtest', 200, 100)
以下の画像のようにcanvas Widgetを描画します。
moveto
moveto関数を利用すると、指定するタグ名 or 独自IDに該当する、図形や画像の移動を行います。
1# 指定するタグ名 or 独自IDに該当する、図形や画像の移動
2# 第一引数 : タグ名 or 独自ID
3# 第二引数 : 移動先x座標
4# 第三引数 : 移動先y座標
5.moveto('タグ名', x座標, y座標) or .moveto('独自ID', x座標, y座標)
で定義されます。戻り値はありません。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_oval(200, 100, 10, 20, fill='black', tag='testtest')
3
4+ canvas.move('testtest', 100, 100)
以下の画像のようにcanvas Widgetを描画します。
scale
scale関数を利用すると、指定するタグ名 or 独自IDに該当する、図形や画像の大きさを変更します。
1# 指定するタグ名 or 独自IDに該当する、図形や画像の大きさを変更
2# 第一引数 : タグ名 or 独自ID
3# 第二引数 : xOffset : 図形や画像の大きさを変更した際に、x座標を微調整するもの
4# 第三引数 : yOffset : 図形や画像の大きさを変更した際に、y座標を微調整するもの
5# 第四引数 : x座標を拡張する倍数。デフォルト1.0。(x座標 x xScale)
6# 第五引数 : y座標を拡張する倍数。デフォルト1.0。(y座標 x yScale)
7.scale('タグ名', xOffset, yOffset, xScale, yScale) or .scale('独自ID', xOffset, yOffset, xScale, yScale)
で定義されます。戻り値はありません。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_rectangle(20, 30, 70, 80, fill='black', tag="testtest")
3+ canvas.scale('testtest', 10, 10, 2, 2)
canvas.scale('testtest', 10, 10, 2, 2)
を付けない場合、以下のように描画されますが、
canvas.scale('testtest', 10, 10, 2, 2)
を付けると、以下のように描画されます。
select_from, select_to
select_from, select_to関数を利用すると、指定するタグ名 or 独自IDに該当する、文字列の選択を行います。
1# 指定するタグ名 or 独自IDに該当する、開始index(文字位置)から終わりindex(文字位置)の間に当てはまる文字列を、選択状態にする。
2# 第一引数 : タグ名 or 独自ID
3# 第二引数 : 開始index(文字位置)
4# create_textで描画される文字列に対してのみ有効です。
5# create_textについて : https://kuroro.blog/python/ANyM9WLpd0LSXRQAELOj/
6.select_from('タグ名', 開始index(文字位置)) or .select_from('独自ID', 開始index(文字位置))
7
8# 指定するタグ名 or 独自IDに該当する、開始index(文字位置)から終わりindex(文字位置)の間に当てはまる文字列を、選択状態にする。
9# 第一引数 : タグ名 or 独自ID
10# 第二引数 : 終わりindex(文字位置)
11# create_textで描画される文字列に対してのみ有効です。
12# create_textについて : https://kuroro.blog/python/ANyM9WLpd0LSXRQAELOj/
13.select_to('タグ名', 終わりindex(文字位置)) or .select_to('独自ID', 終わりindex(文字位置))
で定義されます。戻り値はありません。
select_from, select_to関数は、create_textで描画される文字列に対してのみ有効です。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_text(250, 250, text="テストテスト", fill='black', tag="testtest")
3+ canvas.select_from('testtest', 2)
4+ canvas.select_to('testtest', 4)
以下の画像のように'トテス'を選択状態にします。
select_clear
select_clear関数を利用すると、文字列の選択を解除できます。
1# 文字列の選択を解除
2# create_textで描画される文字列に対してのみ有効です。
3# create_textについて : https://kuroro.blog/python/ANyM9WLpd0LSXRQAELOj/
4.select_clear()
で定義されます。戻り値はありません。
select_clear関数は、create_textで描画される文字列に対してのみ有効です。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_text(250, 250, text="テストテスト", fill='black', tag="testtest")
3+ canvas.select_from('testtest', 2)
4+ canvas.select_to('testtest', 4)
5+ canvas.select_clear()
以下の画像のように、'トテス'の選択状態を解除できます。
select_item
select_item関数を利用すると、選択されている文字列の独自IDを取得できます。
1# 選択されている文字列の独自IDを取得
2# 戻り値 : 独自ID or None
3# create_textで描画される文字列に対してのみ有効です。
4# create_textについて : https://kuroro.blog/python/ANyM9WLpd0LSXRQAELOj/
5.select_item()
で定義されます。戻り値は独自IDが返されます。選択されている文字列がない場合は、Noneが返されます。
select_item関数は、create_textで描画される文字列に対してのみ有効です。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_text(250, 250, text="テストテスト", fill='black', tag="testtest")
3+ canvas.select_from('testtest', 2)
4+ canvas.select_to('testtest', 4)
5+ print(canvas.select_item())
以下の画像のように、独自IDの値を取得できます。
tag_bind, tag_unbind
tag_bind, tag_unbind関数を利用すると、「イベントと関数の実行」の紐づけを登録・削除できます。
1# 「イベントと関数の実行」の紐づけを登録
2# 第一引数 : タグ名 or 独自ID
3# 第二引数 : sequence(イベント内容(ボタンを選択する、文字を入力するなど)を設定)
4# 第三引数 : func(第二引数のイベント内容(ボタンを選択する、文字を入力するなど)が実行された場合に、呼ばれる関数を設定)
5# 第四引数(任意) : add('+' or ''(デフォルト)を設定する。一つ前に宣言されるtag_bind関数を実行するのか設定するために利用される。)
6# ''の場合、一つ前のtag_bind関数で宣言された関数(第三引数)を実行しないで、今回tag_bindする関数を実行する。
7# '+'の場合、一つ前のtag_bind関数で宣言された関数(第三引数)を実行して、今回tag_bindする関数を実行する。
8# 戻り値 : なし
9# bindについて : https://kuroro.blog/python/eI5ApJE1wkU7bHsuwk0H/
10.tag_bind('タグ名', sequence, func, add) or .tag_bind('独自ID', sequence, func, add)
11
12# 「イベントと関数の実行」の紐づけを削除
13# 第一引数 : タグ名 or 独自ID
14# 第二引数 : sequence(イベント内容(ボタンを選択する、文字を入力するなど)を設定)
15# 戻り値 : なし
16# bindについて : https://kuroro.blog/python/eI5ApJE1wkU7bHsuwk0H/
17.tag_unbind('タグ名', sequence) or .tag_unbind('独自ID', sequence)
で定義されます。戻り値はありません。
「イベントと関数の実行」の紐づけに関しては、【コード付】Tkinterで使われるbindとは?bindの仕組みを交えて解説で詳しくまとめていますので、是非ご確認ください。
例えば下準備コードへ、以下のコードを記述して、
1class Application(tk.Frame):
2+ def helloWorld(self, event):
3+ print('hello world')
4
5 def __init__(self, master=None):
6 ...
7- canvas.create_oval(200, 100, 10, 20, fill='black')
8+ canvas.create_oval(200, 100, 10, 20, fill='black', tag='testtest')
9+ canvas.tag_bind('testtest', '<ButtonPress>', self.helloWorld)
描画される楕円を選択すると、以下の画像のように'hello world'が出力されます。
type
type関数を利用すると、指定するタグ名 or 独自IDに該当する、図形や画像の種類を取得できます。
1# 指定するタグ名 or 独自IDに該当する、図形や画像の種類を取得
2# 第一引数 : タグ名 or 独自ID
3# 戻り値 : 図形や画像の種類('arc' : create_arc, 'bitmap' : create_bitmap, 'image' : create_image, 'line' : create_line, 'oval' : create_oval, 'polygon' : create_polygon, 'rectangle' : create_rectangle, 'text' : create_text, 'window' : create_window)
4.type('タグ名') or .type('独自ID')
で定義されます。戻り値は、図形や画像の種類('arc' or 'bitmap' or 'image' or 'line' or 'oval' or 'polygon' or 'rectangle' or 'text' or 'window')が返されます。
例えば下準備コードのcanvas.create_oval(200, 100, 10, 20, fill='black')
の下へ、以下のコードを記述すると、
1- canvas.create_oval(200, 100, 10, 20, fill='black')
2+ canvas.create_oval(200, 100, 10, 20, fill='black', tag='testtest')
3+ print(canvas.type('testtest'))
以下の画像のように、'oval'の値を取得できます。
まとめ
- Tkinterの構成要素として、Window, Frame, Widgetの概念が存在する。
- 図形や画像を操作するためには、canvas Widgetで用意される関数を利用する。
- 操作する図形や画像を定めるために、タグと独自IDが利用される。