Positioning widgets


We're starting to get somewhere; we can type our notes into the text box and then add them to a list. The program is a bit ugly though, everything's lined up vertically, and the textbox and listbox are too small to really use that well. We need a bit more control over where widgets are placed. There are a few ways to do this, but all we're really after is to divide the window into two sections, one for the text box and the buttons, and the other holding the listbox. For that we're going to use the Frame widget, which is like a container in which you can put other widgets -- just like the root window. So let's create a couple of frames:

textframe = Frame(root)
listframe = Frame(root)

Now so far we've been setting the owner of each widget to be the root window, let's change that to reflect our new design:

button1 = Button(textframe, text="button1", command = Button1)
button2 = Button(textframe, text="button2", command = Button2)
button3 = Button(textframe, text="button3", command = Button3)

text = Entry(textframe)

scrollbar = Scrollbar(listframe, orient=VERTICAL)
listbox = Listbox(listframe, yscrollcommand=scrollbar.set)
scrollbar.configure(command=listbox.yview)

That's not going to do a lot unless we tell Tk where in the frame to put the widgets, for this we're going to use the pack method and three keywords: side, fill and expand. You can think of side as being similar to alignment in a word processor, it tells the widgets which side of the frame they should generally try to be on, the TOP, BOTTOM, LEFT or RIGHT -- the default being to cluster around the centre. In this case, we'll want everything except the scrollbar to be LEFT aligned, with the scrollbar hugging the right side of the listbox.

The second option, fill, tells Tk which directions to fill out the widget if it grows, in the X direction (horizontal), the Y direction (vertical) or BOTH. Generally speaking, we're alright with buttons as they are, but it makes sense for the text and list boxes to use as much space as is available -- so set the textbox fill to X and the listbox to BOTH -- the scrollbar should resize with the listbox, so set its fill to Y. Finally the expand option tells the widget whether or not to expand into free space if it is possible -- add expand=1 to the textbox and listbox pack options. You should now have code looking like this:

text.pack(side=LEFT, fill=X, expand=1)
button1.pack(side=LEFT)
button2.pack(side=LEFT)
button3.pack(side=LEFT)
listbox.pack(side=LEFT,fill=BOTH, expand=1)
scrollbar.pack(side=RIGHT, fill=Y)

Now all that's left is to pack the two frames into the root window, which is just the same as packing any other widget. Remember which ways the frames should expand:

textframe.pack(fill=X)
listframe.pack(fill=BOTH, expand=1)

Lastly, we should set the default size of the window to give a little more room for our widgets:

root.geometry("600x400")

And that's it, your window should now look like:



Related links

Comments

1

kirti - 04/04/08

how can take the scrollbar in listview at top positon and right side

» Report offensive content

2

Erik Carlson - 12/05/08

Good write up.
I've been working with Python in scripting sql commands to recreate test customer databases in Oracle, but this is the first time I've found a cohesive and logical progression in understanding how to pull various widgets, packing and framing together in one write up. One problem I have with current documentation with Tk is no high level overview. I have one now.

Thanks,
Erik

» Report offensive content

3

Aimen Latir - 10/06/08

Nice report you have there.
I was trying to get all that into python, but when I ran the code, it said that I didn't have the module called "TKinter". May you please help me figure out where to get TK? I've been looking all over the internet, but I still can't find it.

Please help me,
Aimen

» Report offensive content

4

Nick - 04/08/08

This was a fantastic tutorial - one of the best I've found on the net to date about everything, it was concise and straight forward.

Just one thing I thought I should mention, when going through the first page I didn't realise I had to pack both the scrollbar and the listbox until I went though the code underneath the scrollbar section, maybe mention that.

» Report offensive content

5

Mike - 19/09/08

Aimen Latir,
make sure when you import you use "Tkinter" with only the t capitalized because the Python interpriter is case sensitive.

» Report offensive content

6

arkaros - 12/10/08

great tutorial two thumbs upp. Have you thought of making a folow up. I am thinking of maby learning abit of python to use with blender but you i gotta start somewhere because python is pretty different from the other languages i have used

» Report offensive content

7

jeremy - 17/10/08

how do you accept int values? doesnt the entry even convert everything to a string?

» Report offensive content

8

Joe - 18/02/09

I get this error when I try to add the buttons:

