How to use the .place() method from Tkinter on a guizero object like pushbutton

Question

Hello I am trying to use the .place() Tkinter method on a guizero pushbutton object. With Tkinter the code would look like

vidbutton = tk.Button(w, text="Video", command = connectgp)
vidbutton.place(relheight=0.176, relwidth=0.176, relx=0.02, rely=0.02)

shutterbutton = tk.Button(w, text="Shutter", command = connectgp)
shutterbutton.place(relheight=0.176, relwidth=0.176, relx=0.196, rely=0.02)

When executed the above code will show two buttons placed next to each other with the correct ratio of spacing, I am trying to implement this using guizero instead with the following code

connectbutton = PushButton(app, text="Connect Gopros", command=connect)
connectbutton.tk.place(relheight=0.176, relwidth=0.176, relx=0.02, rely=0.02)

videobutton = PushButton(app, text="Video", command=video)
videobutton.tk.place(relheight=0.176, relwidth=0.176, relx=0.196, rely=0.02)

For the guizero code only the last button made will display with the correct placement and the .place() is completely ignored for the previous guizero objects.

Very confused and advice would help.

Answer 1

You need to put the Buttons Widget inside a Box Widget as its parent, you can get more details by following up with guizero layout guidance here: https://lawsie.github.io/guizero/layout/#boxes especially the alignment and location.

Based on what I tried, your code can give the same result of the standard tk if you made this adjustment:

from guizero import *

def connect():
    print("Connected!")


def video():
    print("Video!")

app = App(title="guizero")

botton_box = Box(app)
botton_box2 = Box(app)
botton_box.tk.place(relheight=0.176, relwidth=0.176, relx=0.02, rely=0.02)
botton_box2.tk.place(relheight=0.176, relwidth=0.176, relx=0.196, rely=0.02)

connectbutton = PushButton(botton_box,width="fill", height="fill", align="left", text="Connect Gopros", command=connect)
videobutton = PushButton(botton_box2, width="fill", height="fill", align="right",text="Video", command=video)


app.display()

The Layout will be like this based on your OS: