python3 tkinterでフレームの幅を自動で決定して欲しい

Question

pythonでGUIを作成しています。

機能の一部に、アカウント名とメールアドレスを任意の数記入する場所を作りたいと思っています。

2点問題があります。

1.フレームの横幅が自動で調整されない。
windowsとMacで同じソースコードなのに、必要な横幅が違いました。
そこで、widthを指定してないでcframe2の横幅で作成したいのですが、方法が見つかりません。

1. canvas とその中に作ったwindowとの問題だと思うのですが

スクロール前のcanvas内を選択すると出てくる黒枠からwindowがはみ出てしまいます。
スクロールしたらNo.10のところは綺麗に納まっています。
これを綺麗に枠内に納めるにはどこの調整したらいいのでしょうか？
canvas7.create_window((10, 10), window=cframe2, anchor="ne")
ここの(10,10)をいじっても上手くいきませんでした。

宜しくお願いします。

# tkinter
from tkinter import *
import tkinter as tk

class Application(Frame):

    def __init__(self, master=None):
        Frame.__init__(self,master)
        master.configure(bg="white")
        self.pack() #描写
        self.create_widgets(master)       #フォームの作成



    #フォームの作成
    def create_widgets(self,master):

        """ 
        スクロールバー Canvas
        """

        # フォルダー表示 フレーム
        Frm5 = Frame(master,bg="blue")
        Frm5.bind("<Configure>", self.on_resize)
        
        
        self.canvas7 = Canvas(Frm5 ,bg="white" , height=170)


        bar = Scrollbar(Frm5, orient=VERTICAL)   
        bar.grid(row=0, column=1, sticky="ns")
        bar.config(command=self.canvas7.yview)
        bar.propagate(False)
        

        Frm5.grid_columnconfigure(0, weight=1)
        Frm5.pack(padx=10 ,pady=5 , fill="both")

        # Canvas Widget を配置
        cframe2=Frame(self.canvas7 ,bg="red")
        self.minicanca = self.canvas7.create_window((10, 10), window=cframe2, anchor="nw")
        self.canvas7.config(yscrollcommand=bar.set)
        self.canvas7.grid(row=0, column=0, padx=10 ,pady=5,sticky="we")



        self.Widget_items = []
        

        """ 
        アカウント名 , アイコンパス , メールアドレス , アイコン画像 ヘッダー
        """
        # アカウント名  ラベル
        L＿no = tk.Label(cframe2,font=("12"))
        L＿no.configure(text="No", bg="white")
        L＿no.grid(row=0, column=0 ,pady=5,padx=5)

        # アカウント名  ラベル
        L_account = tk.Label(cframe2,font=("12"))
        L_account.configure(text="アカウント名", bg="white" )
        L_account.grid(row=0, column=1,pady=5,padx=5)

        # アイコンのファイル名  ラベル
        L_account = tk.Label(cframe2,font=("12"))
        L_account.configure(text="アイコンのファイル名", bg="white" )
        L_account.grid(row=0, column=2,pady=5,padx=5)
        
        # メールアドレス  ラベル
        L_mail = tk.Label(cframe2,font=("12"))
        L_mail.configure(text="メールアドレス", bg="white" )
        L_mail.grid(row=0, column=3 ,pady=5,padx=5)

        

        """ 
        アカウント名 , アイコンパス , メールアドレス , アイコン画像
        """

        self.Widget_items = []
        
        for i in range(10):
            items = []
                
            # アカウント名  ラベル
            self.L＿no1 = tk.Label(cframe2)
            self.L＿no1.configure(text=f"{i+1}", bg="white")
            self.L＿no1.grid(row=i +1, column=0)
            items.append(self.L＿no1)

            # アカウント名 テキストボックス
            Text_aka = StringVar()
            self.aka_box  = Entry(cframe2,textvariable=Text_aka ,width = 25 ,font=("12") )
            self.aka_box.grid(row=i +1, column=1, sticky="nw")
            items.append(self.aka_box)


            # アイコンのファイル名とキャンバスのセット
            ifrma = Frame(cframe2, bg="white")
            ifrma.grid(row=i +1, column=2, sticky="nw",padx=10)

            # アイコンのファイル名 テキストボックス

            Text_icon = StringVar()
            self.icon_box  = Entry(ifrma,textvariable=Text_icon ,width = 15,font=("12"))
            self.icon_box.grid(row=0, column=0, sticky="nw")
            items.append(self.icon_box)

            # アイコンの表示
            canvas2 = Canvas(ifrma , width=24 , height=24)
            canvas2.grid(row=0, column=1)
            items.append(canvas2)

            # アカウント名 テキストボックス
            Text_mail1 = StringVar()
            self.mail1_box  = Entry(cframe2 , textvariable=Text_mail1 ,width = 25 ,font=("12"))
            self.mail1_box.grid(row=i +1, column=3, sticky="n")
            items.append(self.mail1_box)
            
            self.Widget_items.append(items)

        #  canvas scroll
        self.canvas7.update_idletasks()
        self.canvas7.config(scrollregion=self.canvas7.bbox("all"))



    # キャンバスのリサイズ
    def on_resize(self,event):
        self.canvas7.itemconfigure(self.minicanca, width=event.width)
        self.canvas7.config(scrollregion=self.canvas7.bbox("all"))

if __name__ == "__main__":
    
    root = Tk()
    app = Application(master=root)
    app.mainloop()

#追記
説明不足で申し訳ありません。
フレームに色付けしました。

切れていうというのは、現状の方はもっと右側にも表示しているものがあるのに表示されないということでした。

背景が赤はcframe2なのですが、これは
self.canvas7.create_window((10, 10), window=cframe2, anchor="nw")
とcreate_windowの時に使用しています。
これが認識されていないのではないかと予想しているのですが、解決方法が分かりません。

色をつけて思ったのですが、
キャンバスないのEntryをクリックするとcframe2の外枠が表示されます。
これを消す方法はないのでしょうか？
クリックしていない時は表示されていなません。

Answer 1

かなりコードを変えなければいけないですし、
質問の趣旨に則っていないかもしれないのですが、
Canvasではなく、Frameを使用して、配置時に、
.pack(fill="both", expand=True)とかするとうまく行くかもしれないです。
正直、padをいじったりwidth, heightの指定はいい思い出がないので......

Comments

[Yuiti628]

ありがとうございます。
私もできればサイズの指定は行いたくないです、、

問題はフレームだとスクロールバーが使えないのばないでしょうか？

スクロールバーは必須なので、、

[Marusoftware]

スクロールバーを使いたいのであれば、
https://pypi.org/project/ttkwidgets/
とかにあるscrolledFrameを使うとよいかと。

[Yuiti628]

こんなのがあったのですね！

ありがとうございます

試してみます

[Marusoftware]

えっと、使い方は
https://ttkwidgets.readthedocs.io/en/stable/ttkwidgets/ttkwidgets.frames/ttkwidgets.frames.ScrolledFrame.html#ttkwidgets.frames.ScrolledFrame
にあります...

[Yuiti628]

思っていたことが簡単にできました(T . T)
ありがとうございます。

[teamikl]

ScrolledFrame の利用に +1

> 正直、padをいじったりwidth, heightの指定はいい思い出がないので

同感です。テキストウィジェット以外でのwidth/heightは
resize 禁止にして、placeで座標固定レイアウトを組む時用っぽいですね。

Answer 2

canvas7.create_window((10, 10), window=cframe2, anchor="ne")

ここの(10,10)をいじっても上手くいきませんでした。

余白を期待しての調整だとすれば、pack/grid の padx,pady を使います。

create_window に指定する値は、scrollregion 中の何処に配置するかなので、
余白として機能させるには、scrollregion 側の座標を余白分大きめに設定する必要があります。

---

レイアウトの調整は、フォームやキャンバスの背景色を変更して
何処のウィジェットに調整が必要なのかを調べてみて下さい。

• ifrma.grid_columnconfigure 辺りを確認。

---

Entry ウィジェットの横幅は、width プロパティとフォントサイズにより決定します。
環境で横幅が異なる場合は、フォントサイズ指定を試して下さい。

---

キャンバスのリサイズに対応するには、リサイズ時のイベントで設定します。
（※ 変数名等は質問のコードに対応してません）

# create_window の戻り値を控えておく
item = canvas.create_window(...)

def on_resize(event):
    # キャンバス内のフォームをリサイズに追従する場合
    canvas.itemconfigure(item, width=event.width)

    # (必要があれば) スクロール領域も更新
    canvas.config(scrollregion=canvas.bbox("all"))

# ここの frame は canvas の親のイベントに設定。
# create_window で配置するフレームではない。
frame.bind("<Configure>", on_resize)

---

掲載の画像「初期」は、画面の左端が見切れてるということですか？

確証はありませんが、create_window の anchor="ne" → "nw" に変更
を試してみて下さい。 ne だと左右の座標が反転します。

それでも治らない時は、コード末尾にて表示領域のリセットを試して下さい。

#  canvas scroll
canvas7.update_idletasks()
canvas7.config(scrollregion=canvas7.bbox("all"))
+ canvas7.xview_moveto(0)
+ canvas7.yview_moveto(0)

---

追記:
逆だったかな、「フレームの幅を自動で決定」とのことだけど、
キャンバスの幅をフレームから求める場合は、

canvas7.update_idletasks() の後に
canvas7.config(width=cframe2.winfo_width())

Comments

[Yuiti628]

ありがとうございます。
教えて頂いたことは試したのですが、上手くいきませんでした。

`on_resize(event)`は確かにリサイズできているので、こちらはそのまま追加されて頂きました.

「初期」の部分は切れているということで有っているのですが、全体のフレームの方でした。
canvas7が認識されていないように感じされます。
anchor="ne" → "nw"はありがとうございます????‍♂️

#追記の方に色付けしたものを追加しました。

宜しくお願いします。

[teamikl]

＞canvas7が認識されていないように感じされます。

別の質問でも触れられてるようですが、
編集後のコードを見る限り、回答に追記した部分を試されてない気がする。