Lecture-widgets.ipynb

{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# wxpython\n",
    "\n",
    "To make a graphycal interface to use a code in an interactive way we need a library of widgets, called wxpython.\n",
    "We will explore the usage of this library mainly with examples. But to start, we have to install it with conda:\n",
    "\n",
    "```bash\n",
    "conda install wxpython\n",
    "```\n",
    "\n",
    "\n",
    "## A First Application: \"Hello, World\"\n",
    "\n",
    "As tradition, we are first going to write a small \"Hello, world\" application. "
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 16,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting framecode.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile framecode.py\n",
    "#!/usr/bin/env python\n",
    "import wx\n",
    "\n",
    "app = wx.App(False)  # Create a new app, don't redirect stdout/stderr to a window.\n",
    "frame = wx.Frame(None, wx.ID_ANY, \"Hello World\") # A Frame is a top-level window.\n",
    "frame.Show(True)     # Show the frame.\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 17,
   "metadata": {
    "collapsed": false,
    "scrolled": true
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python framecode.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {
    "collapsed": true
   },
   "source": [
    "Every wxPython app is an instance of wx.App. For most simple applications you can use wx.App as is. When you get to more complex applications you may need to extend the wx.App class. The \"False\" parameter means \"don't redirect stdout and stderr to a window\".\n",
    "\n",
    "A **wx.Frame** is a top-level window. The syntax is *wx.Frame(Parent, Id, Title)*. Most of the constructors have this shape (a parent object, followed by an Id). In this example, we use None for \"no parent\" and wx.ID_ANY to have wxWidgets pick an id for us."
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## wx.TextCtrl widget\n",
    "\n",
    "To add some text to the frame, we have to use the widget wx.TextCtrl.\n",
    "By default, a text box is a single-line field, but the wx.TE_MULTILINE parameter allows you to enter multiple lines of text.\n",
    "\n",
    "In this example, we derive from wx.Frame and overwrite its \\__init\\__ method. Here we declare a new wx.TextCtrl which is a simple text edit control. Note that since the MyFrame runs self.Show() inside its \\__init\\__ method, we no longer have to call frame.Show() explicitly."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 18,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting editor.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile editor.py\n",
    "#!/usr/bin/env python\n",
    "import wx\n",
    "class MyFrame(wx.Frame):\n",
    "    \"\"\" We simply derive a new class of Frame. \"\"\"\n",
    "    def __init__(self, parent, title):\n",
    "        wx.Frame.__init__(self, parent, title=title, size=(200,100))\n",
    "        self.control = wx.TextCtrl(self, style=wx.TE_MULTILINE)\n",
    "        self.Show(True)\n",
    "\n",
    "app = wx.App(False)\n",
    "frame = MyFrame(None, 'Small editor')\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 19,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python editor.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Status bar & Menu bar\n",
    "\n",
    "Typically, an application has a menu and sometimes a status bar to output messages.\n",
    "\n",
    "Notice the wx.ID_ABOUT and wx.ID_EXIT ids. These are standard ids provided by wxWidgets (see a full list at http://docs.wxwidgets.org/2.8.12/wx_stdevtid.html). It is a good habit to use the standard ID if there is one available. This helps wxWidgets know how to display the widget in each platform to make it look more native.\n",
    "\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 20,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting editor.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile editor.py\n",
    "#!/usr/bin/env python\n",
    "import wx\n",
    "\n",
    "class MainWindow(wx.Frame):\n",
    "    def __init__(self, parent, title):\n",
    "        wx.Frame.__init__(self, parent, title=title, size=(200,100))\n",
    "        self.control = wx.TextCtrl(self, style=wx.TE_MULTILINE)\n",
    "        self.CreateStatusBar() # A Statusbar in the bottom of the window\n",
    "\n",
    "        # Setting up the menu.\n",
    "        filemenu= wx.Menu()\n",
    "\n",
    "        # wx.ID_ABOUT and wx.ID_EXIT are standard IDs provided by wxWidgets.\n",
    "        filemenu.Append(wx.ID_ABOUT, \"&About\",\" Information about this program\")\n",
    "        filemenu.AppendSeparator()\n",
    "        filemenu.Append(wx.ID_EXIT,\"E&xit\",\" Terminate the program\")\n",
    "\n",
    "        # Creating the menubar.\n",
    "        menuBar = wx.MenuBar()\n",
    "        menuBar.Append(filemenu,\"&File\") # Adding the \"filemenu\" to the MenuBar\n",
    "        self.SetMenuBar(menuBar)  # Adding the MenuBar to the Frame content.\n",
    "        self.Show(True)\n",
    "\n",
    "app = wx.App(False)\n",
    "frame = MainWindow(None, \"Sample editor\")\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 21,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python editor.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Event handling\n",
    "\n",
    "Reacting to events in wxPython is called event handling. An event is when \"something\" happens on your application (a button click, text input, mouse movement, etc). Much of GUI programming consists of responding to events. You bind an object to an event using the Bind() method:\n",
    "\n",
    "```python\n",
    "class MainWindow(wx.Frame):\n",
    "    def __init__(self, parent, title):\n",
    "        wx.Frame.__init__(self,parent, title=title, size=(200,100))\n",
    "        ...\n",
    "        menuItem = filemenu.Append(wx.ID_ABOUT, \"&About\",\" Information about this program\")\n",
    "        self.Bind(wx.EVT_MENU, self.OnAbout, menuItem)\n",
    "```\n",
    "\n",
    "This means that, from now on, when the user selects the \"About\" menu item, the method self.OnAbout will be executed. wx.EVT_MENU is the \"select menu item\" event. wxWidgets understands many other events (see the full list\n",
    "at https://wiki.wxpython.org/ListOfEvents). The self.OnAbout method has the general declaration:\n",
    "\n",
    "```python\n",
    "   def OnAbout(self, event):\n",
    "        ...\n",
    "```\n",
    "Here event is an instance of a subclass of wx.Event. For example, a button-click event - wx.EVT_BUTTON - is a subclass of wx.Event.\n",
    "\n",
    "The method is executed when the event occurs. By default, this method will handle the event and the event will stop after the callback finishes. However, you can \"skip\" an event with event.Skip(). This causes the event to go through the hierarchy of event handlers. For example:\n",
    "\n",
    "```python\n",
    "def OnButtonClick(self, event):\n",
    "    if (some_condition):\n",
    "        do_something()\n",
    "    else:\n",
    "        event.Skip()\n",
    "\n",
    "def OnEvent(self, event):\n",
    "    ...\n",
    "```\n",
    "When a button-click event occurs, the method OnButtonClick gets called. If some_condition is true, we do_something() otherwise we let the event be handled by the more general event handler. Now let's have a look at our application:\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 22,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting editor.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile editor.py\n",
    "#!/usr/bin/env python\n",
    "\n",
    "import os\n",
    "import wx\n",
    "\n",
    "\n",
    "class MainWindow(wx.Frame):\n",
    "    def __init__(self, parent, title):\n",
    "        wx.Frame.__init__(self, parent, title=title, size=(200,100))\n",
    "        self.control = wx.TextCtrl(self, style=wx.TE_MULTILINE)\n",
    "        self.CreateStatusBar() # A StatusBar in the bottom of the window\n",
    "\n",
    "        # Setting up the menu.\n",
    "        filemenu= wx.Menu()\n",
    "\n",
    "        # wx.ID_ABOUT and wx.ID_EXIT are standard ids provided by wxWidgets.\n",
    "        menuAbout = filemenu.Append(wx.ID_ABOUT, \"&About\",\" Information about this program\")\n",
    "        menuExit = filemenu.Append(wx.ID_EXIT,\"E&xit\",\" Terminate the program\")\n",
    "\n",
    "        # Creating the menubar.\n",
    "        menuBar = wx.MenuBar()\n",
    "        menuBar.Append(filemenu,\"&File\") # Adding the \"filemenu\" to the MenuBar\n",
    "        self.SetMenuBar(menuBar)  # Adding the MenuBar to the Frame content.\n",
    "\n",
    "        # Set events.\n",
    "        self.Bind(wx.EVT_MENU, self.OnAbout, menuAbout)\n",
    "        self.Bind(wx.EVT_MENU, self.OnExit, menuExit)\n",
    "\n",
    "        self.Show(True)\n",
    "\n",
    "    def OnAbout(self,e):\n",
    "        # A message dialog box with an OK button. wx.OK is a standard ID in wxWidgets.\n",
    "        dlg = wx.MessageDialog( self, \"A small text editor\", \"About Sample Editor\", wx.OK)\n",
    "        dlg.ShowModal() # Show it\n",
    "        dlg.Destroy() # finally destroy it when finished.\n",
    "\n",
    "    def OnExit(self,e):\n",
    "        self.Close(True)  # Close the frame.\n",
    "\n",
    "app = wx.App(False)\n",
    "frame = MainWindow(None, \"Sample editor\")\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 23,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python editor.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Dialogs\n",
    "\n",
    "Of course an editor is useless if it is not able to save or open documents. That's where Common dialogs come in. Common dialogs are those offered by the underlying platform so that your application will look exactly like a native application. Here is the implementation of the OnOpen method in MainWindow:\n",
    "\n",
    "```python\n",
    "    def OnOpen(self,e):\n",
    "        \"\"\" Open a file\"\"\"\n",
    "        self.dirname = ''\n",
    "        dlg = wx.FileDialog(self, \"Choose a file\", self.dirname, \"\", \"*.*\", wx.OPEN)\n",
    "        if dlg.ShowModal() == wx.ID_OK:\n",
    "            self.filename = dlg.GetFilename()\n",
    "            self.dirname = dlg.GetDirectory()\n",
    "            f = open(os.path.join(self.dirname, self.filename), 'r')\n",
    "            self.control.SetValue(f.read())\n",
    "            f.close()\n",
    "        dlg.Destroy()\n",
    "```\n",
    "\n",
    "Explanation:\n",
    "\n",
    "- First, we create the dialog by calling the appropriate Constructor.\n",
    "- Then, we call ShowModal. That opens the dialog - \"Modal\" means that the user cannot do anything on the application until he clicks OK or Cancel.\n",
    "- The return value of ShowModal is the Id of the button pressed. If the user pressed OK we read the file.\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 24,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting editor.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile editor.py\n",
    "#!/usr/bin/env python\n",
    "\n",
    "import os\n",
    "import wx\n",
    "\n",
    "\n",
    "class MainWindow(wx.Frame):\n",
    "    def __init__(self, parent, title):\n",
    "        wx.Frame.__init__(self, parent, title=title, size=(200,100))\n",
    "        self.control = wx.TextCtrl(self, style=wx.TE_MULTILINE)\n",
    "        self.CreateStatusBar() # A StatusBar in the bottom of the window\n",
    "\n",
    "        # Setting up the menu.\n",
    "        filemenu= wx.Menu()\n",
    "\n",
    "        # wx.ID_ABOUT and wx.ID_EXIT are standard ids provided by wxWidgets.\n",
    "        menuOpen = filemenu.Append(wx.ID_OPEN, \"&Open\",\n",
    "                                   \" Open text file\")\n",
    "        menuAbout = filemenu.Append(wx.ID_ABOUT, \"&About\",\" Information about this program\")\n",
    "        menuExit = filemenu.Append(wx.ID_EXIT,\"E&xit\",\" Terminate the program\")\n",
    "\n",
    "        # Creating the menubar.\n",
    "        menuBar = wx.MenuBar()\n",
    "        menuBar.Append(filemenu,\"&File\") # Adding the \"filemenu\" to the MenuBar\n",
    "        self.SetMenuBar(menuBar)  # Adding the MenuBar to the Frame content.\n",
    "\n",
    "        # Set events.\n",
    "        self.Bind(wx.EVT_MENU, self.OnOpen, menuOpen)\n",
    "        self.Bind(wx.EVT_MENU, self.OnAbout, menuAbout)\n",
    "        self.Bind(wx.EVT_MENU, self.OnExit, menuExit)\n",
    "\n",
    "        self.Show(True)\n",
    "\n",
    "    def OnAbout(self,e):\n",
    "        # A message dialog box with an OK button. wx.OK is a standard ID in wxWidgets.\n",
    "        dlg = wx.MessageDialog( self, \"A small text editor\", \"About Sample Editor\", wx.OK)\n",
    "        dlg.ShowModal() # Show it\n",
    "        dlg.Destroy() # finally destroy it when finished.\n",
    "\n",
    "    def OnExit(self,e):\n",
    "        self.Close(True)  # Close the frame.\n",
    "        \n",
    "        \n",
    "    def OnOpen(self,e):\n",
    "        \"\"\" Open a file\"\"\"\n",
    "        self.dirname = ''\n",
    "        dlg = wx.FileDialog(self, \"Choose a file\", self.dirname,\n",
    "                            \"\", \"*.*\", wx.OPEN)\n",
    "        if dlg.ShowModal() == wx.ID_OK:\n",
    "            self.filename = dlg.GetFilename()\n",
    "            self.dirname = dlg.GetDirectory()\n",
    "            f = open(os.path.join(self.dirname, self.filename), 'r')\n",
    "            self.control.SetValue(f.read())\n",
    "            f.close()\n",
    "        dlg.Destroy()        \n",
    "\n",
    "app = wx.App(False)\n",
    "frame = MainWindow(None, \"Sample editor\")\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 25,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python editor.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Working with Windows\n",
    "\n",
    "In this section, we are going to present the way wxPython deals with windows and their contents, including building input forms and using various widgets/controls. We are going to build a small application that calculates the price of a quote. \n",
    "\n",
    "### Laying out Visual Elements\n",
    "\n",
    "Within a frame, you'll use a number of wxWindow sub-classes to flesh out the frame's contents. Here are some of the more common elements you might want to put in your frame:\n",
    "- wx.MenuBar, which puts a menu bar along the top of your frame.\n",
    "- wx.StatusBar, which sets up an area along the bottom of your frame for displaying status messages, etc.\n",
    "- wx.ToolBar, which puts a toolbar in your frame.\n",
    "- Sub-classes of wx.Control. These are objects which represent user interface widgets (ie, visual elements which display data and/or process user input). Common examples of wx.Control objects include wx.Button, wx.StaticText, wx.TextCtrl and wx.ComboBox.\n",
    "- wx.Panel, which is a container to hold your various wx.Control objects. Putting your wx.Control objects inside a wx.Panel means that the user can tab from one UI widget to the next.\n",
    "\n",
    "All visual elements (wxWindow objects and their subclasses) can hold sub-elements. Thus, for example, a wx.Frame might hold a number of wx.Panel objects, which in turn hold a number of wx.Button, wx.StaticText and wx.TextCtrl objects, giving you an entire hierarchy of elements: ￼ Note that this merely describes the way that certain visual elements are interrelated -- not how they are visually laid out within the frame. To handle the layout of elements within a frame, there are several options.\n",
    "\n",
    "We are going to show the usage of wxSizers.\n",
    "\n",
    "A sizer (that is, one of the wx.Sizer sub-classes) can be used to handle the visual arrangement of elements within a window or frame. Sizers can:\n",
    "- Calculate an appropriate size for each visual element.\n",
    "- Position the elements according to certain rules.\n",
    "- Dynamically resize and/or reposition elements when a frame is resized.\n",
    "\n",
    "Some of the more common types of sizers include:\n",
    "- wx.BoxSizer, which arranges visual elements in a line going either horizontally or vertically.\n",
    "- wx.GridSizer, which lays visual elements out into a grid-like structure.\n",
    "- wx.FlexGridSizer, which is similar to a wx.GridSizer except that it allow for more flexibility in laying out visual elements.\n",
    "\n",
    "A sizer is given a list of wx.Window objects to size, either by calling sizer.Add(window, options...), or by calling sizer.AddMany(...). A sizer will only work on those elements which it has been given. Sizers can be nested. That is, you can add one sizer to another sizer, for example to have two rows of buttons (each laid out by a horizontal wx.BoxSizer) contained within another wx.BoxSizer which places the rows of buttons one above the other.\n",
    "\n",
    "Note: Notice that the above example does not lay out the six buttons into two rows of three columns each -- to do that, you should use a wxGridSizer.\n",
    "In the following example we use two nested sizers, the main one with vertical layout and the embedded one with horizontal layout:\n",
    "\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 26,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting sizer_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile sizer_demo.py\n",
    "#!/usr/bin/env python\n",
    "\n",
    "import wx\n",
    "import os\n",
    "\n",
    "class MainWindow(wx.Frame):\n",
    "    def __init__(self, parent, title):\n",
    "        self.dirname=''\n",
    "\n",
    "        # A \"-1\" in the size parameter instructs wxWidgets to use the default size.\n",
    "        # In this case, we select 200px width and the default height.\n",
    "        wx.Frame.__init__(self, parent, title=title, size=(200,-1))\n",
    "        self.control = wx.TextCtrl(self, style=wx.TE_MULTILINE)\n",
    "        self.CreateStatusBar() # A Statusbar in the bottom of the window\n",
    "\n",
    "        # Setting up the menu.\n",
    "        filemenu= wx.Menu()\n",
    "        menuOpen = filemenu.Append(wx.ID_OPEN, \"&Open\",\" Open a file to edit\")\n",
    "        menuAbout= filemenu.Append(wx.ID_ABOUT, \"&About\",\" Information about this program\")\n",
    "        menuExit = filemenu.Append(wx.ID_EXIT,\"E&xit\",\" Terminate the program\")\n",
    "\n",
    "        # Creating the menubar.\n",
    "        menuBar = wx.MenuBar()\n",
    "        menuBar.Append(filemenu,\"&File\") # Adding the \"filemenu\" to the MenuBar\n",
    "        self.SetMenuBar(menuBar)  # Adding the MenuBar to the Frame content.\n",
    "\n",
    "        # Events.\n",
    "        self.Bind(wx.EVT_MENU, self.OnOpen, menuOpen)\n",
    "        self.Bind(wx.EVT_MENU, self.OnExit, menuExit)\n",
    "        self.Bind(wx.EVT_MENU, self.OnAbout, menuAbout)\n",
    "\n",
    "        self.sizer2 = wx.BoxSizer(wx.HORIZONTAL)\n",
    "        self.buttons = []\n",
    "        for i in range(0, 6):\n",
    "            self.buttons.append(wx.Button(self, -1, \"Button &\"+str(i)))\n",
    "            self.sizer2.Add(self.buttons[i], 1, wx.EXPAND)\n",
    "\n",
    "        # Use some sizers to see layout options\n",
    "        self.sizer = wx.BoxSizer(wx.VERTICAL)\n",
    "        self.sizer.Add(self.control, 1, wx.EXPAND)\n",
    "        self.sizer.Add(self.sizer2, 0, wx.EXPAND)\n",
    "\n",
    "        #Layout sizers\n",
    "        self.SetSizer(self.sizer)\n",
    "        self.SetAutoLayout(1)\n",
    "        self.sizer.Fit(self)\n",
    "        self.Show()\n",
    "\n",
    "    def OnAbout(self,e):\n",
    "        # Create a message dialog box\n",
    "        dlg = wx.MessageDialog(self, \" A sample editor \\n in wxPython\", \"About Sample Editor\", wx.OK)\n",
    "        dlg.ShowModal() # Shows it\n",
    "        dlg.Destroy() # finally destroy it when finished.\n",
    "\n",
    "    def OnExit(self,e):\n",
    "        self.Close(True)  # Close the frame.\n",
    "\n",
    "    def OnOpen(self,e):\n",
    "        \"\"\" Open a file\"\"\"\n",
    "        dlg = wx.FileDialog(self, \"Choose a file\", self.dirname, \"\", \"*.*\", wx.OPEN)\n",
    "        if dlg.ShowModal() == wx.ID_OK:\n",
    "            self.filename = dlg.GetFilename()\n",
    "            self.dirname = dlg.GetDirectory()\n",
    "            f = open(os.path.join(self.dirname, self.filename), 'r')\n",
    "            self.control.SetValue(f.read())\n",
    "            f.close()\n",
    "        dlg.Destroy()\n",
    "\n",
    "app = wx.App(False)\n",
    "frame = MainWindow(None, \"Sample editor\")\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 27,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python sizer_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "The sizer.Add method has three arguments. The first one specifies the control to include in the sizer. The second one is a weight factor which means that this control will be sized in proportion to other ones. For example, if you had three edit controls and you wanted them to have the proportions 3:2:1 then you would specify these factors as arguments when adding the controls. 0 means that this control or sizer will not grow. The third argument is normally wx.GROW (same as wx.EXPAND) which means the control will be resized when necessary. If you use wx.SHAPED instead, the controls aspect ratio will remain the same.\n",
    "\n",
    "If the second parameter is 0, i.e. the control will not be resized, the third parameter may indicate if the control should be centered horizontally and/or vertically by using wx.ALIGN_CENTER_HORIZONTAL, wx.ALIGN_CENTER_VERTICAL, or wx.ALIGN_CENTER (for both) instead of wx.GROW or wx.SHAPED as that third parameter.\n",
    "\n",
    "You can alternatively specify combinations of wx.ALIGN_LEFT, wx.ALIGN_TOP, wx.ALIGN_RIGHT, and wx.ALIGN_BOTTOM. The default behavior is equivalent to wx.ALIGN_LEFT | wx.ALIGN_TOP.\n",
    "\n",
    "One potentially confusing aspect of the wx.Sizer and its sub-classes is the distinction between a sizer and a parent window. When you create objects to go inside a sizer, you do not make the sizer the object's parent window. A sizer is a way of laying out windows, it is not a window in itself. In the above example, all six buttons would be created with the parent window being the frame or window which encloses the buttons -- not the sizer. If you try to create a visual element and pass the sizer as the parent window, your program will crash.\n",
    "\n",
    "Once you have set up your visual elements and added them to a sizer (or to a nested set of sizers), the next step is to tell your frame or window to use the sizer. You do this in three steps:\n",
    "\n",
    "```python\n",
    "window.SetSizer(sizer)\n",
    "window.SetAutoLayout(True)\n",
    "sizer.Fit(window)\n",
    "```\n",
    "\n",
    "The SetSizer() call tells your window (or frame) which sizer to use. The call to SetAutoLayout() tells your window to use the sizer to position and size your components. And finally, the call to sizer.Fit() tells the sizer to calculate the initial size and position for all its elements. If you are using sizers, this is the normal process you would go through to set up your window or frame's contents before it is displayed for the first time.\n"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Controls\n",
    "\n",
    "You will find a complete list of the numerous Controls that exist in wxPython in the demo and help, but here we are going to present those most frequently used:\n",
    "\n",
    "- wxButton The most basic Control: A button showing a text that you can click. For example, here is a \"Clear\" button (e.g. to clear a text):\n",
    "\n",
    "```python\n",
    "   clearButton = wx.Button(self, wx.ID_CLEAR, \"Clear\")\n",
    "   self.Bind(wx.EVT_BUTTON, self.OnClear, clearButton)\n",
    "```\n",
    "\n",
    "- wxTextCtrl This control let the user input text. It generates two main events. EVT_TEXT is called whenever the text changes. EVT_CHAR is called whenever a key has been pressed.\n",
    "\n",
    "```python\n",
    "    textField = wx.TextCtrl(self)\n",
    "    self.Bind(wx.EVT_TEXT, self.OnChange, textField)\n",
    "    self.Bind(wx.EVT_CHAR, self.OnKeyPress, textField)\n",
    "```\n",
    "\n",
    "For example: If the user presses the \"Clear\" button and that clears the text field, that will generate an EVT_TEXT event, but not an EVT_CHAR event.\n",
    "\n",
    "- wxComboBox A combobox is very similar to wxTextCtrl but in addition to the events generated by wxTextCtrl, wxComboBox has the EVT_COMBOBOX event.\n",
    "- wxCheckBox The checkbox is a control that gives the user true/false choice.\n",
    "- wxRadioBox The radiobox lets the user choose from a list of options.\n",
    "\n",
    "Let's see an example by defining a more complex panel:\n",
    "\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting example.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile example.py\n",
    "import wx\n",
    "class ExamplePanel(wx.Panel):\n",
    "    def __init__(self, parent):\n",
    "        wx.Panel.__init__(self, parent)\n",
    "        self.quote = wx.StaticText(self, label=\"Your quote :\", \n",
    "                                   pos=(20, 30))\n",
    "\n",
    "        # A multiline TextCtrl - This is here to show how the events work in this program, don't pay too much attention to it\n",
    "        self.logger = wx.TextCtrl(self, pos=(300,20), size=(200,300), \n",
    "                                  style=wx.TE_MULTILINE | wx.TE_READONLY)\n",
    "\n",
    "        # A button\n",
    "        self.button =wx.Button(self, label=\"Save\", pos=(200, 325))\n",
    "        self.Bind(wx.EVT_BUTTON, self.OnClick,self.button)\n",
    "\n",
    "        # the edit control - one line version.\n",
    "        self.lblname = wx.StaticText(self, label=\"Your name :\",\n",
    "                                     pos=(20,60))\n",
    "        self.editname = wx.TextCtrl(self, value=\"Enter here your name\",\n",
    "                                    pos=(150, 60), size=(140,-1))\n",
    "        self.Bind(wx.EVT_TEXT, self.EvtText, self.editname)\n",
    "        self.Bind(wx.EVT_CHAR, self.EvtChar, self.editname)\n",
    "\n",
    "        # the combobox Control\n",
    "        self.sampleList = ['friends', 'advertising', 'web search', \n",
    "                           'Yellow Pages']\n",
    "        self.lblhear = wx.StaticText(self, \n",
    "                                     label=\"How did you hear from us ?\",\n",
    "                                     pos=(20, 90))\n",
    "        self.edithear = wx.ComboBox(self, pos=(150, 90), size=(95, -1),\n",
    "                                    choices=self.sampleList, \n",
    "                                    style=wx.CB_DROPDOWN)\n",
    "        self.Bind(wx.EVT_COMBOBOX, self.EvtComboBox, self.edithear)\n",
    "        self.Bind(wx.EVT_TEXT, self.EvtText,self.edithear)\n",
    "\n",
    "        # Checkbox\n",
    "        self.insure = wx.CheckBox(self, \n",
    "                                  label=\"Do you want Insured Shipment ?\",\n",
    "                                  pos=(20,180))\n",
    "        self.Bind(wx.EVT_CHECKBOX, self.EvtCheckBox, self.insure)\n",
    "\n",
    "        # Radio Boxes\n",
    "        radioList = ['blue', 'red', 'yellow', 'orange', 'green',\n",
    "                     'purple', 'navy blue', 'black', 'gray']\n",
    "        rb = wx.RadioBox(self, label=\"What color would you like ?\",\n",
    "                         pos=(20, 210), choices=radioList,\n",
    "                         majorDimension=3,\n",
    "                         style=wx.RA_SPECIFY_COLS)\n",
    "        self.Bind(wx.EVT_RADIOBOX, self.EvtRadioBox, rb)\n",
    "\n",
    "    def EvtRadioBox(self, event):\n",
    "        self.logger.AppendText('EvtRadioBox: %d\\n' % event.GetInt())\n",
    "    def EvtComboBox(self, event):\n",
    "        self.logger.AppendText('EvtComboBox: %s\\n' % event.GetString())\n",
    "    def OnClick(self,event):\n",
    "        self.logger.AppendText(\" Click on object with Id %d\\n\" %event.GetId())\n",
    "    def EvtText(self, event):\n",
    "        self.logger.AppendText('EvtText: %s\\n' % event.GetString())\n",
    "    def EvtChar(self, event):\n",
    "        self.logger.AppendText('EvtChar: %d\\n' % event.GetKeyCode())\n",
    "        event.Skip()\n",
    "    def EvtCheckBox(self, event):\n",
    "        self.logger.AppendText('EvtCheckBox: %d\\n' % event.Checked())\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting control_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile control_demo.py\n",
    "import wx\n",
    "from example import ExamplePanel\n",
    "\n",
    "app = wx.App(False)\n",
    "frame = wx.Frame(None,size=(500,400))\n",
    "panel = ExamplePanel(frame)\n",
    "frame.Show()\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python control_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## The notebook\n",
    "\n",
    "Sometimes, a form grows too big to fit on a single page. The\n",
    "wx.Notebook is used in that kind of case : It allows the user to navigate quickly between a small amount of pages by clicking on associated tabs. We implement this by putting the wx.Notebook instead of our form into the main Frame and then add our panel into the notebook by using method AddPage.\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 31,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting notebook_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile notebook_demo.py\n",
    "import wx\n",
    "from example import ExamplePanel\n",
    "\n",
    "app = wx.App(False)\n",
    "frame = wx.Frame(None, title=\"Demo with Notebook\",size=(500,400))\n",
    "nb = wx.Notebook(frame)\n",
    "\n",
    "nb.AddPage(ExamplePanel(nb), \"Absolute Positioning\")\n",
    "nb.AddPage(ExamplePanel(nb), \"Page Two\")\n",
    "nb.AddPage(ExamplePanel(nb), \"Page Three\")\n",
    "frame.Show()\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 32,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python notebook_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Improving the layout - using Sizers\n",
    "\n",
    "Using absolute positioning is often not very satisfying: The result is ugly if the windows are not (for one reason or another) the right size. WxPython has very rich vocabulary of objects to lay out controls.\n",
    "- wx.BoxSizer is the most common and simple layout object but it permits a vast range of possibilities. Its role is roughly to arrange a set of controls in a line or in a row and rearrange them when needed (i.e. when the global size is changed).\n",
    "- wx.GridSizer and wx.FlexGridSizer are two very important layout tools. They arrange the controls in a tabular layout.\n",
    "\n",
    "Here is the sample above re-written to use sizers:"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 33,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting example.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile example.py\n",
    "import wx\n",
    "class ExamplePanel(wx.Panel):\n",
    "    def __init__(self, parent):\n",
    "        wx.Panel.__init__(self, parent)\n",
    "\n",
    "        # create some sizers\n",
    "        mainSizer = wx.BoxSizer(wx.VERTICAL)\n",
    "        grid = wx.GridBagSizer(hgap=5, vgap=5)\n",
    "        hSizer = wx.BoxSizer(wx.HORIZONTAL)\n",
    "\n",
    "        self.quote = wx.StaticText(self, label=\"Your quote: \")\n",
    "        grid.Add(self.quote, pos=(0,0))\n",
    "\n",
    "        # A multiline TextCtrl - This is here to show how the events work in this program, don't pay too much attention to it\n",
    "        self.logger = wx.TextCtrl(self, size=(200,300), style=wx.TE_MULTILINE | wx.TE_READONLY)\n",
    "\n",
    "        # A button\n",
    "        self.button =wx.Button(self, label=\"Save\")\n",
    "        self.Bind(wx.EVT_BUTTON, self.OnClick,self.button)\n",
    "\n",
    "        # the edit control - one line version.\n",
    "        self.lblname = wx.StaticText(self, label=\"Your name :\")\n",
    "        grid.Add(self.lblname, pos=(1,0))\n",
    "        self.editname = wx.TextCtrl(self, value=\"Enter here your name\", size=(140,-1))\n",
    "        grid.Add(self.editname, pos=(1,1))\n",
    "        self.Bind(wx.EVT_TEXT, self.EvtText, self.editname)\n",
    "        self.Bind(wx.EVT_CHAR, self.EvtChar, self.editname)\n",
    "\n",
    "        # the combobox Control\n",
    "        self.sampleList = ['friends', 'advertising', 'web search', 'Yellow Pages']\n",
    "        self.lblhear = wx.StaticText(self, label=\"How did you hear from us ?\")\n",
    "        grid.Add(self.lblhear, pos=(3,0))\n",
    "        self.edithear = wx.ComboBox(self, size=(95, -1), \n",
    "                                    choices=self.sampleList, \n",
    "                                    style=wx.CB_DROPDOWN)\n",
    "        grid.Add(self.edithear, pos=(3,1))\n",
    "        self.Bind(wx.EVT_COMBOBOX, self.EvtComboBox, self.edithear)\n",
    "        self.Bind(wx.EVT_TEXT, self.EvtText,self.edithear)\n",
    "\n",
    "        # add a spacer to the sizer\n",
    "        grid.Add((10, 40), pos=(2,0))\n",
    "\n",
    "        # Checkbox\n",
    "        self.insure = wx.CheckBox(self, label=\"Do you want Insured Shipment ?\")\n",
    "        grid.Add(self.insure, pos=(4,0), span=(1,2), \n",
    "                 flag=wx.BOTTOM, border=5)\n",
    "        self.Bind(wx.EVT_CHECKBOX, self.EvtCheckBox, self.insure)\n",
    "\n",
    "        # Radio Boxes\n",
    "        radioList = ['blue', 'red', 'yellow', 'orange', 'green', 'purple', 'navy blue', 'black', 'gray']\n",
    "        rb = wx.RadioBox(self, label=\"What color would you like ?\", pos=(20, 210), choices=radioList,  majorDimension=3,\n",
    "                         style=wx.RA_SPECIFY_COLS)\n",
    "        grid.Add(rb, pos=(5,0), span=(1,2))\n",
    "        self.Bind(wx.EVT_RADIOBOX, self.EvtRadioBox, rb)\n",
    "\n",
    "        hSizer.Add(grid, 0, wx.ALL, 5)\n",
    "        hSizer.Add(self.logger)\n",
    "        mainSizer.Add(hSizer, 0, wx.ALL, 5)\n",
    "        mainSizer.Add(self.button, 0, wx.CENTER)\n",
    "        self.SetSizerAndFit(mainSizer)\n",
    "        \n",
    "\n",
    "    def EvtRadioBox(self, event):\n",
    "        self.logger.AppendText('EvtRadioBox: %d\\n' % event.GetInt())\n",
    "    def EvtComboBox(self, event):\n",
    "        self.logger.AppendText('EvtComboBox: %s\\n' % event.GetString())\n",
    "    def OnClick(self,event):\n",
    "        self.logger.AppendText(\" Click on object with Id %d\\n\" %event.GetId())\n",
    "    def EvtText(self, event):\n",
    "        self.logger.AppendText('EvtText: %s\\n' % event.GetString())\n",
    "    def EvtChar(self, event):\n",
    "        self.logger.AppendText('EvtChar: %d\\n' % event.GetKeyCode())\n",
    "        event.Skip()\n",
    "    def EvtCheckBox(self, event):\n",
    "        self.logger.AppendText('EvtCheckBox: %d\\n' % event.Checked())        "
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 34,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting control_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile control_demo.py\n",
    "import wx\n",
    "from example import ExamplePanel\n",
    "\n",
    "app = wx.App(False)\n",
    "frame = wx.Frame(None,size=(500,400))\n",
    "panel = ExamplePanel(frame)\n",
    "frame.Show()\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 35,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python control_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## wxpython and matplotlib\n",
    "\n",
    "To use matplotlib to plot or show images in a panel, we rely on the matplotlib library.\n",
    "\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 36,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting mpl_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile mpl_demo.py\n",
    "#!/usr/bin/env python\n",
    "#import wxversion\n",
    "#wxversion.ensureMinimal('2.8')\n",
    "\n",
    "from numpy import arange, sin, pi\n",
    "from matplotlib.backends.backend_wxagg import FigureCanvasWxAgg as \n",
    "FigureCanvas\n",
    "from matplotlib.figure import Figure\n",
    "import wx\n",
    "\n",
    "class CanvasFrame(wx.Frame):\n",
    "    def __init__(self):\n",
    "        wx.Frame.__init__(self, None, -1,\n",
    "                          'CanvasFrame', size=(550, 350))\n",
    "\n",
    "        self.figure = Figure()\n",
    "        self.axes = self.figure.add_subplot(111)\n",
    "        t = arange(0.0, 3.0, 0.01)\n",
    "        s = sin(2 * pi * t)\n",
    "\n",
    "        self.axes.plot(t, s)\n",
    "        self.canvas = FigureCanvas(self, -1, self.figure)\n",
    "\n",
    "        self.sizer = wx.BoxSizer(wx.VERTICAL)\n",
    "        self.sizer.Add(self.canvas, 1, wx.LEFT | wx.TOP | wx.EXPAND)\n",
    "        self.SetSizer(self.sizer)\n",
    "        self.Fit()\n",
    "\n",
    "class App(wx.App):\n",
    "    def OnInit(self):\n",
    "        'Create the main window and insert the custom frame'\n",
    "        frame = CanvasFrame()\n",
    "        frame.Show(True)\n",
    "        return True\n",
    "\n",
    "app = App(0)\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 37,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python mpl_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "Let's see how this works.\n",
    "\n",
    "```python\n",
    "self.figure = Figure()\n",
    "```\n",
    "initializes the top level container for all plot elements. Everything in the\n",
    "plot goes within this object, just like everything in our wx application goes into\n",
    "our frame!\n",
    "\n",
    "```python\n",
    "self.axes = self.figure.add_subplot(111)\n",
    "```\n",
    "\n",
    "Our figure can contain many subplots, but here we will only make\n",
    "one. add_subplot() is what does this for us. The 111 is a grid\n",
    "parameter, encoded as an integer. It means 1x1 grid, first subplot. If\n",
    "you want two subplots, the number would be 2x1; the first subplot\n",
    "would be 211, and the second subplot would be 212.\n",
    "\n",
    "```python\n",
    "self.axes.plot(t, s)\n",
    "```\n",
    "t and s are what I chose for axis values.  \n",
    "They are arrays that contain values that link with each other to form our plot. These arrays\n",
    "must have the same size! \n",
    "This command creates and plots the t and s arrays. Since self.axes was defined as a\n",
    "subplot of self.figure, this also plays a role in generating\n",
    "self.figure, the container of our subplot. \n",
    "\n",
    "```python\n",
    "self.canvas = FigureCanvas(self, -1, self.figure)\n",
    "```\n",
    "Finally, we have our canvas object, which `paints` our object onto the\n",
    "screen. Simply pass in our figure and the FigureCanvas tool does the\n",
    "rest. "
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Navigation toolbar\n",
    "\n",
    "A useful toolbar is the navigation toolbar defined in matplotlib which allows one to explore the image.\n",
    "Let's add to our previous example this toolbar."
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting mpl_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile mpl_demo.py\n",
    "#!/usr/bin/env python\n",
    "import wxversion\n",
    "wxversion.ensureMinimal('2.8')\n",
    "\n",
    "from numpy import arange, sin, pi\n",
    "from matplotlib.backends.backend_wxagg import \\\n",
    "    FigureCanvasWxAgg as FigureCanvas, \\\n",
    "    NavigationToolbar2WxAgg as NavigationToolbar\n",
    "from matplotlib.figure import Figure\n",
    "import wx\n",
    "\n",
    "class CanvasFrame(wx.Frame):\n",
    "    def __init__(self):\n",
    "        wx.Frame.__init__(self, None, -1,\n",
    "                          'CanvasFrame', size=(550, 350))\n",
    "\n",
    "        self.figure = Figure()\n",
    "        self.axes = self.figure.add_subplot(111)\n",
    "        t = arange(0.0, 3.0, 0.01)\n",
    "        s = sin(2 * pi * t)\n",
    "\n",
    "        self.axes.plot(t, s)\n",
    "        self.canvas = FigureCanvas(self, -1, self.figure)\n",
    "\n",
    "        self.sizer = wx.BoxSizer(wx.VERTICAL)\n",
    "        self.sizer.Add(self.canvas, 1, wx.LEFT | wx.TOP | wx.EXPAND)\n",
    "        self.SetSizer(self.sizer)\n",
    "        self.Fit()\n",
    "        self.add_toolbar()  #add toolbar\n",
    "\n",
    "    def add_toolbar(self):\n",
    "        self.toolbar = NavigationToolbar(self.canvas)\n",
    "        self.toolbar.Realize()\n",
    "        # By adding toolbar in sizer, we are able to put it at the bottom\n",
    "        # of the frame - so appearance is closer to GTK version.\n",
    "        self.sizer.Add(self.toolbar, 0, wx.LEFT | wx.EXPAND)\n",
    "        # update the axes menu on the toolbar\n",
    "        self.toolbar.update()\n",
    "\n",
    "class App(wx.App):\n",
    "    def OnInit(self):\n",
    "        'Create the main window and insert the custom frame'\n",
    "        frame = CanvasFrame()\n",
    "        frame.Show(True)\n",
    "        return True\n",
    "\n",
    "app = App(0)\n",
    "app.MainLoop()        "
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python mpl_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "It is possible to use this navigation toolbar as a starting point to add more buttons and capabilities.\n",
    "This is another example from the matplotlib demo library.\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 40,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting mpl_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile mpl_demo.py\n",
    "#!/usr/bin/env python\n",
    "import wxversion\n",
    "wxversion.ensureMinimal('2.8')\n",
    "\n",
    "from numpy import arange, sin, pi\n",
    "from matplotlib.backends.backend_wxagg import FigureCanvasWxAgg as FigureCanvas\n",
    "from matplotlib.backends.backend_wxagg import NavigationToolbar2WxAgg\n",
    "from matplotlib.backends.backend_wx import _load_bitmap\n",
    "from matplotlib.figure import Figure\n",
    "from numpy.random import rand\n",
    "import wx\n",
    "\n",
    "\n",
    "class MyNavigationToolbar(NavigationToolbar2WxAgg):\n",
    "    \"\"\"\n",
    "    Extend the default wx toolbar with your own event handlers\n",
    "    \"\"\"\n",
    "    ON_CUSTOM = wx.NewId()\n",
    "\n",
    "    def __init__(self, canvas, cankill):\n",
    "        NavigationToolbar2WxAgg.__init__(self, canvas)\n",
    "\n",
    "        # for simplicity I'm going to reuse a bitmap from wx, you'll\n",
    "        # probably want to add your own.\n",
    "        if 'phoenix' in wx.PlatformInfo:\n",
    "            self.AddTool(self.ON_CUSTOM, 'Click me',\n",
    "                         _load_bitmap('stock_left.xpm'),\n",
    "                         'Activate custom contol')\n",
    "            self.Bind(wx.EVT_TOOL, self._on_custom, id=self.ON_CUSTOM)\n",
    "        else:\n",
    "            self.AddSimpleTool(self.ON_CUSTOM, _load_bitmap('stock_left.xpm'),\n",
    "                               'Click me', 'Activate custom contol')\n",
    "            self.Bind(wx.EVT_TOOL, self._on_custom, id=self.ON_CUSTOM)\n",
    "\n",
    "    def _on_custom(self, evt):\n",
    "        # add some text to the axes in a random location in axes (0,1)\n",
    "        # coords) with a random color\n",
    "\n",
    "        # get the axes\n",
    "        ax = self.canvas.figure.axes[0]\n",
    "\n",
    "        # generate a random location can color\n",
    "        x, y = tuple(rand(2))\n",
    "        rgb = tuple(rand(3))\n",
    "\n",
    "        # add the text and draw\n",
    "        ax.text(x, y, 'You clicked me',\n",
    "                transform=ax.transAxes,\n",
    "                color=rgb)\n",
    "        self.canvas.draw()\n",
    "        evt.Skip()\n",
    "\n",
    "\n",
    "class CanvasFrame(wx.Frame):\n",
    "    def __init__(self):\n",
    "        wx.Frame.__init__(self, None, -1,\n",
    "                          'CanvasFrame', size=(550, 350))\n",
    "\n",
    "        self.figure = Figure(figsize=(5, 4), dpi=100)\n",
    "        self.axes = self.figure.add_subplot(111)\n",
    "        t = arange(0.0, 3.0, 0.01)\n",
    "        s = sin(2 * pi * t)\n",
    "\n",
    "        self.axes.plot(t, s)\n",
    "\n",
    "        self.canvas = FigureCanvas(self, -1, self.figure)\n",
    "\n",
    "        self.sizer = wx.BoxSizer(wx.VERTICAL)\n",
    "        self.sizer.Add(self.canvas, 1, wx.TOP | wx.LEFT | wx.EXPAND)\n",
    "        # Capture the paint message\n",
    "        self.Bind(wx.EVT_PAINT, self.OnPaint)\n",
    "\n",
    "        self.toolbar = MyNavigationToolbar(self.canvas, True)\n",
    "        self.toolbar.Realize()\n",
    "        # By adding toolbar in sizer, we are able to put it at the bottom\n",
    "        # of the frame - so appearance is closer to GTK version.\n",
    "        self.sizer.Add(self.toolbar, 0, wx.LEFT | wx.EXPAND)\n",
    "\n",
    "        # update the axes menu on the toolbar\n",
    "        self.toolbar.update()\n",
    "        self.SetSizer(self.sizer)\n",
    "        self.Fit()\n",
    "\n",
    "    def OnPaint(self, event):\n",
    "        self.canvas.draw()\n",
    "        event.Skip()\n",
    "\n",
    "\n",
    "class App(wx.App):\n",
    "    def OnInit(self):\n",
    "        'Create the main window and insert the custom frame'\n",
    "        frame = CanvasFrame()\n",
    "        frame.Show(True)\n",
    "\n",
    "        return True\n",
    "\n",
    "app = App(0)\n",
    "app.MainLoop()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 41,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "GLib-GIO-Message: Using the 'memory' GSettings backend.  Your settings will not be saved or shared with other applications.\r\n"
     ]
    }
   ],
   "source": [
    "!python mpl_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Matplotlib examples\n",
    "\n",
    "We give here a few more examples to show the various capabilities.\n",
    "\n",
    "\n",
    "## Buttons\n",
    "\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting buttons_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile buttons_demo.py\n",
    "#!/usr/bin/env python\n",
    "import numpy as np\n",
    "import matplotlib.pyplot as plt\n",
    "from matplotlib.widgets import Button\n",
    "\n",
    "freqs = np.arange(2, 20, 3)\n",
    "\n",
    "fig, ax = plt.subplots()\n",
    "plt.subplots_adjust(bottom=0.2)\n",
    "t = np.arange(0.0, 1.0, 0.001)\n",
    "s = np.sin(2*np.pi*freqs[0]*t)\n",
    "l, = plt.plot(t, s, lw=2)\n",
    "\n",
    "\n",
    "class Index(object):\n",
    "    ind = 0\n",
    "\n",
    "    def next(self, event):\n",
    "        self.ind += 1\n",
    "        i = self.ind % len(freqs)\n",
    "        ydata = np.sin(2*np.pi*freqs[i]*t)\n",
    "        l.set_ydata(ydata)\n",
    "        plt.draw()\n",
    "\n",
    "    def prev(self, event):\n",
    "        self.ind -= 1\n",
    "        i = self.ind % len(freqs)\n",
    "        ydata = np.sin(2*np.pi*freqs[i]*t)\n",
    "        l.set_ydata(ydata)\n",
    "        plt.draw()\n",
    "\n",
    "callback = Index()\n",
    "axprev = plt.axes([0.7, 0.05, 0.1, 0.075])\n",
    "axnext = plt.axes([0.81, 0.05, 0.1, 0.075])\n",
    "bnext = Button(axnext, 'Next')\n",
    "bnext.on_clicked(callback.next)\n",
    "bprev = Button(axprev, 'Previous')\n",
    "bprev.on_clicked(callback.prev)\n",
    "\n",
    "plt.show()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {
    "collapsed": false
   },
   "outputs": [],
   "source": [
    "!python buttons_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Check Buttons"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 44,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting checkbuttons_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile checkbuttons_demo.py\n",
    "#!/usr/bin/env python\n",
    "import numpy as np\n",
    "import matplotlib.pyplot as plt\n",
    "from matplotlib.widgets import CheckButtons\n",
    "\n",
    "t = np.arange(0.0, 2.0, 0.01)\n",
    "s0 = np.sin(2*np.pi*t)\n",
    "s1 = np.sin(4*np.pi*t)\n",
    "s2 = np.sin(6*np.pi*t)\n",
    "\n",
    "fig, ax = plt.subplots()\n",
    "l0, = ax.plot(t, s0, visible=False, lw=2)\n",
    "l1, = ax.plot(t, s1, lw=2)\n",
    "l2, = ax.plot(t, s2, lw=2)\n",
    "plt.subplots_adjust(left=0.2)\n",
    "\n",
    "rax = plt.axes([0.05, 0.4, 0.1, 0.15])\n",
    "check = CheckButtons(rax, ('2 Hz', '4 Hz', '6 Hz'), (False, True, True))\n",
    "\n",
    "\n",
    "def func(label):\n",
    "    if label == '2 Hz':\n",
    "        l0.set_visible(not l0.get_visible())\n",
    "    elif label == '4 Hz':\n",
    "        l1.set_visible(not l1.get_visible())\n",
    "    elif label == '6 Hz':\n",
    "        l2.set_visible(not l2.get_visible())\n",
    "    plt.draw()\n",
    "check.on_clicked(func)\n",
    "\n",
    "plt.show()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 45,
   "metadata": {
    "collapsed": false
   },
   "outputs": [],
   "source": [
    "!python checkbuttons_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Cursor"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 46,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting cursor_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile cursor_demo.py\n",
    "#!/usr/bin/env python\n",
    "\n",
    "from matplotlib.widgets import Cursor\n",
    "import numpy as np\n",
    "import matplotlib.pyplot as plt\n",
    "\n",
    "\n",
    "fig = plt.figure(figsize=(8, 6))\n",
    "ax = fig.add_subplot(111, axisbg='#FFFFCC')\n",
    "\n",
    "x, y = 4*(np.random.rand(2, 100) - .5)\n",
    "ax.plot(x, y, 'o')\n",
    "ax.set_xlim(-2, 2)\n",
    "ax.set_ylim(-2, 2)\n",
    "\n",
    "# set useblit = True on gtkagg for enhanced performance\n",
    "cursor = Cursor(ax, useblit=True, color='red', linewidth=2)\n",
    "\n",
    "plt.show()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 47,
   "metadata": {
    "collapsed": false
   },
   "outputs": [],
   "source": [
    "!python cursor_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Rectangle selector"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 48,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting rectsel.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile rectsel.py\n",
    "#!/usr/bin/env python\n",
    "\"\"\"\n",
    "Do a mouseclick somewhere, move the mouse to some destination, release\n",
    "the button.  This class gives click- and release-events and also draws\n",
    "a line or a box from the click-point to the actual mouseposition\n",
    "(within the same axes) until the button is released.  Within the\n",
    "method 'self.ignore()' it is checked wether the button from eventpress\n",
    "and eventrelease are the same.\n",
    "\"\"\"\n",
    "from matplotlib.widgets import RectangleSelector\n",
    "import numpy as np\n",
    "import matplotlib.pyplot as plt\n",
    "\n",
    "\n",
    "def line_select_callback(eclick, erelease):\n",
    "    'eclick and erelease are the press and release events'\n",
    "    x1, y1 = eclick.xdata, eclick.ydata\n",
    "    x2, y2 = erelease.xdata, erelease.ydata\n",
    "    print(\"(%3.2f, %3.2f) --> (%3.2f, %3.2f)\" % (x1, y1, x2, y2))\n",
    "    print(\" The button you used were: %s %s\" % (eclick.button, erelease.button))\n",
    "\n",
    "\n",
    "def toggle_selector(event):\n",
    "    print(' Key pressed.')\n",
    "    if event.key in ['Q', 'q'] and toggle_selector.RS.active:\n",
    "        print(' RectangleSelector deactivated.')\n",
    "        toggle_selector.RS.set_active(False)\n",
    "    if event.key in ['A', 'a'] and not toggle_selector.RS.active:\n",
    "        print(' RectangleSelector activated.')\n",
    "        toggle_selector.RS.set_active(True)\n",
    "\n",
    "\n",
    "fig, current_ax = plt.subplots()                    # make a new plotingrange\n",
    "N = 100000                                       # If N is large one can see\n",
    "x = np.linspace(0.0, 10.0, N)                    # improvement by use blitting!\n",
    "\n",
    "plt.plot(x, +np.sin(.2*np.pi*x), lw=3.5, c='b', alpha=.7)  # plot something\n",
    "plt.plot(x, +np.cos(.2*np.pi*x), lw=3.5, c='r', alpha=.5)\n",
    "plt.plot(x, -np.sin(.2*np.pi*x), lw=3.5, c='g', alpha=.3)\n",
    "\n",
    "print(\"\\n      click  -->  release\")\n",
    "\n",
    "# drawtype is 'box' or 'line' or 'none'\n",
    "toggle_selector.RS = RectangleSelector(current_ax, line_select_callback,\n",
    "                                       drawtype='box', useblit=True,\n",
    "                                       button=[1, 3],  # don't use middle button\n",
    "                                       minspanx=5, minspany=5,\n",
    "                                       spancoords='pixels',\n",
    "                                       interactive=True)\n",
    "plt.connect('key_press_event', toggle_selector)\n",
    "plt.show()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 49,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "\r\n",
      "      click  -->  release\r\n"
     ]
    }
   ],
   "source": [
    "!python rectsel.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Slider "
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 50,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting slider_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile slider_demo.py\n",
    "import numpy as np\n",
    "import matplotlib.pyplot as plt\n",
    "from matplotlib.widgets import Slider, Button, RadioButtons\n",
    "\n",
    "fig, ax = plt.subplots()\n",
    "plt.subplots_adjust(left=0.25, bottom=0.25)\n",
    "t = np.arange(0.0, 1.0, 0.001)\n",
    "a0 = 5\n",
    "f0 = 3\n",
    "s = a0*np.sin(2*np.pi*f0*t)\n",
    "l, = plt.plot(t, s, lw=2, color='red')\n",
    "plt.axis([0, 1, -10, 10])\n",
    "\n",
    "axcolor = 'lightgoldenrodyellow'\n",
    "axfreq = plt.axes([0.25, 0.1, 0.65, 0.03], axisbg=axcolor)\n",
    "axamp = plt.axes([0.25, 0.15, 0.65, 0.03], axisbg=axcolor)\n",
    "\n",
    "sfreq = Slider(axfreq, 'Freq', 0.1, 30.0, valinit=f0)\n",
    "samp = Slider(axamp, 'Amp', 0.1, 10.0, valinit=a0)\n",
    "\n",
    "\n",
    "def update(val):\n",
    "    amp = samp.val\n",
    "    freq = sfreq.val\n",
    "    l.set_ydata(amp*np.sin(2*np.pi*freq*t))\n",
    "    fig.canvas.draw_idle()\n",
    "sfreq.on_changed(update)\n",
    "samp.on_changed(update)\n",
    "\n",
    "resetax = plt.axes([0.8, 0.025, 0.1, 0.04])\n",
    "button = Button(resetax, 'Reset', color=axcolor, hovercolor='0.975')\n",
    "\n",
    "\n",
    "def reset(event):\n",
    "    sfreq.reset()\n",
    "    samp.reset()\n",
    "button.on_clicked(reset)\n",
    "\n",
    "rax = plt.axes([0.025, 0.5, 0.15, 0.15], axisbg=axcolor)\n",
    "radio = RadioButtons(rax, ('red', 'blue', 'green'), active=0)\n",
    "\n",
    "\n",
    "def colorfunc(label):\n",
    "    l.set_color(label)\n",
    "    fig.canvas.draw_idle()\n",
    "radio.on_clicked(colorfunc)\n",
    "\n",
    "plt.show()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 51,
   "metadata": {
    "collapsed": false
   },
   "outputs": [],
   "source": [
    "!python slider_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Span selector"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 52,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Overwriting span_demo.py\n"
     ]
    }
   ],
   "source": [
    "%%writefile span_demo.py\n",
    "#!/usr/bin/env python\n",
    "\"\"\"\n",
    "The SpanSelector is a mouse widget to select a xmin/xmax range and plot the\n",
    "detail view of the selected region in the lower axes\n",
    "\"\"\"\n",
    "import numpy as np\n",
    "import matplotlib.pyplot as plt\n",
    "from matplotlib.widgets import SpanSelector\n",
    "\n",
    "fig = plt.figure(figsize=(8, 6))\n",
    "ax = fig.add_subplot(211, axisbg='#FFFFCC')\n",
    "\n",
    "x = np.arange(0.0, 5.0, 0.01)\n",
    "y = np.sin(2*np.pi*x) + 0.5*np.random.randn(len(x))\n",
    "\n",
    "ax.plot(x, y, '-')\n",
    "ax.set_ylim(-2, 2)\n",
    "ax.set_title('Press left mouse button and drag to test')\n",
    "\n",
    "ax2 = fig.add_subplot(212, axisbg='#FFFFCC')\n",
    "line2, = ax2.plot(x, y, '-')\n",
    "\n",
    "\n",
    "def onselect(xmin, xmax):\n",
    "    indmin, indmax = np.searchsorted(x, (xmin, xmax))\n",
    "    indmax = min(len(x) - 1, indmax)\n",
    "\n",
    "    thisx = x[indmin:indmax]\n",
    "    thisy = y[indmin:indmax]\n",
    "    line2.set_data(thisx, thisy)\n",
    "    ax2.set_xlim(thisx[0], thisx[-1])\n",
    "    ax2.set_ylim(thisy.min(), thisy.max())\n",
    "    fig.canvas.draw()\n",
    "\n",
    "# set useblit True on gtkagg for enhanced performance\n",
    "span = SpanSelector(ax, onselect, 'horizontal', useblit=True,\n",
    "                    rectprops=dict(alpha=0.5, facecolor='red'))\n",
    "\n",
    "\n",
    "plt.show()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 53,
   "metadata": {
    "collapsed": false
   },
   "outputs": [],
   "source": [
    "!python span_demo.py"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Further reading\n",
    "\n",
    "http://t2mh.com/python/wxPython%20in%20Action%20(2006).pdf\n",
    "\n",
    "https://www.tutorialspoint.com/wxpython/wxpython_tutorial.pdf\n",
    "\n",
    "## Versions"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 54,
   "metadata": {
    "collapsed": false
   },
   "outputs": [
    {
     "data": {
      "application/json": {
       "Software versions": [
        {
         "module": "Python",
         "version": "2.7.12 64bit [GCC 4.4.7 20120313 (Red Hat 4.4.7-1)]"
        },
        {
         "module": "IPython",
         "version": "5.1.0"
        },
        {
         "module": "OS",
         "version": "Linux 4.4.0 57 generic x86_64 with debian jessie sid"
        },
        {
         "module": "wxpython",
         "version": "3.0.0.0"
        }
       ]
      },
      "text/html": [
       "<table><tr><th>Software</th><th>Version</th></tr><tr><td>Python</td><td>2.7.12 64bit [GCC 4.4.7 20120313 (Red Hat 4.4.7-1)]</td></tr><tr><td>IPython</td><td>5.1.0</td></tr><tr><td>OS</td><td>Linux 4.4.0 57 generic x86_64 with debian jessie sid</td></tr><tr><td>wxpython</td><td>3.0.0.0</td></tr><tr><td colspan='2'>Thu Jan 12 09:11:47 2017 CET</td></tr></table>"
      ],
      "text/latex": [
       "\\begin{tabular}{|l|l|}\\hline\n",
       "{\\bf Software} & {\\bf Version} \\\\ \\hline\\hline\n",
       "Python & 2.7.12 64bit [GCC 4.4.7 20120313 (Red Hat 4.4.7-1)] \\\\ \\hline\n",
       "IPython & 5.1.0 \\\\ \\hline\n",
       "OS & Linux 4.4.0 57 generic x86\\_64 with debian jessie sid \\\\ \\hline\n",
       "wxpython & 3.0.0.0 \\\\ \\hline\n",
       "\\hline \\multicolumn{2}{|l|}{Thu Jan 12 09:11:47 2017 CET} \\\\ \\hline\n",
       "\\end{tabular}\n"
      ],
      "text/plain": [
       "Software versions\n",
       "Python 2.7.12 64bit [GCC 4.4.7 20120313 (Red Hat 4.4.7-1)]\n",
       "IPython 5.1.0\n",
       "OS Linux 4.4.0 57 generic x86_64 with debian jessie sid\n",
       "wxpython 3.0.0.0\n",
       "Thu Jan 12 09:11:47 2017 CET"
      ]
     },
     "execution_count": 54,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "%load_ext version_information\n",
    "\n",
    "%version_information wxpython"
   ]
  }
 ],
 "metadata": {
  "anaconda-cloud": {},
  "kernelspec": {
   "display_name": "Python [conda root]",
   "language": "python",
   "name": "conda-root-py"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 2
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython2",
   "version": "2.7.12"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 0
}