The “Book” Controls of wxPython (Part 1 of 2)

wx.Toolbook

The Toolbook is a wx.Toolbar plus a wx.Notebook, which means that you use labeled bitmap buttons to control which “tab” of the notebook you are viewing. As you probably noticed with the Listbook example, I used the wxPython demo’s “images” module for its images and I use it again in my sample code here.

import images
import wx
import panelOne, panelTwo, panelThree
 
def getNextImageID(count):
    imID = 0
    while True:
        yield imID
        imID += 1
        if imID == count:
            imID = 0
 
########################################################################
class ToolbookDemo(wx.Toolbook):
    """
    Toolbook class
    """
 
    #----------------------------------------------------------------------
    def __init__(self, parent):
        """Constructor"""
        wx.Toolbook.__init__(self, parent, wx.ID_ANY, style=
                             wx.BK_DEFAULT
                             #wx.BK_TOP
                             #wx.BK_BOTTOM
                             #wx.BK_LEFT
                             #wx.BK_RIGHT
                            )
 
        # make an image list using the LBXX images
        il = wx.ImageList(32, 32)
        for x in range(3):
            obj = getattr(images, 'LB%02d' % (x+1))
            bmp = obj.GetBitmap()
            il.Add(bmp)
        self.AssignImageList(il)
        imageIdGenerator = getNextImageID(il.GetImageCount())
 
        pages = [(panelOne.TabPanel(self), "Panel One"),
                 (panelTwo.TabPanel(self), "Panel Two"),
                 (panelThree.TabPanel(self), "Panel Three")]
        imID = 0
        for page, label in pages:
            self.AddPage(page, label, imageId=imageIdGenerator.next())
            imID += 1
 
        self.Bind(wx.EVT_TOOLBOOK_PAGE_CHANGED, self.OnPageChanged)
        self.Bind(wx.EVT_TOOLBOOK_PAGE_CHANGING, self.OnPageChanging)
 
    #----------------------------------------------------------------------
    def OnPageChanged(self, event):
        old = event.GetOldSelection()
        new = event.GetSelection()
        sel = self.GetSelection()
        print 'OnPageChanged,  old:%d, new:%d, sel:%d\n' % (old, new, sel)
        event.Skip()
 
    #----------------------------------------------------------------------
    def OnPageChanging(self, event):
        old = event.GetOldSelection()
        new = event.GetSelection()
        sel = self.GetSelection()
        print 'OnPageChanging, old:%d, new:%d, sel:%d\n' % (old, new, sel)
        event.Skip()
 
########################################################################
class DemoFrame(wx.Frame):
    """
    Frame that holds all other widgets
    """
 
    #----------------------------------------------------------------------
    def __init__(self):
        """Constructor"""
        wx.Frame.__init__(self, None, wx.ID_ANY,
                          "Toolbook Tutorial",
                          size=(700,400)
                          )
        panel = wx.Panel(self)
 
        notebook = ToolbookDemo(panel)
        sizer = wx.BoxSizer(wx.VERTICAL)
        sizer.Add(notebook, 1, wx.ALL|wx.EXPAND, 5)
        panel.SetSizer(sizer)
        self.Layout()
 
        self.Show()
 
#----------------------------------------------------------------------
if __name__ == "__main__":
    app = wx.PySimpleApp()
    frame = DemoFrame()
    app.MainLoop()

The Toolbook follows in the footsteps of the previous controls as its lineage comes from the wx.BookCtrlBase. This widget’s claim to fame is its look and feel (although it looks very similar to the Listbook) and the Toolbook’s unique events. I used some fun code from the wxPython demo to help in assigning images to the toolbar’s buttons, but that’s really the only difference of any importance. For full disclosure, read the docs for this control!

wx.Treebook

The Treebook control is a combination of the wx.TreeCtrl and the wx.Notebook. Most TreeCtrls that I’ve seen do not use images, but the wxPython demo uses them for the Treebook, so I decided to use them too. As you can see from the screenshot above, the bitmaps give the Treebook an interesting flavor. Let’s see how to make one of these controls!

import images
import wx
import panelOne, panelTwo, panelThree
 
def getNextImageID(count):
    imID = 0
    while True:
        yield imID
        imID += 1
        if imID == count:
            imID = 0
 
########################################################################
class TreebookDemo(wx.Treebook):
    """
    Treebook class
    """
 
    #----------------------------------------------------------------------
    def __init__(self, parent):
        """Constructor"""
        wx.Treebook.__init__(self, parent, wx.ID_ANY, style=
                             wx.BK_DEFAULT
                             #wx.BK_TOP
                             #wx.BK_BOTTOM
                             #wx.BK_LEFT
                             #wx.BK_RIGHT
                            )
        il = wx.ImageList(32, 32)
        for x in range(6):
            obj = getattr(images, 'LB%02d' % (x+1))
            bmp = obj.GetBitmap()
            il.Add(bmp)
        self.AssignImageList(il)
        imageIdGenerator = getNextImageID(il.GetImageCount())
 
        pages = [(panelOne.TabPanel(self), "Panel One"),
                 (panelTwo.TabPanel(self), "Panel Two"),
                 (panelThree.TabPanel(self), "Panel Three")]
        imID = 0
        for page, label in pages:
            self.AddPage(page, label, imageId=imageIdGenerator.next())
            imID += 1
            self.AddSubPage(page, 'a sub-page', imageId=imageIdGenerator.next())
 
        self.Bind(wx.EVT_TREEBOOK_PAGE_CHANGED, self.OnPageChanged)
        self.Bind(wx.EVT_TREEBOOK_PAGE_CHANGING, self.OnPageChanging)
 
        # This is a workaround for a sizing bug on Mac...
        wx.FutureCall(100, self.AdjustSize)
 
    #----------------------------------------------------------------------
    def AdjustSize(self):
        #print self.GetTreeCtrl().GetBestSize()
        self.GetTreeCtrl().InvalidateBestSize()
        self.SendSizeEvent()
 
    #----------------------------------------------------------------------
    def OnPageChanged(self, event):
        old = event.GetOldSelection()
        new = event.GetSelection()
        sel = self.GetSelection()
        print 'OnPageChanged,  old:%d, new:%d, sel:%d\n' % (old, new, sel)
        event.Skip()
 
    #----------------------------------------------------------------------
    def OnPageChanging(self, event):
        old = event.GetOldSelection()
        new = event.GetSelection()
        sel = self.GetSelection()
        print 'OnPageChanging, old:%d, new:%d, sel:%d\n' % (old, new, sel)
        event.Skip()
 
########################################################################
class DemoFrame(wx.Frame):
    """
    Frame that holds all other widgets
    """
 
    #----------------------------------------------------------------------
    def __init__(self):
        """Constructor"""
        wx.Frame.__init__(self, None, wx.ID_ANY,
                          "Treebook Tutorial",
                          size=(700,400)
                          )
        panel = wx.Panel(self)
 
        notebook = TreebookDemo(panel)
        sizer = wx.BoxSizer(wx.VERTICAL)
        sizer.Add(notebook, 1, wx.ALL|wx.EXPAND, 5)
        panel.SetSizer(sizer)
        self.Layout()
 
        self.Show()
 
#----------------------------------------------------------------------
if __name__ == "__main__":
    app = wx.PySimpleApp()
    frame = DemoFrame()
    app.MainLoop()

As with the Toolbook, I once again used a some code from the wxPython demo to create this demo and reused some of my own “framework” code. Besides the specialized events of the Treebook, you should also take note that it has an AddSubPage method, which adds a sub-node to the tree which in turn adds another page to the notebook. There are several other methods that only this control has: CollapseNode, ExpandNode, GetPageParent, GetTreeCtrl, InsertSubPage and IsNodeExpanded. I think they’re pretty self-explanatory, but don’t be afraid to read the documentation.

wx.AuiNotebook

Our final control for this article comes from the wx.aui namespace: the AuiNotebook. This is the only notebook control in this article that does not inherit from the generic BookCtrlBase. Be sure to study this control’s API to fully understand how to work with it as the AuiNotebook has several methods that are unlike the other controls we’ve seen so far.

The AuiNotebook allows the user to rearrange the tabs, drag the tab into its own area (as you can see from the screenshot above) or even drag the tab from one AuiNotebook to another. The following code snippet will allow you to do all these things:

import wx
import wx.aui
import panelOne, panelTwo, panelThree
 
class DemoPanel(wx.Panel):
    """
    This will be the first notebook tab
    """
    #----------------------------------------------------------------------
    def __init__(self, parent):
        """"""
        wx.Panel.__init__(self, parent=parent, id=wx.ID_ANY)
 
        # create the AuiNotebook instance
        nb = wx.aui.AuiNotebook(self)
 
        # add some pages to the notebook
        pages = [(panelOne.TabPanel(nb), "Tab 1"),
                 (panelTwo.TabPanel(nb), "Tab 2"),
                 (panelThree.TabPanel(nb), "Tab 3")]
        for page, label in pages:
            nb.AddPage(page, label)
 
        sizer = wx.BoxSizer(wx.VERTICAL)
        sizer.Add(nb, 1, wx.EXPAND)
        self.SetSizer(sizer)
 
########################################################################
class DemoFrame(wx.Frame):
    """
    Frame that holds all other widgets
    """
 
    #----------------------------------------------------------------------
    def __init__(self):
        """Constructor"""
        wx.Frame.__init__(self, None, wx.ID_ANY,
                          "AUI-Notebook Tutorial",
                          size=(600,400))
        panel = DemoPanel(self)
        self.Show()
 
#----------------------------------------------------------------------
if __name__ == "__main__":
    app = wx.PySimpleApp()
    frame = DemoFrame()
    app.MainLoop()

For this simple example, I just created an instance of AuiNotebook by instantiating against wx.aui.AuiNotebook(self) and passing in a wx.Panel. Then I added some pages using the AuiNotebook’s AddPage() method. Notice also that you can close any tab by clicking on its individual “x”. Now you know how to make your own AuiNotebook!

Wrapping Up

In the second part of this article, we will discover the many interesting features of the AGW Notebooks. One of the main reasons I left them out of this round-up is because they are pure python modules and have lots of extra capabilities that are not in this set of widgets. All of this code was tested using wxPython 2.8.10.1 (unicode), Python 2.5 on Windows XP and Vista. All the examples should run fine on Mac and Linux too, but feel free to let me know how well they work in the comments!

Downloads

Pages: 1 2 3

MrC

Mike

The two text widgets you've created in class TabPanel, are
common to all the tabs.

This somewhat defeats the purpose of a program having a tabbed notebook. Typically, each tab will have different functionality from the other tabs.

Would you add some examples that show how to add widgets that are different for each tab?

thanks
driscollis

Tabs one, two and three in the demo are completely different. What are you talking about? You can import and use any of the panelX.py files and use them...

- Mike
MrC

Put some text in the text widgets
txtOne = wx.TextCtrl(self, wx.ID_ANY, "First")
txtTwo = wx.TextCtrl(self, wx.ID_ANY, "Second")

You will see the same text no matter which tab you click on.
These 2 widgets are "common" to all three tabs.

I would like to know how you put different widgets on each of the tabs, so you only see the widgets for Tab 1 when you click on Tab 1, etc.
wxLover

Something is broken here -> import panelOne, panelTwo, panelThree
You haven't provided any code to be imported
driscollis

The code is in the download at the end of the article. I didn't show all my code since I put it in the source. Thanks,

- Mike
wxLover

Mike

Nice tutorial, but how do you implement the OnPageChanging() and OnPageChanged() methods?

Also- how do you "put" widgets onto the tabs?
driscollis

Hi,

Did you actually read the code? Lines 54 and 55 of "notebookDemo.py" show the following bindings:

self.Bind(wx.EVT_NOTEBOOK_PAGE_CHANGED, self.OnPageChanged)
self.Bind(wx.EVT_NOTEBOOK_PAGE_CHANGING, self.OnPageChanging)

Where "self" is a wx.Notebook. As for putting widgets onto the tabs themselves, you'd probably need to draw them yourself or use one of Andrea Gavana's notebooks: FlatNotebook or his AuiNotebook.

- Mike
MrC

"s for putting widgets onto the tabs themselves, you'd probably need to draw them yourself or use one of Andrea Gavana's notebooks: FlatNotebook or his AuiNotebook."
Wait - the while point behind using tabs is so that when you click on them, something different is displayed on each tab. Are you telling me that the stock notebook widgets can't even do that?
driscollis

No. I thought you were saying that you wanted to put widgets on the tab headers (the part the user clicks on to switch tabs). Of course you can put widgets on the pages themselves.

- Mike
MrC

Ok- going back to my previous post...
Since the two widgets you've created show up when you click on any tab (aka common to all), how do you go about putting widgets that only show up when click on on tab (aka unique to that tab)?

If you put some text into the widgets that you've created
txtOne = wx.TextCtrl(self, wx.ID_ANY, "First")
txtTwo = wx.TextCtrl(self, wx.ID_ANY, "Second")

You will see that text no matter which tab you click on.
I'm interested in seeing how you put widgets so that a different widget is visible when you click on each tab.
MrC

Sorry- I was reading "The Amazing FlatNotebook" when I posted that msg.
There is no "change" events in that tutorial.

I hadn't seen the Tutorial for the wx.Notebook.
driscollis

That makes sense. I probably should have made the class and function names more unique. Sorry about that!

- Mike
mld

@ Mo,

I haven't tried doing these examples in XRC yet, but I'll give it a try sooner or later.

- Mike
mld

@ RL,

They should be in the source download at the bottom of page 3:

http://www.blog.pythonlibrary.org/2009/12/03/th...

I just checked and they appear to be there. Let me know if they're not working for you.

- Mike
RL Frost

Mike,

I was wondering where to find the import source for panelOne, panelTwo, etc?

RL
Mo

Hi Mike,

Thanks for your great tutorial. Have you ever tried to make these examples with XRC? I like to use wxFormBuilder to create XRC and then use it to create your exmples. Would you please help me there.
Thanks
Mo
Steven Sproat

Great article, Mike! Thanks for all your help you provide for the wxpython community :)

S	M	T	W	T	F	S
« Nov				Jan »
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30	31

The Mouse Vs. The Python