Transparent Notebook Page/Setting Background Image for Notebook Pages in wxPython

Question

I am attempting to create a program using wxPython in which uses a tabbed notebook. I would like to set the background of the pages in the notebook to a single image. I was thinking that I could just set the background of the wxPanel containing the notebook to the image and then setting the pages to be transparent, but I cannot seem to find a way to. The one way I have gotten the background thing to work is by creating the method OnEraseBackground (found in the code below) and binding that to each page's wx.EVT_ERASE_BACKGROUND. Doing this, however, means that every time the page is drawn, it repaints the same image, which is not only a waste of processing power, but it also flashes as the image is being repainted, which looks very terrible upon use. I am looking for suggestions as to how to create transparent notebook pages, or if this not possible, then preventing the flashing from being repainted. Thank you much for your time. Code:

""" Imports """
import os
import wx

""" Global Variables """
abspath = os.path.abspath(__file__)
dname = os.path.dirname(abspath) + "/"
fullscreen = False

"""" Pages for the tab panel """
class Page1(wx.Panel):
    def __init__(self, parent):
        wx.Panel.__init__(self, parent)
        t = wx.StaticText(self, -1, "This is a Page1 object", (20,20))

class Page2(wx.Panel):
    def __init__(self, parent):
        wx.Panel.__init__(self, parent)
        t = wx.StaticText(self, -1, "This is a Page2 object", (20,20))

class Page3(wx.Panel):
    def __init__(self, parent):
        wx.Panel.__init__(self, parent)
        t = wx.StaticText(self, -1, "This is a Page3 object", (20,20))

class Page4(wx.Panel):
    def __init__(self, parent):
        wx.Panel.__init__(self, parent)
        t = wx.StaticText(self, -1, "This is a Page4 object", (20,20))

class Page5(wx.Panel):
    def __init__(self, parent):
        wx.Panel.__init__(self, parent)
        t = wx.StaticText(self, -1, "This is a Page5 object", (20,20))

""" Main Panel """
class MainPanel(wx.Panel):
    def __init__(self, parent):
        # Create the panel
        wx.Panel.__init__(self, parent)
        nb = wx.Notebook(self, -1)

        # Create the pages
        page1 = Page1(nb)
        page2 = Page2(nb)
        page3 = Page3(nb)
        page4 = Page4(nb)
        page5 = Page5(nb)

        # Add the pages to the notebook
        nb.AddPage(page1, "Page1")
        nb.AddPage(page2, "Page2")
        nb.AddPage(page3, "Page3")
        nb.AddPage(page4, "Page4")
        nb.AddPage(page5, "Page5")

        # Layout Management
        sizer = wx.BoxSizer()
        sizer.Add(nb, 1, wx.EXPAND)
        self.SetSizer(sizer)

        # Add key bindings
        nb.Bind(wx.EVT_KEY_DOWN, self.onKey)
        page1.Bind(wx.EVT_KEY_DOWN, self.onKey)
        page2.Bind(wx.EVT_KEY_DOWN, self.onKey)
        page3.Bind(wx.EVT_KEY_DOWN, self.onKey)
        page4.Bind(wx.EVT_KEY_DOWN, self.onKey)
        page5.Bind(wx.EVT_KEY_DOWN, self.onKey)

        # Add background bindings
        page1.Bind(wx.EVT_ERASE_BACKGROUND, self.OnEraseBackground)
        page2.Bind(wx.EVT_ERASE_BACKGROUND, self.OnEraseBackground)
        page3.Bind(wx.EVT_ERASE_BACKGROUND, self.OnEraseBackground)
        page4.Bind(wx.EVT_ERASE_BACKGROUND, self.OnEraseBackground)
        page5.Bind(wx.EVT_ERASE_BACKGROUND, self.OnEraseBackground)

    def OnEraseBackground(self, evt):
        dc = evt.GetDC()
        if not dc:
            dc = wx.ClientDC(self)
            rect = self.GetUpdateRegion().GetBox()
            dc.SetClippingRect(rect)
        dc.Clear()
        bmp = wx.Bitmap(dname + "background.jpg")
        dc.DrawBitmap(bmp, 0, 0)

    def onKey(self, event):
        key_code = event.GetKeyCode()
        # Toggle FullScreen (F11)
        if key_code == wx.WXK_F11:
            global fullscreen
            fullscreen = not fullscreen
            self.GetParent().ShowFullScreen(fullscreen)
        else:
            event.Skip()

""" Main Frame """
class MainFrame(wx.Frame):
    def __init__(self):
        # Frame and panel creation
        wx.Frame.__init__(self, None, title="Program")
        self.Maximize(True)
        panel = MainPanel(self)

""" Main """
if __name__ == "__main__":
    app = wx.App()
    MainFrame().Show()
    app.MainLoop()

score 1 · Answer 1 · answered Jul 29 '15 at 13:07

I would just create a single panel class that has the background image in it. Then just subclass that for each of your pages. Something like this:

import wx

########################################################################
class TabPanel(wx.Panel):
    """"""

    #----------------------------------------------------------------------
    def __init__(self, parent):
        """Constructor"""
        wx.Panel.__init__(self, parent)
        self.SetBackgroundStyle(wx.BG_STYLE_CUSTOM)
        self.Bind(wx.EVT_ERASE_BACKGROUND, self.OnEraseBackground)

    #----------------------------------------------------------------------
    def OnEraseBackground(self, evt):
        """
        Add a picture to the background
        """
        # yanked from ColourDB.py
        dc = evt.GetDC()

        if not dc:
            dc = wx.ClientDC(self)
            rect = self.GetUpdateRegion().GetBox()
            dc.SetClippingRect(rect)
        dc.Clear()
        bmp = wx.Bitmap("/path/to/image.jpg")
        dc.DrawBitmap(bmp, 0, 0)

########################################################################
class MainPanel(wx.Panel):
    """"""

    #----------------------------------------------------------------------
    def __init__(self, parent):
        """Constructor"""
        wx.Panel.__init__(self, parent)
        notebook = wx.Notebook(self)

        tab_one = TabPanel(notebook)
        notebook.AddPage(tab_one, "Tab One")

        tab_two = TabPanel(notebook)
        notebook.AddPage(tab_two, "Tab Two")

        sizer = wx.BoxSizer(wx.VERTICAL)
        sizer.Add(notebook, 1, wx.ALL|wx.EXPAND, 5)
        self.SetSizer(sizer)



########################################################################
class MainFrame(wx.Frame):
    """"""

    #----------------------------------------------------------------------
    def __init__(self):
        """Constructor"""
        wx.Frame.__init__(self, None, title="Notebooks")
        panel = MainPanel(self)

        self.Show()

if __name__ == '__main__':
    app = wx.App(False)
    frame = MainFrame()
    app.MainLoop()

Transparent Notebook Page/Setting Background Image for Notebook Pages in wxPython

1 Answers1