レイアウト - Tkinter - ボタンをグループ化する

Question

私はTkinterを使って新しく、本当に簡単なGUIを作っています。 JavaFXのバックグラウンドから来て、私は座標上にボタンの位置を置くことができないので、ちょっと混乱しています。

これは私の実際のコードです：

class MoveRobot(Frame): 

grid_counter = 0 

def __init__(self): 
    Frame.__init__(self) 
    self.master.title("Control Robot") 
    self.master.geometry("400x400") 
    self.master.rowconfigure(0, weight=1) 
    self.master.columnconfigure(0, weight=1) 
    self.grid(sticky=W + E + N + S) 

    self.list_box = Listbox(self) 
    self.list_box.grid(rowspan=4, sticky=W + E + N + S) 

    self.button1 = Button(self, text="UP", command=self.button_up) 
    self.button1.grid(row=0, column=1, columnspan=2, sticky=W + E + N + S) 

    self.button2 = Button(self, text="DOWN", command=self.button_down) 
    self.button2.grid(row=1, column=1, columnspan=2, sticky=W + E + N + S) 

    self.button3 = Button(self, text="LEFT", command=self.button_left) 
    self.button3.grid(row=2, column=1, columnspan=2, sticky=W + E + N + S) 

    self.button4 = Button(self, text="RIGHT", command=self.button_right) 
    self.button4.grid(row=3, column=1, columnspan=2, sticky=W + E + N + S) 

    self.button_cancel = Button(self, text="Remove Last", command=self.button_remove_last) 
    self.button_cancel.grid(row=4, columnspan=2, sticky=W + E + N + S) 

    self.button_cancel = Button(self, text="Clear", command=self.button_clear) 
    self.button_cancel.grid(row=5, columnspan=2, sticky=W + E + N + S) 

    self.button_compile = Button(self, text="Compile", command=self.button_compile) 
    self.button_compile.grid(row=6, columnspan=2, sticky=W + E + N + S) 

    self.rowconfigure(1, weight=1) 
    self.columnconfigure(1, weight=1) 

#controller code is removed because unnecessary 

def main(): 
    MoveRobot().mainloop() 

if __name__ == "__main__": 
    main() 

そして、以下の私のGUIが作成されたもの。

しかし、私は一緒に 'UP' ボタン、 'DOWN'、 'LEFT' と 'RIGHT' を堅持するために管理することができません。私はフォーラムやウェブサイトを見ようとしましたが、解決策を見つけることができませんでした。これは単なるレイアウト上の問題であるため、かなり単純です。

私が欲しいの出力はこのようなものでなければなりません。..

誰でも助けることができるのですか？私はTkinterの使い方がわからず、Web上で解決策を見つけることができないので、この質問が他の人にとっても有益であることを願っています。

ありがとうございます。

Answer 1

グリッドをわずかに再構成する必要があるかもしれません...
この場合、リストボックスはボタンと同じ数の行を占有します。したがって、行の高さはリストボックスの高さに均等に分散され、ボタンはリストボックスの高さに沿って均等に配置されます。ただし、ボタンを上部にグループ化する場合は、最後のボタンの後の行が追加のスペースを考慮して「ストレッチ」する必要があります。
多分これ（不器用）アスキー・アートは、ソリューションがrowconfigureです...
--------- | lb | Box 1 (row 1) | lb | Box 2 (row 2) | lb | Box 3 (row 3) | lb | xxxxx (row 4) | lb | xxxxx (still row 4) --------- Other boxes
を紹介します！
これは、tkinterに展開するための余分なスペースがあれば、その行をどのように展開するかを指示します。
これは必要です。なぜなら、行が空であれば、tkinterは自動的にそこに存在すべきではないと仮定し、それを何も縮小せずに引き伸ばすことになると思います。
この場合、リストボックスの行スパンを1増やしてからself.rowconfigure(4, weight=1)を呼び出します。
あなたが作成した新しい（空白の）行は4です。weightは、1つの相対単位で展開するようにtkinterに指示します。rowsconfiguresが複数ある場合に便利です。
P.他のボタンを1つ下に移動する必要があります！

Answer 2

レイアウトの問題を解決するための秘訣は、UIをセクションに分割して、一度に1つのセクションにフォーカスすることです。あなたのケースでは、左のリストボックス、右のボタングループ、一番下のボタングループの3つのセクションが表示されます。

右のボタンについて具体的に質問しているので、これはこの回答で取り上げるグループです。それと

button_frame = Frame(self) 
self.button1 = Button(button_frame, ...) 
self.button2 = Button(button_frame, ...) 
self.button3 = Button(button_frame, ...) 
self.button4 = Button(button_frame, ...) 

self.button1.pack(side="top", fill="x") 
self.button2.pack(side="top", fill="x") 
self.button3.pack(side="top", fill="x") 
self.button4.pack(side="top", fill="x") 

、あなたはそのフレームを置くに関係なく：私の意見では

、最も簡単な解決策は、ボタンのフレームを作成し、フレームの上部にあるボタンをパックすることですボタンは常に一番上に表示されます。あなたの場合、リストボックスとフレームを同じ行に置くことができます。

self.list_box.grid(row=0, column=0, sticky="nsew") 
    button_frame.grid(row=0, column=1, sticky="nsew")