tkinterで本体とキャンバス作成
tk.Tk()
で、本体作成
geometry
で、大きさと位置
tk.Canva
で、キャンバス作成
cv.place(x=0, y=0)
で、設置
root.mainloop()
で本体起動、コードここから動かなくなる
import tkinter as tk #本体 root = tk.Tk() root.geometry("500x500+100+100") #(横幅x縦幅+x座標+y座標) #キャンバス作成 cv = tk.Canvas(root, width=500, height=500,bg="#000000") #(本体,width=横幅,height=縦幅,bg=背景色) cv.place(x=0, y=0)#キャンバス左上を、本体のどの位置に置くか root.attributes("-topmost", True)#常に手前に表示 root.mainloop()#本体実行
キャンバスサイズ変更
本体のサイズ変えても、キャンバスのサイズは変わらないので、自分で作る
※動画でも言っていますが、root.bind("<Configure>",)
を使うとcup使用率が高くなってしまうので、自分で作る
本来はroot.bind("<Configure>",)
で作る
w = 500#幅の初期値 h = 500#高さの初期値 #リサイズ関連 def resize(): global w,h #defの中でも使用したい # 本体のサイズを取得 width = root.winfo_width() height = root.winfo_height() if width != w or height != h: cv.config(width=width-4, height=height-4)#キャンバスサイズ変更 w = width h = height root.after(300,resize)#0.3秒ごとにループ root.after(300,resize)#0.3秒後に実行
root.after(300,resize)
で0.3秒後にresizeを実行
resize内にroot.after(300,resize)
があるのでまた0.3秒後にresizeを実行
resize内にroot.after(300,resize)
があるのでまた0.3秒後にresizeを実行…
cv.config
でキャンバスサイズを上書き
クリック関係の基本
事前にroot.bind
と書いておけば、ずっとマウスを監視して、
クリックされたら勝手に関数読んでくれる
要は書いておけばok
#左クリック時 def aaa(event): print(event.x,event.y)#クリックされた位置 #ドラッグ時 def bbb(event): print(event.x,event.y)#ドラッグされている位置 #左クリック離したら def ccc(event): print(event.x,event.y)#クリック離された位置 #マウスの監視 root.bind("<Button-1>", aaa)#左クリックされたらaaa読まれる root.bind("<B1-Motion>", bbb)#ドラッグされたらbbb読まれる root.bind("<ButtonRelease-1>",ccc)#左クリック離したらccc読まれる
点と線、描写の基本
点→長方形に接する楕円
線→始点と終点を結んだ線
#点 cv.create_oval(x1, y1, x2, y2, fill="#f5f5f5") #(左上の座標,右下の座標,fill=色) #線 cv.create_line(x1, y1, x2, y2, fill="#f5f5f5", width=4,capstyle="round") #(始点xy, 終点xy, fill=色, width=線の幅,capstyle=直線の端のスタイル)
まとめ
点(クリック)と線(ドラッグ)は分けて考える
合体↓
import tkinter as tk #線の始点用 prev_x = None prev_y = None w = 500#幅の初期値 h = 500#高さの初期値 ########################関数################################################# #リサイズ関連 def resize(): global w,h #defの中でも書き換えたい # 本体のサイズを取得 width = root.winfo_width() height = root.winfo_height() if width != w or height != h: cv.config(width=width-4, height=height-4)#キャンバスサイズ変更 w = width h = height root.after(300,resize)#0.3秒ごとにループ #左クリック(点) def aaa(event): cv.create_oval(event.x - 3, event.y - 3, event.x + 3, event.y + 3, fill="#f5f5f5") #event.x,event.yはクリックされた位置 #ドラッグ(線) def bbb(event): global prev_x, prev_y #defの中でも書き換えたい if prev_x and prev_y:#始点あるか cv.create_line(prev_x, prev_y, event.x, event.y, fill="#f5f5f5", width=4,capstyle="round") #始点は1つ前の終点 prev_x = event.x #始点は1つ前の終点 prev_y = event.y #始点は1つ前の終点 #左クリック離したら始点を初期化 def ccc(event): global prev_x, prev_y #defの中でも書き換えたい prev_x = None prev_y = None #######################tkinter############################################################ root = tk.Tk()#本体 root.geometry(f"{w}x{h}+100+100") #(横幅x縦幅+x座標+y座標) cv = tk.Canvas(root, width=w-4, height=h-4,bg="#000000") #キャンバス(本体,width=横幅,height=縦幅,bg=背景色) cv.place(x=0, y=0)#本体からの位置 #マウスの状態監視 root.bind("<Button-1>", aaa)#左クリックされたらaaa読まれる root.bind("<B1-Motion>", bbb)#ドラッグされたらbbb読まれる root.bind("<ButtonRelease-1>",ccc)#左クリック離したらccc読まれる #常に手前に表示 root.attributes("-topmost", True) root.after(300,resize)#0.3秒後にresize実行 root.mainloop()#本体実行
おまけ(カンニングペーパー)
動画のカンニングペーパーのコード
ChatGPTに聞いて
ダウンロード
windowsのみ
すべて展開→警告→詳細→実行
https://github.com/namakemono22/memocho