Traceback (most recent call last):
File "C:\Python26\Lib\site-packages\pythonwin\pywin\framework\scriptutils.py", line 312, in RunScript
exec codeObject in __main__.__dict__
File "C:\Documents and Settings\jpattison\Desktop\test\test.py", line 6, in <module>
button1 = Button(root, text="button1")
File "C:\Python26\lib\lib-tk\Tkinter.py", line 2002, in __init__
Widget.__init__(self, master, 'button', cnf, kw)
File "C:\Python26\lib\lib-tk\Tkinter.py", line 1932, in __init__
(widgetName, self._w) + extra + self._options(cnf))
TclError: can't invoke "button" command: application has been destroyed

(sorry to take so much space!)

What could be the problem?
Thanks!

» Report offensive content

9

Mark Abajian - 12/03/09

Very helpful. Many thanks.

» Report offensive content

10

mark s - 23/03/09

Thanks for putting this into plain english, now ive got the basics i can start to understand the rest of tkinter. Well done on this concise and clear tutorial

» Report offensive content

11

Fabio - 27/04/09

Definitely one of the greatest tutorials ever! :D I love the spinn-off application I've built today using your tutorial. Thank you so much for the time you took to explain this as extensively as you did. You're the best! :D will certainly get deeper into Python and TK! :D

» Report offensive content

12

Fabio - 27/04/09

Definitely one of the greatest tutorials ever! :D I love the spinn-off application I've built today using your tutorial. Thank you so much for the time you took to explain this as extensively as you did. You're the best! :D will certainly get deeper into Python and TK! :D

» Report offensive content

13

Matt - 26/06/09

OMG this is THE BEST! I haven't found a single tutorial on this subject and it's been killing me tryin to find one! Thnx loads! This will definately help me loads!!!!!!!!!:D

» Report offensive content

14

Matt - 09/07/09

Joe,
It looks like an error with the Tkinter.py file. Maybe it's a version clash... What version of python have you got? Maybe this isn't going to work for 3.x . Maybe...i got that error once but i can't remember how i fixed it...try searching in your python directory for Tkinter and if there's a compiled python file for Tkinter try...deleting it. BE CAREFUL!!! DO NOT DELETE THE .py FILE. ONLY THE COMPILED PYTHON FILE IF THERE IS ONE!!!

» Report offensive content

15

Chris - 23/07/09

Thankyou so much for taking the time to write up this tutorial. I have looked at some much other documentation and all of it was garbage compared to the simple step by step method you use.

» Report offensive content

16

Shakir Ahmed - 30/07/09

It is really a great to startup but if I need more details to develop customize application where I will get that.

» Report offensive content

17

Gulam Gaus - 20/08/09

Its very good & descriptive help for Tkinter at times when there arent good practical documentation available anywhere & scarcity of such valuable input to all the budding developers..Good work. Keep it up. Maybe I expect to see more of such illustrative technical input for all developers.

» Report offensive content

18

Rat - 26/08/09

This isn't even right, learn how to program.

» Report offensive content

19

Rat - 26/08/09

Ha ha! JOSEPH! Look at me i like to steal people's computers

» Report offensive content

20

Rat - 26/08/09

21

Michael Jackson - 03/03/10

I am learning to program in Python but not new to programming. I am in search of answer and I've searched and searched the web not one website has anything that has to do with EVENTS such as OnCreate, OnShow, BeforeDestory, AfterDestroy, OnChange, OnFormCreate, etc...I've gone through a lots of examples all over the web but I am coming empty handed. Just a simple example would be so great.

Please help.

» Report offensive content

22

vj - 03/03/10

its a good one.............

» Report offensive content

Leave a comment

You must read and type the 6 chars within 0..9 and A..F

* indicates mandatory fields.

22

vj - 03/03/10

its a good one............. ... more

21

Michael Jackson - 03/03/10

I am learning to program in Python but not new to programming. I am in search of answer and I've searched ... more

20

Rat - 26/08/09

Errrr mikaela ... more

Log in


Sign up | Forgot your password?

  • Staff Microsoft shows off IE9 preview

    This week, highlights from Microsoft's MIX10 conference and more in the Roundup. Read more »

    -- posted by Staff

  • Chris Duckett IE9's H.264 vote killed Ogg

    In a split decision by the judges, the winner of the W3C/WHATWG video codec consensus is H.264, taking home the future of video playback on the internet while loser Ogg goes home with nothing but thoughts of what might have been. Read more »

    -- posted by Chris Duckett

  • Staff Google launches Apps Marketplace

    Google launches and app store, while Mozilla plans to re-write its open-source license. More of this week's news in the Roundup. Read more »

    -- posted by Staff

What's on?

  • Optus Deal

    Broadband + home phone + PlayStation®3 in a single package price!