From 698d3e37191d469b98f355623ee5bbb1de3d481f Mon Sep 17 00:00:00 2001
From: hyle01 <49797311+hyle01@users.noreply.github.com>
Date: Sat, 20 Apr 2019 00:25:06 +0200
Subject: [PATCH 1/7] Add missing "import PushButton" in documentation example
 code

---
 docs-src/docs/multiple_windows.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs-src/docs/multiple_windows.md b/docs-src/docs/multiple_windows.md
index f3ed4566..f93eda2a 100644
--- a/docs-src/docs/multiple_windows.md
+++ b/docs-src/docs/multiple_windows.md
@@ -38,7 +38,7 @@ When a `Window` object is created it is immediately displayed on the screen, you
 To make a window which is shown when a button on the `App` is clicked and closed when a button is clicked on the `Window`.
 
 ```python
-from guizero import App, Window
+from guizero import App, Window, PushButton
 
 def open_window():
     window.show()

From c43f87b3fc9aef30ee0d11ef4755a375af646305 Mon Sep 17 00:00:00 2001
From: Martin O'Hanlon <martin.ohanlon@raspberrypi.org>
Date: Fri, 3 May 2019 23:19:04 +0100
Subject: [PATCH 2/7] textbox command on release

---
 examples/textbox.py | 1 +
 guizero/TextBox.py  | 4 ++--
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/examples/textbox.py b/examples/textbox.py
index f52f0530..d473a929 100644
--- a/examples/textbox.py
+++ b/examples/textbox.py
@@ -6,6 +6,7 @@ def go():
 
 def key_pressed(key):
     print("key pressed {}".format(key))
+    print("value = {}".format(textbox.value))
 
 app = App()
 text = Text(app, text="Enter your name")
diff --git a/guizero/TextBox.py b/guizero/TextBox.py
index d8eda0c2..a16503b9 100644
--- a/guizero/TextBox.py
+++ b/guizero/TextBox.py
@@ -45,7 +45,7 @@ def __init__(
         self.update_command(command)
 
         # Bind the key pressed event
-        self.events.set_event("<TextBox.KeyPress>", "<KeyPress>", self._key_pressed)
+        self.events.set_event("<TextBox.KeyRelease>", "<KeyRelease>", self._key_released)
 
     # PROPERTIES
     # ----------------------------------
@@ -82,7 +82,7 @@ def resize(self, width, height):
 
     # METHODS
     # -------------------------------------------
-    def _key_pressed(self, event):
+    def _key_released(self, event):
         if self._command:
             args_expected = utils.no_args_expected(self._command)
             if args_expected == 0:

From 6fce091c5dc62dc137835a5aa93eb6abb9d8876e Mon Sep 17 00:00:00 2001
From: Martin O'Hanlon <martin.ohanlon@raspberrypi.org>
Date: Sat, 4 May 2019 17:02:57 +0100
Subject: [PATCH 3/7] adding_tk_widget warning

---
 docs-src/docs/usingtk.md |  8 ++++++++
 examples/tk_widget.py    | 22 +++++++++++++---------
 guizero/base.py          |  3 +++
 3 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/docs-src/docs/usingtk.md b/docs-src/docs/usingtk.md
index c0b5fd62..3f84ac27 100644
--- a/docs-src/docs/usingtk.md
+++ b/docs-src/docs/usingtk.md
@@ -23,6 +23,14 @@ app.add_tk_widget(spinbox)
 a.display()
 ```
 
+When adding a tk widget to a `Box` or a `Window` you will have to specify its `tk` property when creating the tk widget.
+
+```python
+box = Box(app)
+spinbox = Spinbox(box.tk, from_=0, to=10)
+box.add_tk_widget(spinbox)
+```
+
 ### Using a tkinter method on a guizero object
 
 Each guizero widget itself contains a tk widget - you can find out which by looking on the guizero documentation page for the widget. For example, a guizero `TextBox` contains a tkinter `Entry` object. You can access the internal object using the syntax `<object_name>.tk`.
diff --git a/examples/tk_widget.py b/examples/tk_widget.py
index 32d3395e..e75c7674 100644
--- a/examples/tk_widget.py
+++ b/examples/tk_widget.py
@@ -1,20 +1,24 @@
-from guizero import App, Text
+from guizero import App, Box, Text
 from tkinter import Spinbox
 from tkinter.ttk import Progressbar
 
-a = App(title="Using tk widgets")
+app = App(title="Using tk widgets")
 
-Text(a, text="Spinbox")
+Text(app, text="Spinbox")
 
+# add a spinbox widget to the app
 sp = Spinbox(from_=0, to=10)
-a.add_tk_widget(sp)
+app.add_tk_widget(sp)
 
-Text(a, text="and Progressbar")
+Text(app, text="and Progressbar")
 
-pb = Progressbar()
-a.add_tk_widget(pb)
+box = Box(app, border=True)
+
+# add a progress bar to the boc
+pb = Progressbar(box.tk)
+box.add_tk_widget(pb)
 pb.start()
 
-Text(a, text="in guizero")
+Text(app, text="in guizero")
 
-a.display()
\ No newline at end of file
+app.display()
\ No newline at end of file
diff --git a/guizero/base.py b/guizero/base.py
index b6b245ff..53fd3a80 100644
--- a/guizero/base.py
+++ b/guizero/base.py
@@ -315,6 +315,9 @@ def add_tk_widget(self, tk_widget, grid=None, align=None, visible=True, enabled=
             The starting height of the widget. Defaults to `None` and will auto
             size.
         """
+        # raise a warning if the tk widgets master is not this container
+        if self.tk is not tk_widget.master:
+            utils.error_format("The tk widget's master is not '{}'.\nIt may not display correctly.".format(self.description))
         return Widget(self, tk_widget, "tk widget", grid, align, visible, enabled, width, height)
 
     def _add_child(self, child):

From 6412948b5faf8d66c087d14cad568b63213a15d7 Mon Sep 17 00:00:00 2001
From: Martin O'Hanlon <martin.ohanlon@raspberrypi.org>
Date: Sat, 4 May 2019 17:56:30 +0100
Subject: [PATCH 4/7] update __init__ in docs

---
 docs-src/docs/app.md         | 12 +++++++++++-
 docs-src/docs/box.md         | 14 +++++++++++++-
 docs-src/docs/buttongroup.md | 17 ++++++++++++++++-
 docs-src/docs/checkbox.md    | 15 ++++++++++++++-
 docs-src/docs/combo.md       | 15 ++++++++++++++-
 docs-src/docs/drawing.md     | 12 +++++++++++-
 docs-src/docs/listbox.md     | 17 ++++++++++++++++-
 docs-src/docs/menubar.md     |  8 +++++++-
 docs-src/docs/picture.md     | 13 ++++++++++++-
 docs-src/docs/pushbutton.md  | 23 ++++++++++++++++++++---
 docs-src/docs/slider.md      | 16 +++++++++++++++-
 docs-src/docs/text.md        | 17 ++++++++++++++++-
 docs-src/docs/textbox.md     | 16 +++++++++++++++-
 docs-src/docs/waffle.md      | 19 ++++++++++++++++++-
 docs-src/docs/window.md      | 12 +++++++++++-
 guizero/App.py               | 10 +++++++++-
 guizero/Drawing.py           | 10 +++++++++-
 guizero/Picture.py           | 11 ++++++++++-
 guizero/Slider.py            | 14 +++++++++++++-
 guizero/Waffle.py            | 17 ++++++++++++++++-
 guizero/Window.py            | 10 +++++++++-
 21 files changed, 275 insertions(+), 23 deletions(-)

diff --git a/docs-src/docs/app.md b/docs-src/docs/app.md
index 4fb27e3f..d3b010b8 100644
--- a/docs-src/docs/app.md
+++ b/docs-src/docs/app.md
@@ -2,7 +2,17 @@
 
 (Contains a `tkinter.Tk` object)
 
-`__init__(self, title="guizero", width=500, height=500, layout="auto", bgcolor=None, bg=None, visible=True)`
+```python
+__init__(
+    self, 
+    title="guizero", 
+    width=500, 
+    height=500, 
+    layout="auto", 
+    bgcolor=None, 
+    bg=None, 
+    visible=True)
+```
 
 ### What is it?
 The `App` object is the basis of all GUIs created using guizero. It is the main window which contains all of the other widgets.
diff --git a/docs-src/docs/box.md b/docs-src/docs/box.md
index 6259f8a0..6f26fbd2 100644
--- a/docs-src/docs/box.md
+++ b/docs-src/docs/box.md
@@ -2,7 +2,19 @@
 
 (Contains a `tkinter.Frame` object)
 
-`__init__(self, master, layout="auto", grid=None, align=None, visible=True, enabled=None)`
+```python
+__init__(
+    self,
+    master,
+    layout="auto",
+    grid=None,
+    align=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None,
+    border=None)
+```
 
 ### What is it?
 The `Box` object is an invisible container which can contain other widgets. It is the only object other than `App` which can act as the `master` for other objects and can have its own layout manager.
diff --git a/docs-src/docs/buttongroup.md b/docs-src/docs/buttongroup.md
index 56258756..6433bed3 100644
--- a/docs-src/docs/buttongroup.md
+++ b/docs-src/docs/buttongroup.md
@@ -2,7 +2,22 @@
 
 (Contains a `tkinter.Frame` object)
 
-`__init__(self, master, options=[], selected=None, horizontal=False, command=None, grid=None, align=None, args=None, visible=True, enabled=None)`
+```python
+__init__(
+    self,
+    master,
+    options=[],
+    selected=None,
+    horizontal=False,
+    command=None,
+    grid=None,
+    align=None,
+    args=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None)
+```
 
 ### What is it?
 The `ButtonGroup` object displays a group of radio buttons, allowing the user to choose a single option.
diff --git a/docs-src/docs/checkbox.md b/docs-src/docs/checkbox.md
index e98cdc92..539904c8 100644
--- a/docs-src/docs/checkbox.md
+++ b/docs-src/docs/checkbox.md
@@ -2,7 +2,20 @@
 
 (Contains a `tkinter.Checkbutton` object)
 
-`__init__(self, master, text, command=None, grid=None, align=None, args=None, visible=True, enabled=None)`
+```python
+__init__(
+    self,
+    master,
+    text="",
+    command=None,
+    grid=None,
+    align=None,
+    args=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None)
+```
 
 ### What is it?
 The `CheckBox` object displays a check box to allow an option to be ticked or unticked
diff --git a/docs-src/docs/combo.md b/docs-src/docs/combo.md
index bf18a1fa..4f8aa8c3 100644
--- a/docs-src/docs/combo.md
+++ b/docs-src/docs/combo.md
@@ -2,7 +2,20 @@
 
 (Contains a `tkinter.OptionMenu` object)
 
-`__init__(self, master, options=[], selected=None, command=None, grid=None, align=None, visible=True, enabled=None)`
+```python
+__init__(
+    self,
+    master,
+    options=[],
+    selected=None,
+    command=None,
+    grid=None,
+    align=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None)
+```
 
 ### What is it?
 The `Combo` object displays a drop down box allowing a single option to be selected from a list of options.
diff --git a/docs-src/docs/drawing.md b/docs-src/docs/drawing.md
index a51d7270..14bacfd6 100644
--- a/docs-src/docs/drawing.md
+++ b/docs-src/docs/drawing.md
@@ -2,7 +2,17 @@
 
 (Contains a `tkinter.canvas` object)
 
-`__init__(self, master, width=100, height=100, grid=None, align=None, visible=True, enabled=None):`
+```python
+__init__(
+    self, 
+    master, 
+    width=100, 
+    height=100, 
+    grid=None, 
+    align=None, 
+    visible=True, 
+    enabled=None)
+```
 
 ### What is it?
 The `Drawing` object allows shapes, images and text to be created.
diff --git a/docs-src/docs/listbox.md b/docs-src/docs/listbox.md
index f2acd34d..fb92063f 100644
--- a/docs-src/docs/listbox.md
+++ b/docs-src/docs/listbox.md
@@ -2,7 +2,22 @@
 
 (Contains a `tkinter.Listbox` object)
 
-`__init__(self, master, items=None, selected=None, command=None, grid=None, align=None, visible=True, enabled=None, multiselect=False, scrollbar=False)`
+```python
+__init__(
+    self,
+    master,
+    items=None,
+    selected=None,
+    command=None,
+    grid=None,
+    align=None,
+    visible=True,
+    enabled=None,
+    multiselect=False,
+    scrollbar=False,
+    width=None,
+    height=None)
+```
 
 ### What is it?
 The `ListBox` object displays a list of items from which either single or multiple items can be selected.
diff --git a/docs-src/docs/menubar.md b/docs-src/docs/menubar.md
index f7937bec..d0959797 100644
--- a/docs-src/docs/menubar.md
+++ b/docs-src/docs/menubar.md
@@ -2,7 +2,13 @@
 
 (Contains a `tkinter.Menu` object)
 
-`__init__(self, master, toplevel, options)`
+```python
+__init__(
+    self, 
+    master, 
+    toplevel, 
+    options)
+```
 
 ### What is it?
 The `MenuBar` object displays a menu at the top of the screen, with each menu option leading to a submenu.
diff --git a/docs-src/docs/picture.md b/docs-src/docs/picture.md
index caea5592..7f710f64 100644
--- a/docs-src/docs/picture.md
+++ b/docs-src/docs/picture.md
@@ -2,7 +2,18 @@
 
 (Contains a `tkinter.Label` object)
 
-`__init__(self, master, image=None, grid=None, align=None, visible=True, enabled=None)`
+```python
+__init__(
+    self, 
+    master, 
+    image=None, 
+    grid=None, 
+    align=None, 
+    visible=True, 
+    enabled=None, 
+    width=None, 
+    height=None)
+```
 
 ### What is it?
 The `Picture` object displays an image.
diff --git a/docs-src/docs/pushbutton.md b/docs-src/docs/pushbutton.md
index d8d27344..75cd6e7b 100644
--- a/docs-src/docs/pushbutton.md
+++ b/docs-src/docs/pushbutton.md
@@ -2,7 +2,24 @@
 
 (Contains a `tkinter.Button` object)
 
-`__init__(self, master, command=None, args=None, text="Button", image=None, pady=10, padx=10, grid=None, align=None, visible=True, enabled=None)`
+```python
+__init__(
+    self,
+    master,
+    command=None,
+    args=None,
+    text="Button",
+    image=None,
+    pady=10,
+    padx=10,
+    grid=None,
+    align=None,
+    icon=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None)
+```
 
 ### What is it?
 The `PushButton` object displays a button with text or an image, which calls a function when pressed.
@@ -16,7 +33,7 @@ Create a `PushButton` object like this:
 ```python
 from guizero import App, PushButton
 def do_nothing():
-  print("Button was pressed")
+    print("Button was pressed")
 
 app = App()
 button = PushButton(app, command=do_nothing)
@@ -28,7 +45,7 @@ Create a picture `PushButton` with an image like this:
 ```python
 from guizero import App, PushButton
 def do_nothing():
-  print("A picture button was pressed")
+    print("A picture button was pressed")
 
 app = App()
 button = PushButton(app, image="button.gif", command=do_nothing)
diff --git a/docs-src/docs/slider.md b/docs-src/docs/slider.md
index 048d857f..0909ae9d 100644
--- a/docs-src/docs/slider.md
+++ b/docs-src/docs/slider.md
@@ -2,7 +2,21 @@
 
 (Contains a `tkinter.Scale` object)
 
-`__init__(self, master, start=0, end=100, horizontal=True, command=None, grid=None, align=None)`
+```python
+__init__(
+    self, 
+    master, 
+    start=0, 
+    end=100, 
+    horizontal=True, 
+    command=None, 
+    grid=None, 
+    align=None, 
+    visible=True, 
+    enabled=None, 
+    width=None, 
+    height=None)
+```
 
 ### What is it?
 The `Slider` object displays a bar and selector which can be used to specify a value in a range.
diff --git a/docs-src/docs/text.md b/docs-src/docs/text.md
index a235714f..7ff45e35 100644
--- a/docs-src/docs/text.md
+++ b/docs-src/docs/text.md
@@ -2,7 +2,22 @@
 
 (Contains a `tkinter.Label` object)
 
-`__init__(self, master, text="", size=12, color="black", bg=None, font="Helvetica", grid=None, align=None, visible=True, enabled=None)`
+```python
+__init__(
+    self,
+    master,
+    text="",
+    size=12,
+    color="black",
+    bg=None,
+    font="Helvetica",
+    grid=None,
+    align=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None)
+```
 
 ### What is it?
 The `Text` object displays non editable text in your app, useful for titles, labels and instructions.
diff --git a/docs-src/docs/textbox.md b/docs-src/docs/textbox.md
index 9f02c6b7..22968d9b 100644
--- a/docs-src/docs/textbox.md
+++ b/docs-src/docs/textbox.md
@@ -2,7 +2,21 @@
 
 (Contains a `tkinter.Entry` object)
 
-`__init__(self, master, text="", width=10, height=1, grid=None, align=None, visible=True, enabled=None, multiline=False, scrollbar=False, command=None)`
+```python
+__init__(
+    self,
+    master,
+    text="",
+    width=10,
+    height=1,
+    grid=None,
+    align=None,
+    visible=True,
+    enabled=None,
+    multiline=False,
+    scrollbar=False,
+    command=None)
+```
 
 ### What is it
 The `TextBox` object displays a text box which the user can type in.
diff --git a/docs-src/docs/waffle.md b/docs-src/docs/waffle.md
index 198861af..a5df06ba 100644
--- a/docs-src/docs/waffle.md
+++ b/docs-src/docs/waffle.md
@@ -2,7 +2,24 @@
 
 (Contains a `tkinter.Frame` object)
 
-`__init__(self, master, height=3, width=3, dim=20, pad=5, color="white", dotty=False, grid=None, align=None, command=None, visible=True, enabled=None, bg=None)`
+```python
+__init__(
+    self, 
+    master, 
+    height=3, 
+    width=3, 
+    dim=20, 
+    pad=5, 
+    color="white", 
+    dotty=False, 
+    grid=None, 
+    align=None, 
+    command=None, 
+    remember=True, 
+    visible=True, 
+    enabled=None, 
+    bg=None)
+```
 
 ### What is it
 The `Waffle` object display an n*n grid of squares with custom dimensions and padding
diff --git a/docs-src/docs/window.md b/docs-src/docs/window.md
index 8ba8fc88..f8122dd8 100644
--- a/docs-src/docs/window.md
+++ b/docs-src/docs/window.md
@@ -2,7 +2,17 @@
 
 (Contains a `tkinter.TopLevel` object)
 
-`__init__(self, master, title="guizero", width=500, height=500, layout="auto", bg=None, visible=True):`
+```python
+__init__(
+    self, 
+    master, 
+    title="guizero", 
+    width=500, 
+    height=500, 
+    layout="auto", 
+    bg=None, 
+    visible=True)
+```
 
 ### What is it?
 A `Window` object is how you create new windows in guizero.
diff --git a/guizero/App.py b/guizero/App.py
index fa327363..ba19e663 100644
--- a/guizero/App.py
+++ b/guizero/App.py
@@ -7,7 +7,15 @@ class App(BaseWindow):
 
     _main_app = None
 
-    def __init__(self, title="guizero", width=500, height=500, layout="auto", bgcolor=None, bg=None, visible=True):
+    def __init__(
+        self, 
+        title="guizero", 
+        width=500, 
+        height=500, 
+        layout="auto", 
+        bgcolor=None, 
+        bg=None, 
+        visible=True):
 
         description = "[App] object"
 
diff --git a/guizero/Drawing.py b/guizero/Drawing.py
index ef310bb0..ecd90db2 100644
--- a/guizero/Drawing.py
+++ b/guizero/Drawing.py
@@ -6,7 +6,15 @@
 
 class Drawing(Widget):
 
-    def __init__(self, master, width=100, height=100, grid=None, align=None, visible=True, enabled=None):
+    def __init__(
+        self, 
+        master, 
+        width=100, 
+        height=100, 
+        grid=None, 
+        align=None, 
+        visible=True, 
+        enabled=None):
         """
         Creates a Drawing
 
diff --git a/guizero/Picture.py b/guizero/Picture.py
index 9d29cf26..3ec1548a 100644
--- a/guizero/Picture.py
+++ b/guizero/Picture.py
@@ -4,7 +4,16 @@
 
 class Picture(Widget):
 
-    def __init__(self, master, image=None, grid=None, align=None, visible=True, enabled=None, width=None, height=None):
+    def __init__(
+        self, 
+        master, 
+        image=None, 
+        grid=None, 
+        align=None, 
+        visible=True, 
+        enabled=None, 
+        width=None, 
+        height=None):
 
         description = "[Picture] object"
 
diff --git a/guizero/Slider.py b/guizero/Slider.py
index 0685082f..b219875e 100644
--- a/guizero/Slider.py
+++ b/guizero/Slider.py
@@ -4,7 +4,19 @@
 
 class Slider(TextWidget):
 
-    def __init__(self, master, start=0, end=100, horizontal=True, command=None, grid=None, align=None, visible=True, enabled=None, width=None, height=None):
+    def __init__(
+        self, 
+        master, 
+        start=0, 
+        end=100, 
+        horizontal=True, 
+        command=None, 
+        grid=None, 
+        align=None, 
+        visible=True, 
+        enabled=None, 
+        width=None, 
+        height=None):
 
         description = "[Slider] object from " + str(start) + " to " + str(end)
 
diff --git a/guizero/Waffle.py b/guizero/Waffle.py
index 7b729f7b..00b144b8 100644
--- a/guizero/Waffle.py
+++ b/guizero/Waffle.py
@@ -5,7 +5,22 @@
 
 class Waffle(Widget):
 
-    def __init__(self, master, height=3, width=3, dim=20, pad=5, color="white", dotty=False, grid=None, align=None, command=None, remember=True, visible=True, enabled=None, bg=None):
+    def __init__(
+        self, 
+        master, 
+        height=3, 
+        width=3, 
+        dim=20, 
+        pad=5, 
+        color="white", 
+        dotty=False, 
+        grid=None, 
+        align=None, 
+        command=None, 
+        remember=True, 
+        visible=True, 
+        enabled=None, 
+        bg=None):
 
         description = "[Waffle] object ({}x{})".format(height, width)
 
diff --git a/guizero/Window.py b/guizero/Window.py
index 71b51187..c697914b 100644
--- a/guizero/Window.py
+++ b/guizero/Window.py
@@ -5,7 +5,15 @@
 
 class Window(BaseWindow):
 
-    def __init__(self, master, title="guizero", width=500, height=500, layout="auto", bg=None, visible=True):
+    def __init__(
+        self, 
+        master, 
+        title="guizero", 
+        width=500, 
+        height=500, 
+        layout="auto", 
+        bg=None, 
+        visible=True):
 
         description = "[Window] oject"
 

From 511637afbd765149302e892e985ca677ef0245c2 Mon Sep 17 00:00:00 2001
From: Martin O'Hanlon <martin.ohanlon@raspberrypi.org>
Date: Sat, 4 May 2019 21:45:08 +0100
Subject: [PATCH 5/7] fix cascading text color

---
 examples/text.py | 10 ++++++++++
 guizero/Text.py  | 13 +++++++++++--
 2 files changed, 21 insertions(+), 2 deletions(-)
 create mode 100644 examples/text.py

diff --git a/examples/text.py b/examples/text.py
new file mode 100644
index 00000000..cfba3d80
--- /dev/null
+++ b/examples/text.py
@@ -0,0 +1,10 @@
+from guizero import App, Text
+a = App()
+
+t1 = Text(a)
+t1.value = "{}, {}, {}".format(t1.font, t1.text_size, t1.text_color)
+
+t2 = Text(a, color=None, size=None, font=None)
+t2.value = "{}, {}, {}".format(t2.font, t2.text_size, t2.text_color)
+
+a.display()
\ No newline at end of file
diff --git a/guizero/Text.py b/guizero/Text.py
index 6a6b99e9..6b053a56 100644
--- a/guizero/Text.py
+++ b/guizero/Text.py
@@ -22,12 +22,21 @@ def __init__(
         description = "[Text] object with text \"" + str(text) + "\""
 
         self._text = str(text)
-        tk = Label(master.tk, text=text, fg=utils.convert_color(color), bg=utils.convert_color(bg), font=(font, size))
-
+        tk = Label(master.tk, text=text)
         super(Text, self).__init__(master, tk, description, grid, align, visible, enabled, width, height)
 
+        # setup defaults
         if bg:
             self.bg = bg
+        
+        if size is not None:
+            self.text_size = size
+
+        if font is not None:
+            self.font = font
+
+        if color is not None:
+            self.text_color = color
 
     # PROPERTIES
     # ----------------------------------

From a5e565d19edb0afa477e4958e332570c4f843abc Mon Sep 17 00:00:00 2001
From: Martin O'Hanlon <martin.ohanlon@raspberrypi.org>
Date: Wed, 8 May 2019 12:24:57 +0100
Subject: [PATCH 6/7] fixed test

---
 tests/common_test.py | 4 ++--
 tests/test_text.py   | 7 ++++---
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/tests/common_test.py b/tests/common_test.py
index 312bffc5..f0ea2d15 100644
--- a/tests/common_test.py
+++ b/tests/common_test.py
@@ -265,7 +265,7 @@ def check_children(container, test_value):
     check_children(container, True)
 
 def cascading_properties_test(container):
-    t = Text(container)
+    t = Text(container, color=None, size=None, font=None)
     p = Picture(container)
 
     container.bg = "red"
@@ -294,7 +294,7 @@ def inheriting_properties_test(container):
     container.font = SET_FONT
     container.enabled = False
 
-    t = Text(container)
+    t = Text(container, color=None, size=None, font=None)
     assert t.bg == "red"
     assert t.text_color == "purple"
     assert t.text_size == 16
diff --git a/tests/test_text.py b/tests/test_text.py
index c8d2392f..f57cfdf2 100644
--- a/tests/test_text.py
+++ b/tests/test_text.py
@@ -110,7 +110,8 @@ def test_display():
 
 def test_text():
     a = App()
-    t = Text(a)
+    # default values
+    t = Text(a, color=None, size=None, font=None)
     text_test(t)
     a.destroy()
 
@@ -135,11 +136,11 @@ def test_events():
 
 def test_cascaded_properties():
     a = App()
-    t = Text(a)
+    t = Text(a, color=None, size=None, font=None)
     cascaded_properties_test(a, t, True)
     a.destroy()
 
 def test_inherited_properties():
     a = App()
-    inherited_properties_test(a, lambda: Text(a), True)
+    inherited_properties_test(a, lambda: Text(a, color=None, size=None, font=None), True)
     a.destroy()

From a8ec9ea75d1d5b150f8e3f7af61d855e35a1cdcc Mon Sep 17 00:00:00 2001
From: Martin O'Hanlon <martin.ohanlon@raspberrypi.org>
Date: Wed, 8 May 2019 12:32:16 +0100
Subject: [PATCH 7/7] 0.6.4

---
 docs-src/docs/about.md           |    2 +-
 docs-src/docs/changelog.md       |    7 +
 docs/404.html                    |   28 +-
 docs/about/index.html            |   26 +-
 docs/alerts/index.html           |   24 +-
 docs/allwidgets/index.html       |  337 ++++
 docs/app/index.html              |   36 +-
 docs/blocking/index.html         |   24 +-
 docs/box/index.html              |   38 +-
 docs/buttongroup/index.html      |   41 +-
 docs/changelog/index.html        |   38 +-
 docs/checkbox/index.html         |   39 +-
 docs/colors/index.html           |   24 +-
 docs/combo/index.html            |   39 +-
 docs/commands/index.html         |   24 +-
 docs/contributing/index.html     |   24 +-
 docs/css/theme_extra.css         |    5 +-
 docs/deployment/index.html       |   24 +-
 docs/development/index.html      |   24 +-
 docs/drawing/index.html          |   36 +-
 docs/events/index.html           |   24 +-
 docs/gettinghelp/index.html      |   24 +-
 docs/images/index.html           |   24 +-
 docs/index.html                  |   54 +-
 docs/js/theme.js                 |   36 +-
 docs/layout/index.html           |   24 +-
 docs/listbox/index.html          |   41 +-
 docs/menubar/index.html          |   32 +-
 docs/multiple_windows/index.html |   26 +-
 docs/picture/index.html          |   37 +-
 docs/pushbutton/index.html       |   47 +-
 docs/recipes/index.html          |   24 +-
 docs/search.html                 |   92 +-
 docs/search/lunr.js              | 2986 ++++++++++++++++++++++++++++++
 docs/search/main.js              |   96 +
 docs/search/search_index.json    | 1145 +-----------
 docs/search/worker.js            |  128 ++
 docs/sitemap.xml                 |  191 +-
 docs/sitemap.xml.gz              |  Bin 0 -> 216 bytes
 docs/size/index.html             |   24 +-
 docs/slider/index.html           |   40 +-
 docs/start/index.html            |   24 +-
 docs/text/index.html             |   41 +-
 docs/textbox/index.html          |   40 +-
 docs/usingtk/index.html          |   30 +-
 docs/waffle/index.html           |   43 +-
 docs/window/index.html           |   36 +-
 guizero/__init__.py              |    2 +-
 48 files changed, 4362 insertions(+), 1789 deletions(-)
 create mode 100644 docs/allwidgets/index.html
 create mode 100644 docs/search/lunr.js
 create mode 100644 docs/search/main.js
 create mode 100644 docs/search/worker.js
 create mode 100644 docs/sitemap.xml.gz

diff --git a/docs-src/docs/about.md b/docs-src/docs/about.md
index f9516570..03a2df06 100644
--- a/docs-src/docs/about.md
+++ b/docs-src/docs/about.md
@@ -32,6 +32,6 @@ The aim of guizero is to make the process of creating simple GUIs quick, accessi
 
 ### Version
 
-guizero is currently [version 0.6.3](changelog.md)
+guizero is currently [version 0.6.4](changelog.md)
 
 There may be bugs and features may change and be updated.
diff --git a/docs-src/docs/changelog.md b/docs-src/docs/changelog.md
index 8049099b..d34a2506 100644
--- a/docs-src/docs/changelog.md
+++ b/docs-src/docs/changelog.md
@@ -1,5 +1,12 @@
 # guizero
 
+## 0.6.4 - 2019-05-08
+- Fixed TextBox command to be on key release
+- Fix Text not inheriting properties
+- Added add_tk_warning when inserting a tk widget into the wrong container
+- Update docs
+- contributors [martinohanlon](https://github.com/martinohanlon), [hyle01](https://github.com/hyle01) 
+
 ## 0.6.3 - 2019-04-18
 - ListBox scrollbar bug fix (again)
 - Removed pillow requires dependency
diff --git a/docs/404.html b/docs/404.html
index 86460def..476bf341 100644
--- a/docs/404.html
+++ b/docs/404.html
@@ -13,11 +13,12 @@
 
   <link rel="stylesheet" href="/css/theme.css" type="text/css" />
   <link rel="stylesheet" href="/css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="/css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
-  <script src="/js/jquery-2.1.1.min.js"></script>
-  <script src="/js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="/js/highlight.pack.js"></script> 
+  <script src="/js/jquery-2.1.1.min.js" defer></script>
+  <script src="/js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -28,10 +29,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="/about/" class="icon icon-home"> guizero</a>
+        <a href="/." class="icon icon-home"> guizero</a>
         <div role="search">
-  <form id ="rtd-search-form" class="wy-form" action="/search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+  <form id ="rtd-search-form" class="wy-form" action="//search.html" method="get">
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -47,7 +48,7 @@
           
             <li class="toctree-l1">
 		
-    <a class="" href="/">Installation</a>
+    <a class="" href="/.">Installation</a>
 	    </li>
           
             <li class="toctree-l1">
@@ -211,7 +212,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="/about/">guizero</a>
+        <a href="/.">guizero</a>
       </nav>
 
       
@@ -219,7 +220,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="/about/">Docs</a> &raquo;</li>
+    <li><a href="/.">Docs</a> &raquo;</li>
     
     
     <li class="wy-breadcrumbs-aside">
@@ -266,10 +267,9 @@ <h1 id="404-page-not-found">404</h1>
       
     </span>
 </div>
-    <script>var base_url = '';</script>
-    <script src="/js/theme.js"></script>
-      <script src="/search/require.js"></script>
-      <script src="/search/search.js"></script>
+    <script>var base_url = '/';</script>
+    <script src="/js/theme.js" defer></script>
+      <script src="/search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/about/index.html b/docs/about/index.html
index 9aa65437..b19118d5 100644
--- a/docs/about/index.html
+++ b/docs/about/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "About";
     var mkdocs_page_input_path = "about.md";
-    var mkdocs_page_url = "/about/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="./" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -234,7 +235,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="./">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -242,7 +243,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="./">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
     
@@ -282,7 +283,7 @@ <h3 id="aims">Aims</h3>
 <li>Generates helpful additional error messages</li>
 </ul>
 <h3 id="version">Version</h3>
-<p>guizero is currently <a href="../changelog/">version 0.6.3</a></p>
+<p>guizero is currently <a href="../changelog/">version 0.6.4</a></p>
 <p>There may be bugs and features may change and be updated.</p>
               
             </div>
@@ -324,9 +325,8 @@ <h3 id="version">Version</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/alerts/index.html b/docs/alerts/index.html
index 854086c0..dde963ac 100644
--- a/docs/alerts/index.html
+++ b/docs/alerts/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Alerts";
     var mkdocs_page_input_path = "alerts.md";
-    var mkdocs_page_url = "/alerts/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -234,7 +235,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -242,7 +243,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -389,9 +390,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/allwidgets/index.html b/docs/allwidgets/index.html
new file mode 100644
index 00000000..49d539ca
--- /dev/null
+++ b/docs/allwidgets/index.html
@@ -0,0 +1,337 @@
+<!DOCTYPE html>
+<!--[if IE 8]><html class="no-js lt-ie9" lang="en" > <![endif]-->
+<!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  
+  
+  <link rel="shortcut icon" href="../img/favicon.ico">
+  <title>Allwidgets - guizero</title>
+  <link href='https://fonts.googleapis.com/css?family=Lato:400,700|Roboto+Slab:400,700|Inconsolata:400,700' rel='stylesheet' type='text/css'>
+
+  <link rel="stylesheet" href="../css/theme.css" type="text/css" />
+  <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
+  
+  <script>
+    // Current page data
+    var mkdocs_page_name = "Allwidgets";
+    var mkdocs_page_input_path = "allwidgets.md";
+    var mkdocs_page_url = null;
+  </script>
+  
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
+  
+</head>
+
+<body class="wy-body-for-nav" role="document">
+
+  <div class="wy-grid-for-nav">
+
+    
+    <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
+      <div class="wy-side-nav-search">
+        <a href=".." class="icon icon-home"> guizero</a>
+        <div role="search">
+  <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
+  </form>
+</div>
+      </div>
+
+      <div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="main navigation">
+	<ul class="current">
+	  
+          
+            <li class="toctree-l1">
+		
+    <a class="" href="../about/">About</a>
+	    </li>
+          
+            <li class="toctree-l1">
+		
+    <a class="" href="..">Installation</a>
+	    </li>
+          
+            <li class="toctree-l1">
+		
+    <span class="caption-text">Using guizero</span>
+    <ul class="subnav">
+                <li class="">
+                    
+    <a class="" href="../start/">Getting started</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../commands/">Commands</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../multiple_windows/">Multiple windows</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../layout/">Layouts</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../alerts/">Alerts</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../size/">Sizes</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../colors/">Colors</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../images/">Images</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../blocking/">Loops and sleeping</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../events/">Events</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../usingtk/">Using tkinter</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../gettinghelp/">Getting help</a>
+                </li>
+    </ul>
+	    </li>
+          
+            <li class="toctree-l1">
+		
+    <a class="" href="../recipes/">Recipes</a>
+	    </li>
+          
+            <li class="toctree-l1">
+		
+    <span class="caption-text">Widgets</span>
+    <ul class="subnav">
+                <li class="">
+                    
+    <a class="" href="../app/">App</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../box/">Box</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../buttongroup/">ButtonGroup</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../checkbox/">CheckBox</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../combo/">Combo</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../drawing/">Drawing</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../listbox/">ListBox</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../menubar/">MenuBar</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../picture/">Picture</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../pushbutton/">PushButton</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../slider/">Slider</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../text/">Text</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../textbox/">TextBox</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../waffle/">Waffle</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../window/">Window</a>
+                </li>
+    </ul>
+	    </li>
+          
+            <li class="toctree-l1">
+		
+    <span class="caption-text">Contributing</span>
+    <ul class="subnav">
+                <li class="">
+                    
+    <a class="" href="../contributing/">Notes</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../development/">Developing</a>
+                </li>
+                <li class="">
+                    
+    <a class="" href="../deployment/">Deploying</a>
+                </li>
+    </ul>
+	    </li>
+          
+            <li class="toctree-l1">
+		
+    <a class="" href="../changelog/">Change log</a>
+	    </li>
+          
+        </ul>
+      </div>
+      &nbsp;
+    </nav>
+
+    <section data-toggle="wy-nav-shift" class="wy-nav-content-wrap">
+
+      
+      <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
+        <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
+        <a href="..">guizero</a>
+      </nav>
+
+      
+      <div class="wy-nav-content">
+        <div class="rst-content">
+          <div role="navigation" aria-label="breadcrumbs navigation">
+  <ul class="wy-breadcrumbs">
+    <li><a href="..">Docs</a> &raquo;</li>
+    
+      
+    
+    <li>Allwidgets</li>
+    <li class="wy-breadcrumbs-aside">
+      
+    </li>
+  </ul>
+  <hr/>
+</div>
+          <div role="main">
+            <div class="section">
+              
+                <h2 id="common-methods">Common methods</h2>
+<p>These methods can be called upon any guizero widget.</p>
+<table>
+<thead>
+<tr>
+<th>Method</th>
+<th>Takes</th>
+<th>Description</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td>after(time, command, args=None)</td>
+<td>time (int), command (function name), args (list of arguments)</td>
+<td>Schedules a <strong>single</strong> call to <code>command</code> after <code>time</code> milliseconds. (To repeatedly call the same command, use <code>repeat()</code>)</td>
+</tr>
+<tr>
+<td>repeat(time, command, args=None)</td>
+<td>time (int), command (function name), args (list of arguments)</td>
+<td>Repeats <code>command</code> every <code>time</code> milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.</td>
+</tr>
+<tr>
+<td>cancel(command)</td>
+<td>command (function name)</td>
+<td>Cancels a scheduled call to <code>command</code></td>
+</tr>
+<tr>
+<td>destroy()</td>
+<td>-</td>
+<td>Destroys the widget</td>
+</tr>
+<tr>
+<td>disable()</td>
+<td>-</td>
+<td>Disables the widget so that it is "greyed out" and cannot be interacted with</td>
+</tr>
+<tr>
+<td>enable()</td>
+<td>-</td>
+<td>Enables the widget</td>
+</tr>
+<tr>
+<td>focus()</td>
+<td>-</td>
+<td>Gives focus to the widget (e.g. focusing a <code>TextBox</code> so that the user can type inside it)</td>
+</tr>
+<tr>
+<td>hide()</td>
+<td>-</td>
+<td>Hides the widget from view. This method will unpack the widget from the layout manager.</td>
+</tr>
+<tr>
+<td>show()</td>
+<td>-</td>
+<td>Displays the widget</td>
+</tr>
+</tbody>
+</table>
+              
+            </div>
+          </div>
+          <footer>
+  
+
+  <hr/>
+
+  <div role="contentinfo">
+    <!-- Copyright etc -->
+    
+  </div>
+
+  Built with <a href="http://www.mkdocs.org">MkDocs</a> using a <a href="https://github.com/snide/sphinx_rtd_theme">theme</a> provided by <a href="https://readthedocs.org">Read the Docs</a>.
+</footer>
+      
+        </div>
+      </div>
+
+    </section>
+
+  </div>
+
+  <div class="rst-versions" role="note" style="cursor: pointer">
+    <span class="rst-current-version" data-toggle="rst-current-version">
+      
+      
+      
+    </span>
+</div>
+    <script>var base_url = '..';</script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
+
+</body>
+</html>
diff --git a/docs/app/index.html b/docs/app/index.html
index e627ea65..a09f6f5b 100644
--- a/docs/app/index.html
+++ b/docs/app/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "App";
     var mkdocs_page_input_path = "app.md";
-    var mkdocs_page_url = "/app/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,17 @@
               
                 <h1 id="app">App</h1>
 <p>(Contains a <code>tkinter.Tk</code> object)</p>
-<p><code>__init__(self, title="guizero", width=500, height=500, layout="auto", bgcolor=None, bg=None, visible=True)</code></p>
+<pre><code class="python">__init__(
+    self, 
+    title=&quot;guizero&quot;, 
+    width=500, 
+    height=500, 
+    layout=&quot;auto&quot;, 
+    bgcolor=None, 
+    bg=None, 
+    visible=True)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>App</code> object is the basis of all GUIs created using guizero. It is the main window which contains all of the other widgets.</p>
 <p><img alt="App" src="../images/app.png" /></p>
@@ -618,9 +629,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/blocking/index.html b/docs/blocking/index.html
index 7ee35b12..5ca68d04 100644
--- a/docs/blocking/index.html
+++ b/docs/blocking/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Loops and sleeping";
     var mkdocs_page_input_path = "blocking.md";
-    var mkdocs_page_url = "/blocking/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -232,7 +233,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -240,7 +241,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -355,9 +356,8 @@ <h3 id="solution">Solution</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/box/index.html b/docs/box/index.html
index 40dfbdc8..f11298cf 100644
--- a/docs/box/index.html
+++ b/docs/box/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Box";
     var mkdocs_page_input_path = "box.md";
-    var mkdocs_page_url = "/box/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,19 @@
               
                 <h1 id="box">Box</h1>
 <p>(Contains a <code>tkinter.Frame</code> object)</p>
-<p><code>__init__(self, master, layout="auto", grid=None, align=None, visible=True, enabled=None)</code></p>
+<pre><code class="python">__init__(
+    self,
+    master,
+    layout=&quot;auto&quot;,
+    grid=None,
+    align=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None,
+    border=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>Box</code> object is an invisible container which can contain other widgets. It is the only object other than <code>App</code> which can act as the <code>master</code> for other objects and can have its own layout manager.</p>
 <p>You can use the <code>Box</code> object to group other objects within your GUI.</p>
@@ -599,9 +612,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/buttongroup/index.html b/docs/buttongroup/index.html
index b5b82c7a..75659679 100644
--- a/docs/buttongroup/index.html
+++ b/docs/buttongroup/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "ButtonGroup";
     var mkdocs_page_input_path = "buttongroup.md";
-    var mkdocs_page_url = "/buttongroup/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,22 @@
               
                 <h1 id="buttongroup">ButtonGroup</h1>
 <p>(Contains a <code>tkinter.Frame</code> object)</p>
-<p><code>__init__(self, master, options=[], selected=None, horizontal=False, command=None, grid=None, align=None, args=None, visible=True, enabled=None)</code></p>
+<pre><code class="python">__init__(
+    self,
+    master,
+    options=[],
+    selected=None,
+    horizontal=False,
+    command=None,
+    grid=None,
+    align=None,
+    args=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>ButtonGroup</code> object displays a group of radio buttons, allowing the user to choose a single option.</p>
 <p><img alt="ButtonGroup" src="../images/buttongroup.png" /></p>
@@ -639,9 +655,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/changelog/index.html b/docs/changelog/index.html
index f88ac4ec..559acc5d 100644
--- a/docs/changelog/index.html
+++ b/docs/changelog/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Change log";
     var mkdocs_page_input_path = "changelog.md";
-    var mkdocs_page_url = "/changelog/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -212,6 +213,8 @@
     
         <ul>
         
+            <li><a class="toctree-l3" href="#064-2019-05-08">0.6.4 - 2019-05-08</a></li>
+        
             <li><a class="toctree-l3" href="#063-2019-04-18">0.6.3 - 2019-04-18</a></li>
         
             <li><a class="toctree-l3" href="#062-2019-04-05">0.6.2 - 2019-04-05</a></li>
@@ -256,7 +259,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -264,7 +267,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
     
@@ -279,6 +282,14 @@
             <div class="section">
               
                 <h1 id="guizero">guizero</h1>
+<h2 id="064-2019-05-08">0.6.4 - 2019-05-08</h2>
+<ul>
+<li>Fixed TextBox command to be on key release</li>
+<li>Fix Text not inheriting properties</li>
+<li>Added add_tk_warning when inserting a tk widget into the wrong container</li>
+<li>Update docs</li>
+<li>contributors <a href="https://github.com/martinohanlon">martinohanlon</a>, <a href="https://github.com/hyle01">hyle01</a> </li>
+</ul>
 <h2 id="063-2019-04-18">0.6.3 - 2019-04-18</h2>
 <ul>
 <li>ListBox scrollbar bug fix (again)</li>
@@ -289,7 +300,7 @@ <h2 id="063-2019-04-18">0.6.3 - 2019-04-18</h2>
 </ul>
 <h2 id="062-2019-04-05">0.6.2 - 2019-04-05</h2>
 <ul>
-<li>Ability to <a href="../usingtk/">add tk widgets</a> into a guizero app with <code>.add_tk_widget()</code></li>
+<li>Ability to <a href="./usingtk/">add tk widgets</a> into a guizero app with <code>.add_tk_widget()</code></li>
 <li>ListBox scrollbar bug fix</li>
 <li>MenuBar background colour bug fix</li>
 <li><code>setup.py</code> changes to allow dunders to be accessed from guizero module</li>
@@ -297,7 +308,7 @@ <h2 id="062-2019-04-05">0.6.2 - 2019-04-05</h2>
 </ul>
 <h2 id="061-2019-03-08">0.6.1 - 2019-03-08</h2>
 <ul>
-<li>New <a href="../drawing/">Drawing widget</a> for creating "drawings"</li>
+<li>New <a href="./drawing/">Drawing widget</a> for creating "drawings"</li>
 <li>Added full screen support for <code>App</code> and <code>Window</code></li>
 <li>Doc updates</li>
 <li>Minor bug fixes</li>
@@ -574,9 +585,8 @@ <h2 id="04-2017-12-19">0.4 - 2017-12-19</h2>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/checkbox/index.html b/docs/checkbox/index.html
index ecf57408..8d89b5bb 100644
--- a/docs/checkbox/index.html
+++ b/docs/checkbox/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "CheckBox";
     var mkdocs_page_input_path = "checkbox.md";
-    var mkdocs_page_url = "/checkbox/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,20 @@
               
                 <h1 id="checkbox">CheckBox</h1>
 <p>(Contains a <code>tkinter.Checkbutton</code> object)</p>
-<p><code>__init__(self, master, text, command=None, grid=None, align=None, args=None, visible=True, enabled=None)</code></p>
+<pre><code class="python">__init__(
+    self,
+    master,
+    text=&quot;&quot;,
+    command=None,
+    grid=None,
+    align=None,
+    args=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>CheckBox</code> object displays a check box to allow an option to be ticked or unticked</p>
 <p><img alt="Checkbox on Windows" src="../images/checkbox_windows.png" /></p>
@@ -633,9 +647,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/colors/index.html b/docs/colors/index.html
index b2709c85..5b8d748a 100644
--- a/docs/colors/index.html
+++ b/docs/colors/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Colors";
     var mkdocs_page_input_path = "colors.md";
-    var mkdocs_page_url = "/colors/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -234,7 +235,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -242,7 +243,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -358,9 +359,8 @@ <h3 id="rgb-list">rgb list</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/combo/index.html b/docs/combo/index.html
index 417703d1..f1155527 100644
--- a/docs/combo/index.html
+++ b/docs/combo/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Combo";
     var mkdocs_page_input_path = "combo.md";
-    var mkdocs_page_url = "/combo/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,20 @@
               
                 <h1 id="combo">Combo</h1>
 <p>(Contains a <code>tkinter.OptionMenu</code> object)</p>
-<p><code>__init__(self, master, options=[], selected=None, command=None, grid=None, align=None, visible=True, enabled=None)</code></p>
+<pre><code class="python">__init__(
+    self,
+    master,
+    options=[],
+    selected=None,
+    command=None,
+    grid=None,
+    align=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>Combo</code> object displays a drop down box allowing a single option to be selected from a list of options.</p>
 <p><img alt="Combo on Windows" src="../images/combo_windows.png" /></p>
@@ -631,9 +645,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/commands/index.html b/docs/commands/index.html
index 8de3fc0c..edf90629 100644
--- a/docs/commands/index.html
+++ b/docs/commands/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Commands";
     var mkdocs_page_input_path = "commands.md";
-    var mkdocs_page_url = "/commands/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -230,7 +231,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -238,7 +239,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -315,9 +316,8 @@ <h3 id="example">Example</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/contributing/index.html b/docs/contributing/index.html
index be8027e2..2430db97 100644
--- a/docs/contributing/index.html
+++ b/docs/contributing/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Notes";
     var mkdocs_page_input_path = "contributing.md";
-    var mkdocs_page_url = "/contributing/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -232,7 +233,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -240,7 +241,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -315,9 +316,8 @@ <h2 id="code">Code</h2>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/css/theme_extra.css b/docs/css/theme_extra.css
index cf8123e3..ab107ba6 100644
--- a/docs/css/theme_extra.css
+++ b/docs/css/theme_extra.css
@@ -128,8 +128,11 @@ pre .cs, pre .c {
  * Additions specific to the search functionality provided by MkDocs
  */
 
-.search-results article {
+.search-results {
     margin-top: 23px;
+}
+
+.search-results article {
     border-top: 1px solid #E1E4E5;
     padding-top: 24px;
 }
diff --git a/docs/deployment/index.html b/docs/deployment/index.html
index b9a5cb85..3a9dcd2e 100644
--- a/docs/deployment/index.html
+++ b/docs/deployment/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Deploying";
     var mkdocs_page_input_path = "deployment.md";
-    var mkdocs_page_url = "/deployment/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -236,7 +237,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -244,7 +245,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -345,9 +346,8 @@ <h2 id="promote-and-tag-release-on-github">Promote and tag release on github</h2
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/development/index.html b/docs/development/index.html
index 8c63a3d3..2d619f2e 100644
--- a/docs/development/index.html
+++ b/docs/development/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Developing";
     var mkdocs_page_input_path = "development.md";
-    var mkdocs_page_url = "/development/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -236,7 +237,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -244,7 +245,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -356,9 +357,8 @@ <h2 id="documents">Documents</h2>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/drawing/index.html b/docs/drawing/index.html
index 323364b8..36990c6e 100644
--- a/docs/drawing/index.html
+++ b/docs/drawing/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Drawing";
     var mkdocs_page_input_path = "drawing.md";
-    var mkdocs_page_url = "/drawing/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,17 @@
               
                 <h1 id="drawing">Drawing</h1>
 <p>(Contains a <code>tkinter.canvas</code> object)</p>
-<p><code>__init__(self, master, width=100, height=100, grid=None, align=None, visible=True, enabled=None):</code></p>
+<pre><code class="python">__init__(
+    self, 
+    master, 
+    width=100, 
+    height=100, 
+    grid=None, 
+    align=None, 
+    visible=True, 
+    enabled=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>Drawing</code> object allows shapes, images and text to be created.</p>
 <p><img alt="Drawing on Windows" src="../images/drawing_windows.png" /></p>
@@ -599,9 +610,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/events/index.html b/docs/events/index.html
index 4afafb2e..533492fa 100644
--- a/docs/events/index.html
+++ b/docs/events/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Events";
     var mkdocs_page_input_path = "events.md";
-    var mkdocs_page_url = "/events/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -232,7 +233,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -240,7 +241,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -363,9 +364,8 @@ <h3 id="example">Example</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/gettinghelp/index.html b/docs/gettinghelp/index.html
index 32482d17..89404b58 100644
--- a/docs/gettinghelp/index.html
+++ b/docs/gettinghelp/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Getting help";
     var mkdocs_page_input_path = "gettinghelp.md";
-    var mkdocs_page_url = "/gettinghelp/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -232,7 +233,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -240,7 +241,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -339,9 +340,8 @@ <h3 id="bugs-and-feature-requests">Bugs and feature requests</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/images/index.html b/docs/images/index.html
index 11b4913c..978a16c9 100644
--- a/docs/images/index.html
+++ b/docs/images/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Images";
     var mkdocs_page_input_path = "images.md";
-    var mkdocs_page_url = "/images/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -234,7 +235,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -242,7 +243,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -357,9 +358,8 @@ <h3 id="animated-gifs">Animated GIFs</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/index.html b/docs/index.html
index 8cc44dc0..feb6079a 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -7,24 +7,25 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta name="description" content="None">
   
-  <link rel="shortcut icon" href="./img/favicon.ico">
+  <link rel="shortcut icon" href="img/favicon.ico">
   <title>Installation - guizero</title>
   <link href='https://fonts.googleapis.com/css?family=Lato:400,700|Roboto+Slab:400,700|Inconsolata:400,700' rel='stylesheet' type='text/css'>
 
-  <link rel="stylesheet" href="./css/theme.css" type="text/css" />
-  <link rel="stylesheet" href="./css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="./css/highlight.css">
+  <link rel="stylesheet" href="css/theme.css" type="text/css" />
+  <link rel="stylesheet" href="css/theme_extra.css" type="text/css" />
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Installation";
     var mkdocs_page_input_path = "index.md";
-    var mkdocs_page_url = "/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="./js/jquery-2.1.1.min.js"></script>
-  <script src="./js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="./js/highlight.pack.js"></script> 
+  <script src="js/jquery-2.1.1.min.js" defer></script>
+  <script src="js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="about/" class="icon icon-home"> guizero</a>
+        <a href="." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="./search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -232,7 +233,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="about/">guizero</a>
+        <a href=".">guizero</a>
       </nav>
 
       
@@ -240,7 +241,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="about/">Docs</a> &raquo;</li>
+    <li><a href=".">Docs</a> &raquo;</li>
     
       
     
@@ -265,7 +266,7 @@ <h2 id="easy-install">Easy install</h2>
 </li>
 <li>
 <p>Click the green "Clone or download" button and then "Download ZIP"</p>
-<p><img alt="Download the zip" src="./images/download-zip.png" /></p>
+<p><img alt="Download the zip" src="images/download-zip.png" /></p>
 </li>
 <li>
 <p>Open the zip file</p>
@@ -275,11 +276,11 @@ <h2 id="easy-install">Easy install</h2>
 <ul>
 <li>
 <p>Windows</p>
-<p><img alt="Copy the guizero folder in windows" src="./images/copy-guizero-annotated.png" /></p>
+<p><img alt="Copy the guizero folder in windows" src="images/copy-guizero-annotated.png" /></p>
 </li>
 <li>
 <p>macOS</p>
-<p><img alt="Copy the guizero folder in macos" src="./images/copy-guizero-macos-annotated.png" /></p>
+<p><img alt="Copy the guizero folder in macos" src="images/copy-guizero-macos-annotated.png" /></p>
 </li>
 </ul>
 </li>
@@ -300,37 +301,37 @@ <h3 id="windows">Windows</h3>
 <ol>
 <li>
 <p>Open a command prompt by clicking <strong>Start</strong> &gt; <strong>Windows System</strong> &gt; <strong>Command Prompt</strong>, or by typing 'command' into the start menu's search bar.</p>
-<p><img alt="windows command prompt" src="./images/windows_command_prompt_app.png" /></p>
+<p><img alt="windows command prompt" src="images/windows_command_prompt_app.png" /></p>
 </li>
 <li>
 <p>Type this command and press enter:</p>
 <p><code>pip3 install guizero</code></p>
 </li>
 </ol>
-<p><img alt="windows pip install" src="./images/windows_pip_install.gif" /></p>
+<p><img alt="windows pip install" src="images/windows_pip_install.gif" /></p>
 <p>If you experience problems, have a look at this guide to <a href="https://projects.raspberrypi.org/en/projects/using-pip-on-windows"><em>Using pip on Windows</em></a>.</p>
 <h3 id="macos">macOS</h3>
 <ol>
 <li>
 <p>Open a terminal window by clicking <strong>Applications</strong> &gt; <strong>Utilities</strong> &gt; <strong>Terminal</strong>, or by typing 'terminal' into the desktop's search bar.</p>
-<p><img alt="Mac terminal" src="./images/mac-terminal.png" /></p>
+<p><img alt="Mac terminal" src="images/mac-terminal.png" /></p>
 </li>
 <li>
 <p>Type this command and press enter:</p>
 <p><code>pip3 install guizero</code></p>
-<p><img alt="mac pip install" src="./images/mac_pip_install.gif" /></p>
+<p><img alt="mac pip install" src="images/mac_pip_install.gif" /></p>
 </li>
 </ol>
 <h3 id="raspberry-pi">Raspberry Pi</h3>
 <ol>
 <li>
 <p>Open a terminal window by clicking <strong>Menu</strong> &gt; <strong>Accessories</strong> &gt; <strong>Terminal</strong>.</p>
-<p><img alt="pi terminal" src="./images/pi-terminal.png" /></p>
+<p><img alt="pi terminal" src="images/pi-terminal.png" /></p>
 </li>
 <li>
 <p>Type this command and press enter:</p>
 <p><code>sudo pip3 install guizero</code></p>
-<p><img alt="run pip install guizero" src="./images/pi_pip_install.gif" /></p>
+<p><img alt="run pip install guizero" src="images/pi_pip_install.gif" /></p>
 </li>
 </ol>
 <h3 id="linux">Linux</h3>
@@ -339,7 +340,7 @@ <h3 id="linux">Linux</h3>
 <li>Install <code>tkinter</code> using your distribution's package manager, e.g. <code>sudo apt install python3-tk</code></li>
 <li>
 <p>Install guizero using pip by typing <code>pip3 install guizero</code> or <code>sudo pip3 install guizero</code> if you dont have superuser rights</p>
-<p><img alt="linux pip install" src="./images/linux_pip_install.gif" /></p>
+<p><img alt="linux pip install" src="images/linux_pip_install.gif" /></p>
 </li>
 </ol>
 <h3 id="additional-features-install">Additional features install</h3>
@@ -416,14 +417,13 @@ <h3 id="upgrading">Upgrading</h3>
     </span>
 </div>
     <script>var base_url = '.';</script>
-    <script src="./js/theme.js"></script>
-      <script src="./search/require.js"></script>
-      <script src="./search/search.js"></script>
+    <script src="js/theme.js" defer></script>
+      <script src="search/main.js" defer></script>
 
 </body>
 </html>
 
 <!--
-MkDocs version : 0.17.2
-Build Date UTC : 2019-04-18 07:18:49
+MkDocs version : 1.0.4
+Build Date UTC : 2019-05-08 11:29:41
 -->
diff --git a/docs/js/theme.js b/docs/js/theme.js
index dda9975e..aecbb861 100644
--- a/docs/js/theme.js
+++ b/docs/js/theme.js
@@ -13,19 +13,27 @@ $( document ).ready(function() {
 
     // Keyboard navigation
     document.addEventListener("keydown", function(e) {
-        if ($(e.target).is(':input')) return true;
-        var key = e.which || e.keyCode || window.event && window.event.keyCode;
-        var page;
-        switch (key) {
-            case 39:  // right arrow
-                page = $('[role="navigation"] a:contains(Next):first').prop('href');
-                break;
-            case 37:  // left arrow
-                page = $('[role="navigation"] a:contains(Previous):first').prop('href');
-                break;
-            default: break;
-        }
-        if (page) window.location.href = page;
+      var key = e.which || e.keyCode || window.event && window.event.keyCode;
+      var page;
+      switch (key) {
+          case 78:  // n
+              page = $('[role="navigation"] a:contains(Next):first').prop('href');
+              break;
+          case 80:  // p
+              page = $('[role="navigation"] a:contains(Previous):first').prop('href');
+              break;
+          case 13:  // enter
+              if (e.target === document.getElementById('mkdocs-search-query')) {
+                e.preventDefault();
+              }
+              break;
+          default: break;
+      }
+      if ($(e.target).is(':input')) {
+        return true;
+      } else if (page) {
+        window.location.href = page;
+      }
     });
 
     $(document).on('click', "[data-toggle='rst-current-version']", function() {
@@ -35,8 +43,6 @@ $( document ).ready(function() {
     // Make tables responsive
     $("table.docutils:not(.field-list)").wrap("<div class='wy-table-responsive'></div>");
 
-    hljs.initHighlightingOnLoad();
-
     $('table').addClass('docutils');
 });
 
diff --git a/docs/layout/index.html b/docs/layout/index.html
index ded3ef82..8ede1d82 100644
--- a/docs/layout/index.html
+++ b/docs/layout/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Layouts";
     var mkdocs_page_input_path = "layout.md";
-    var mkdocs_page_url = "/layout/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -246,7 +247,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -254,7 +255,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -501,9 +502,8 @@ <h2 id="boxes">Boxes</h2>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/listbox/index.html b/docs/listbox/index.html
index 072c9dc2..d8a49ab7 100644
--- a/docs/listbox/index.html
+++ b/docs/listbox/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "ListBox";
     var mkdocs_page_input_path = "listbox.md";
-    var mkdocs_page_url = "/listbox/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,22 @@
               
                 <h1 id="listbox">ListBox</h1>
 <p>(Contains a <code>tkinter.Listbox</code> object)</p>
-<p><code>__init__(self, master, items=None, selected=None, command=None, grid=None, align=None, visible=True, enabled=None, multiselect=False, scrollbar=False)</code></p>
+<pre><code class="python">__init__(
+    self,
+    master,
+    items=None,
+    selected=None,
+    command=None,
+    grid=None,
+    align=None,
+    visible=True,
+    enabled=None,
+    multiselect=False,
+    scrollbar=False,
+    width=None,
+    height=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>ListBox</code> object displays a list of items from which either single or multiple items can be selected.</p>
 <p><img alt="ListBox on Windows" src="../images/listbox_windows.png" /></p>
@@ -631,9 +647,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/menubar/index.html b/docs/menubar/index.html
index 1241a798..d7deeb66 100644
--- a/docs/menubar/index.html
+++ b/docs/menubar/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "MenuBar";
     var mkdocs_page_input_path = "menubar.md";
-    var mkdocs_page_url = "/menubar/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -238,7 +239,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -246,7 +247,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -266,7 +267,13 @@
               
                 <h1 id="menubar">MenuBar</h1>
 <p>(Contains a <code>tkinter.Menu</code> object)</p>
-<p><code>__init__(self, master, toplevel, options)</code></p>
+<pre><code class="python">__init__(
+    self, 
+    master, 
+    toplevel, 
+    options)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>MenuBar</code> object displays a menu at the top of the screen, with each menu option leading to a submenu.</p>
 <p><img alt="MenuBar on Windows" src="../images/menubar_windows.png" /></p>
@@ -439,9 +446,8 @@ <h3 id="properties">Properties</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/multiple_windows/index.html b/docs/multiple_windows/index.html
index 975d1757..476f71c3 100644
--- a/docs/multiple_windows/index.html
+++ b/docs/multiple_windows/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Multiple windows";
     var mkdocs_page_input_path = "multiple_windows.md";
-    var mkdocs_page_url = "/multiple_windows/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -234,7 +235,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -242,7 +243,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -288,7 +289,7 @@ <h3 id="a-2nd-window">A 2nd Window</h3>
 <h3 id="opening-and-closing-windows">Opening and closing windows</h3>
 <p>When a <code>Window</code> object is created it is immediately displayed on the screen, you can control it using the <code>show()</code> and <code>hide()</code> methods.</p>
 <p>To make a window which is shown when a button on the <code>App</code> is clicked and closed when a button is clicked on the <code>Window</code>.</p>
-<pre><code class="python">from guizero import App, Window
+<pre><code class="python">from guizero import App, Window, PushButton
 
 def open_window():
     window.show()
@@ -358,9 +359,8 @@ <h3 id="modal-windows">Modal windows</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/picture/index.html b/docs/picture/index.html
index 7ddd0f3a..6b1ecc02 100644
--- a/docs/picture/index.html
+++ b/docs/picture/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Picture";
     var mkdocs_page_input_path = "picture.md";
-    var mkdocs_page_url = "/picture/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,18 @@
               
                 <h1 id="picture">Picture</h1>
 <p>(Contains a <code>tkinter.Label</code> object)</p>
-<p><code>__init__(self, master, image=None, grid=None, align=None, visible=True, enabled=None)</code></p>
+<pre><code class="python">__init__(
+    self, 
+    master, 
+    image=None, 
+    grid=None, 
+    align=None, 
+    visible=True, 
+    enabled=None, 
+    width=None, 
+    height=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>Picture</code> object displays an image.</p>
 <p><img alt="Picture on Windows" src="../images/picture_windows.png" /></p>
@@ -548,9 +560,8 @@ <h3 id="properties">Properties</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/pushbutton/index.html b/docs/pushbutton/index.html
index a2c8ef27..3958a170 100644
--- a/docs/pushbutton/index.html
+++ b/docs/pushbutton/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "PushButton";
     var mkdocs_page_input_path = "pushbutton.md";
-    var mkdocs_page_url = "/pushbutton/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -238,7 +239,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -246,7 +247,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -266,7 +267,24 @@
               
                 <h1 id="pushbutton">PushButton</h1>
 <p>(Contains a <code>tkinter.Button</code> object)</p>
-<p><code>__init__(self, master, command=None, args=None, text="Button", image=None, pady=10, padx=10, grid=None, align=None, visible=True, enabled=None)</code></p>
+<pre><code class="python">__init__(
+    self,
+    master,
+    command=None,
+    args=None,
+    text=&quot;Button&quot;,
+    image=None,
+    pady=10,
+    padx=10,
+    grid=None,
+    align=None,
+    icon=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>PushButton</code> object displays a button with text or an image, which calls a function when pressed.</p>
 <p><img alt="PushButton on Windows" src="../images/pushbutton_windows.png" /></p>
@@ -274,7 +292,7 @@ <h3 id="how-do-i-make-one">How do I make one?</h3>
 <p>Create a <code>PushButton</code> object like this:</p>
 <pre><code class="python">from guizero import App, PushButton
 def do_nothing():
-  print(&quot;Button was pressed&quot;)
+    print(&quot;Button was pressed&quot;)
 
 app = App()
 button = PushButton(app, command=do_nothing)
@@ -284,7 +302,7 @@ <h3 id="how-do-i-make-one">How do I make one?</h3>
 <p>Create a picture <code>PushButton</code> with an image like this:</p>
 <pre><code class="python">from guizero import App, PushButton
 def do_nothing():
-  print(&quot;A picture button was pressed&quot;)
+    print(&quot;A picture button was pressed&quot;)
 
 app = App()
 button = PushButton(app, image=&quot;button.gif&quot;, command=do_nothing)
@@ -645,9 +663,8 @@ <h3 id="properties">Properties</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/recipes/index.html b/docs/recipes/index.html
index 647a6453..0dfe32d9 100644
--- a/docs/recipes/index.html
+++ b/docs/recipes/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Recipes";
     var mkdocs_page_input_path = "recipes.md";
-    var mkdocs_page_url = "/recipes/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -242,7 +243,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -250,7 +251,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
     
@@ -416,9 +417,8 @@ <h2 id="scale-an-image">Scale an image</h2>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/search.html b/docs/search.html
index 9bfffe23..e7258ed7 100644
--- a/docs/search.html
+++ b/docs/search.html
@@ -13,11 +13,12 @@
 
   <link rel="stylesheet" href="./css/theme.css" type="text/css" />
   <link rel="stylesheet" href="./css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="./css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
-  <script src="./js/jquery-2.1.1.min.js"></script>
-  <script src="./js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="./js/highlight.pack.js"></script> 
+  <script src="./js/jquery-2.1.1.min.js" defer></script>
+  <script src="./js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -28,10 +29,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="about/" class="icon icon-home"> guizero</a>
+        <a href="./." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="./search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -42,12 +43,12 @@
           
             <li class="toctree-l1">
 		
-    <a class="" href="about/">About</a>
+    <a class="" href="./about/">About</a>
 	    </li>
           
             <li class="toctree-l1">
 		
-    <a class="" href=".">Installation</a>
+    <a class="" href="./.">Installation</a>
 	    </li>
           
             <li class="toctree-l1">
@@ -56,58 +57,58 @@
     <ul class="subnav">
                 <li class="">
                     
-    <a class="" href="start/">Getting started</a>
+    <a class="" href="./start/">Getting started</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="commands/">Commands</a>
+    <a class="" href="./commands/">Commands</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="multiple_windows/">Multiple windows</a>
+    <a class="" href="./multiple_windows/">Multiple windows</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="layout/">Layouts</a>
+    <a class="" href="./layout/">Layouts</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="alerts/">Alerts</a>
+    <a class="" href="./alerts/">Alerts</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="size/">Sizes</a>
+    <a class="" href="./size/">Sizes</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="colors/">Colors</a>
+    <a class="" href="./colors/">Colors</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="images/">Images</a>
+    <a class="" href="./images/">Images</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="blocking/">Loops and sleeping</a>
+    <a class="" href="./blocking/">Loops and sleeping</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="events/">Events</a>
+    <a class="" href="./events/">Events</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="usingtk/">Using tkinter</a>
+    <a class="" href="./usingtk/">Using tkinter</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="gettinghelp/">Getting help</a>
+    <a class="" href="./gettinghelp/">Getting help</a>
                 </li>
     </ul>
 	    </li>
           
             <li class="toctree-l1">
 		
-    <a class="" href="recipes/">Recipes</a>
+    <a class="" href="./recipes/">Recipes</a>
 	    </li>
           
             <li class="toctree-l1">
@@ -116,63 +117,63 @@
     <ul class="subnav">
                 <li class="">
                     
-    <a class="" href="app/">App</a>
+    <a class="" href="./app/">App</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="box/">Box</a>
+    <a class="" href="./box/">Box</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="buttongroup/">ButtonGroup</a>
+    <a class="" href="./buttongroup/">ButtonGroup</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="checkbox/">CheckBox</a>
+    <a class="" href="./checkbox/">CheckBox</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="combo/">Combo</a>
+    <a class="" href="./combo/">Combo</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="drawing/">Drawing</a>
+    <a class="" href="./drawing/">Drawing</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="listbox/">ListBox</a>
+    <a class="" href="./listbox/">ListBox</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="menubar/">MenuBar</a>
+    <a class="" href="./menubar/">MenuBar</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="picture/">Picture</a>
+    <a class="" href="./picture/">Picture</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="pushbutton/">PushButton</a>
+    <a class="" href="./pushbutton/">PushButton</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="slider/">Slider</a>
+    <a class="" href="./slider/">Slider</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="text/">Text</a>
+    <a class="" href="./text/">Text</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="textbox/">TextBox</a>
+    <a class="" href="./textbox/">TextBox</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="waffle/">Waffle</a>
+    <a class="" href="./waffle/">Waffle</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="window/">Window</a>
+    <a class="" href="./window/">Window</a>
                 </li>
     </ul>
 	    </li>
@@ -183,22 +184,22 @@
     <ul class="subnav">
                 <li class="">
                     
-    <a class="" href="contributing/">Notes</a>
+    <a class="" href="./contributing/">Notes</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="development/">Developing</a>
+    <a class="" href="./development/">Developing</a>
                 </li>
                 <li class="">
                     
-    <a class="" href="deployment/">Deploying</a>
+    <a class="" href="./deployment/">Deploying</a>
                 </li>
     </ul>
 	    </li>
           
             <li class="toctree-l1">
 		
-    <a class="" href="changelog/">Change log</a>
+    <a class="" href="./changelog/">Change log</a>
 	    </li>
           
         </ul>
@@ -211,7 +212,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="about/">guizero</a>
+        <a href="./.">guizero</a>
       </nav>
 
       
@@ -219,7 +220,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="about/">Docs</a> &raquo;</li>
+    <li><a href="./.">Docs</a> &raquo;</li>
     
     
     <li class="wy-breadcrumbs-aside">
@@ -236,7 +237,7 @@ <h1 id="search">Search Results</h1>
 
   <form id="content_search" action="search.html">
     <span role="status" aria-live="polite" class="ui-helper-hidden-accessible"></span>
-    <input name="q" id="mkdocs-search-query" type="text" class="search_input search-query ui-autocomplete-input" placeholder="Search the Docs" autocomplete="off" autofocus>
+    <input name="q" id="mkdocs-search-query" type="text" class="search_input search-query ui-autocomplete-input" placeholder="Search the Docs" autocomplete="off" autofocus title="Type search term here">
   </form>
 
   <div id="mkdocs-search-results" class="search-results">
@@ -274,9 +275,8 @@ <h1 id="search">Search Results</h1>
     </span>
 </div>
     <script>var base_url = '.';</script>
-    <script src="./js/theme.js"></script>
-      <script src="./search/require.js"></script>
-      <script src="./search/search.js"></script>
+    <script src="./js/theme.js" defer></script>
+      <script src="./search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/search/lunr.js b/docs/search/lunr.js
new file mode 100644
index 00000000..c218cc89
--- /dev/null
+++ b/docs/search/lunr.js
@@ -0,0 +1,2986 @@
+/**
+ * lunr - http://lunrjs.com - A bit like Solr, but much smaller and not as bright - 2.1.6
+ * Copyright (C) 2018 Oliver Nightingale
+ * @license MIT
+ */
+
+;(function(){
+
+/**
+ * A convenience function for configuring and constructing
+ * a new lunr Index.
+ *
+ * A lunr.Builder instance is created and the pipeline setup
+ * with a trimmer, stop word filter and stemmer.
+ *
+ * This builder object is yielded to the configuration function
+ * that is passed as a parameter, allowing the list of fields
+ * and other builder parameters to be customised.
+ *
+ * All documents _must_ be added within the passed config function.
+ *
+ * @example
+ * var idx = lunr(function () {
+ *   this.field('title')
+ *   this.field('body')
+ *   this.ref('id')
+ *
+ *   documents.forEach(function (doc) {
+ *     this.add(doc)
+ *   }, this)
+ * })
+ *
+ * @see {@link lunr.Builder}
+ * @see {@link lunr.Pipeline}
+ * @see {@link lunr.trimmer}
+ * @see {@link lunr.stopWordFilter}
+ * @see {@link lunr.stemmer}
+ * @namespace {function} lunr
+ */
+var lunr = function (config) {
+  var builder = new lunr.Builder
+
+  builder.pipeline.add(
+    lunr.trimmer,
+    lunr.stopWordFilter,
+    lunr.stemmer
+  )
+
+  builder.searchPipeline.add(
+    lunr.stemmer
+  )
+
+  config.call(builder, builder)
+  return builder.build()
+}
+
+lunr.version = "2.1.6"
+/*!
+ * lunr.utils
+ * Copyright (C) 2018 Oliver Nightingale
+ */
+
+/**
+ * A namespace containing utils for the rest of the lunr library
+ */
+lunr.utils = {}
+
+/**
+ * Print a warning message to the console.
+ *
+ * @param {String} message The message to be printed.
+ * @memberOf Utils
+ */
+lunr.utils.warn = (function (global) {
+  /* eslint-disable no-console */
+  return function (message) {
+    if (global.console && console.warn) {
+      console.warn(message)
+    }
+  }
+  /* eslint-enable no-console */
+})(this)
+
+/**
+ * Convert an object to a string.
+ *
+ * In the case of `null` and `undefined` the function returns
+ * the empty string, in all other cases the result of calling
+ * `toString` on the passed object is returned.
+ *
+ * @param {Any} obj The object to convert to a string.
+ * @return {String} string representation of the passed object.
+ * @memberOf Utils
+ */
+lunr.utils.asString = function (obj) {
+  if (obj === void 0 || obj === null) {
+    return ""
+  } else {
+    return obj.toString()
+  }
+}
+lunr.FieldRef = function (docRef, fieldName, stringValue) {
+  this.docRef = docRef
+  this.fieldName = fieldName
+  this._stringValue = stringValue
+}
+
+lunr.FieldRef.joiner = "/"
+
+lunr.FieldRef.fromString = function (s) {
+  var n = s.indexOf(lunr.FieldRef.joiner)
+
+  if (n === -1) {
+    throw "malformed field ref string"
+  }
+
+  var fieldRef = s.slice(0, n),
+      docRef = s.slice(n + 1)
+
+  return new lunr.FieldRef (docRef, fieldRef, s)
+}
+
+lunr.FieldRef.prototype.toString = function () {
+  if (this._stringValue == undefined) {
+    this._stringValue = this.fieldName + lunr.FieldRef.joiner + this.docRef
+  }
+
+  return this._stringValue
+}
+/**
+ * A function to calculate the inverse document frequency for
+ * a posting. This is shared between the builder and the index
+ *
+ * @private
+ * @param {object} posting - The posting for a given term
+ * @param {number} documentCount - The total number of documents.
+ */
+lunr.idf = function (posting, documentCount) {
+  var documentsWithTerm = 0
+
+  for (var fieldName in posting) {
+    if (fieldName == '_index') continue // Ignore the term index, its not a field
+    documentsWithTerm += Object.keys(posting[fieldName]).length
+  }
+
+  var x = (documentCount - documentsWithTerm + 0.5) / (documentsWithTerm + 0.5)
+
+  return Math.log(1 + Math.abs(x))
+}
+
+/**
+ * A token wraps a string representation of a token
+ * as it is passed through the text processing pipeline.
+ *
+ * @constructor
+ * @param {string} [str=''] - The string token being wrapped.
+ * @param {object} [metadata={}] - Metadata associated with this token.
+ */
+lunr.Token = function (str, metadata) {
+  this.str = str || ""
+  this.metadata = metadata || {}
+}
+
+/**
+ * Returns the token string that is being wrapped by this object.
+ *
+ * @returns {string}
+ */
+lunr.Token.prototype.toString = function () {
+  return this.str
+}
+
+/**
+ * A token update function is used when updating or optionally
+ * when cloning a token.
+ *
+ * @callback lunr.Token~updateFunction
+ * @param {string} str - The string representation of the token.
+ * @param {Object} metadata - All metadata associated with this token.
+ */
+
+/**
+ * Applies the given function to the wrapped string token.
+ *
+ * @example
+ * token.update(function (str, metadata) {
+ *   return str.toUpperCase()
+ * })
+ *
+ * @param {lunr.Token~updateFunction} fn - A function to apply to the token string.
+ * @returns {lunr.Token}
+ */
+lunr.Token.prototype.update = function (fn) {
+  this.str = fn(this.str, this.metadata)
+  return this
+}
+
+/**
+ * Creates a clone of this token. Optionally a function can be
+ * applied to the cloned token.
+ *
+ * @param {lunr.Token~updateFunction} [fn] - An optional function to apply to the cloned token.
+ * @returns {lunr.Token}
+ */
+lunr.Token.prototype.clone = function (fn) {
+  fn = fn || function (s) { return s }
+  return new lunr.Token (fn(this.str, this.metadata), this.metadata)
+}
+/*!
+ * lunr.tokenizer
+ * Copyright (C) 2018 Oliver Nightingale
+ */
+
+/**
+ * A function for splitting a string into tokens ready to be inserted into
+ * the search index. Uses `lunr.tokenizer.separator` to split strings, change
+ * the value of this property to change how strings are split into tokens.
+ *
+ * This tokenizer will convert its parameter to a string by calling `toString` and
+ * then will split this string on the character in `lunr.tokenizer.separator`.
+ * Arrays will have their elements converted to strings and wrapped in a lunr.Token.
+ *
+ * @static
+ * @param {?(string|object|object[])} obj - The object to convert into tokens
+ * @returns {lunr.Token[]}
+ */
+lunr.tokenizer = function (obj) {
+  if (obj == null || obj == undefined) {
+    return []
+  }
+
+  if (Array.isArray(obj)) {
+    return obj.map(function (t) {
+      return new lunr.Token(lunr.utils.asString(t).toLowerCase())
+    })
+  }
+
+  var str = obj.toString().trim().toLowerCase(),
+      len = str.length,
+      tokens = []
+
+  for (var sliceEnd = 0, sliceStart = 0; sliceEnd <= len; sliceEnd++) {
+    var char = str.charAt(sliceEnd),
+        sliceLength = sliceEnd - sliceStart
+
+    if ((char.match(lunr.tokenizer.separator) || sliceEnd == len)) {
+
+      if (sliceLength > 0) {
+        tokens.push(
+          new lunr.Token (str.slice(sliceStart, sliceEnd), {
+            position: [sliceStart, sliceLength],
+            index: tokens.length
+          })
+        )
+      }
+
+      sliceStart = sliceEnd + 1
+    }
+
+  }
+
+  return tokens
+}
+
+/**
+ * The separator used to split a string into tokens. Override this property to change the behaviour of
+ * `lunr.tokenizer` behaviour when tokenizing strings. By default this splits on whitespace and hyphens.
+ *
+ * @static
+ * @see lunr.tokenizer
+ */
+lunr.tokenizer.separator = /[\s\-]+/
+/*!
+ * lunr.Pipeline
+ * Copyright (C) 2018 Oliver Nightingale
+ */
+
+/**
+ * lunr.Pipelines maintain an ordered list of functions to be applied to all
+ * tokens in documents entering the search index and queries being ran against
+ * the index.
+ *
+ * An instance of lunr.Index created with the lunr shortcut will contain a
+ * pipeline with a stop word filter and an English language stemmer. Extra
+ * functions can be added before or after either of these functions or these
+ * default functions can be removed.
+ *
+ * When run the pipeline will call each function in turn, passing a token, the
+ * index of that token in the original list of all tokens and finally a list of
+ * all the original tokens.
+ *
+ * The output of functions in the pipeline will be passed to the next function
+ * in the pipeline. To exclude a token from entering the index the function
+ * should return undefined, the rest of the pipeline will not be called with
+ * this token.
+ *
+ * For serialisation of pipelines to work, all functions used in an instance of
+ * a pipeline should be registered with lunr.Pipeline. Registered functions can
+ * then be loaded. If trying to load a serialised pipeline that uses functions
+ * that are not registered an error will be thrown.
+ *
+ * If not planning on serialising the pipeline then registering pipeline functions
+ * is not necessary.
+ *
+ * @constructor
+ */
+lunr.Pipeline = function () {
+  this._stack = []
+}
+
+lunr.Pipeline.registeredFunctions = Object.create(null)
+
+/**
+ * A pipeline function maps lunr.Token to lunr.Token. A lunr.Token contains the token
+ * string as well as all known metadata. A pipeline function can mutate the token string
+ * or mutate (or add) metadata for a given token.
+ *
+ * A pipeline function can indicate that the passed token should be discarded by returning
+ * null. This token will not be passed to any downstream pipeline functions and will not be
+ * added to the index.
+ *
+ * Multiple tokens can be returned by returning an array of tokens. Each token will be passed
+ * to any downstream pipeline functions and all will returned tokens will be added to the index.
+ *
+ * Any number of pipeline functions may be chained together using a lunr.Pipeline.
+ *
+ * @interface lunr.PipelineFunction
+ * @param {lunr.Token} token - A token from the document being processed.
+ * @param {number} i - The index of this token in the complete list of tokens for this document/field.
+ * @param {lunr.Token[]} tokens - All tokens for this document/field.
+ * @returns {(?lunr.Token|lunr.Token[])}
+ */
+
+/**
+ * Register a function with the pipeline.
+ *
+ * Functions that are used in the pipeline should be registered if the pipeline
+ * needs to be serialised, or a serialised pipeline needs to be loaded.
+ *
+ * Registering a function does not add it to a pipeline, functions must still be
+ * added to instances of the pipeline for them to be used when running a pipeline.
+ *
+ * @param {lunr.PipelineFunction} fn - The function to check for.
+ * @param {String} label - The label to register this function with
+ */
+lunr.Pipeline.registerFunction = function (fn, label) {
+  if (label in this.registeredFunctions) {
+    lunr.utils.warn('Overwriting existing registered function: ' + label)
+  }
+
+  fn.label = label
+  lunr.Pipeline.registeredFunctions[fn.label] = fn
+}
+
+/**
+ * Warns if the function is not registered as a Pipeline function.
+ *
+ * @param {lunr.PipelineFunction} fn - The function to check for.
+ * @private
+ */
+lunr.Pipeline.warnIfFunctionNotRegistered = function (fn) {
+  var isRegistered = fn.label && (fn.label in this.registeredFunctions)
+
+  if (!isRegistered) {
+    lunr.utils.warn('Function is not registered with pipeline. This may cause problems when serialising the index.\n', fn)
+  }
+}
+
+/**
+ * Loads a previously serialised pipeline.
+ *
+ * All functions to be loaded must already be registered with lunr.Pipeline.
+ * If any function from the serialised data has not been registered then an
+ * error will be thrown.
+ *
+ * @param {Object} serialised - The serialised pipeline to load.
+ * @returns {lunr.Pipeline}
+ */
+lunr.Pipeline.load = function (serialised) {
+  var pipeline = new lunr.Pipeline
+
+  serialised.forEach(function (fnName) {
+    var fn = lunr.Pipeline.registeredFunctions[fnName]
+
+    if (fn) {
+      pipeline.add(fn)
+    } else {
+      throw new Error('Cannot load unregistered function: ' + fnName)
+    }
+  })
+
+  return pipeline
+}
+
+/**
+ * Adds new functions to the end of the pipeline.
+ *
+ * Logs a warning if the function has not been registered.
+ *
+ * @param {lunr.PipelineFunction[]} functions - Any number of functions to add to the pipeline.
+ */
+lunr.Pipeline.prototype.add = function () {
+  var fns = Array.prototype.slice.call(arguments)
+
+  fns.forEach(function (fn) {
+    lunr.Pipeline.warnIfFunctionNotRegistered(fn)
+    this._stack.push(fn)
+  }, this)
+}
+
+/**
+ * Adds a single function after a function that already exists in the
+ * pipeline.
+ *
+ * Logs a warning if the function has not been registered.
+ *
+ * @param {lunr.PipelineFunction} existingFn - A function that already exists in the pipeline.
+ * @param {lunr.PipelineFunction} newFn - The new function to add to the pipeline.
+ */
+lunr.Pipeline.prototype.after = function (existingFn, newFn) {
+  lunr.Pipeline.warnIfFunctionNotRegistered(newFn)
+
+  var pos = this._stack.indexOf(existingFn)
+  if (pos == -1) {
+    throw new Error('Cannot find existingFn')
+  }
+
+  pos = pos + 1
+  this._stack.splice(pos, 0, newFn)
+}
+
+/**
+ * Adds a single function before a function that already exists in the
+ * pipeline.
+ *
+ * Logs a warning if the function has not been registered.
+ *
+ * @param {lunr.PipelineFunction} existingFn - A function that already exists in the pipeline.
+ * @param {lunr.PipelineFunction} newFn - The new function to add to the pipeline.
+ */
+lunr.Pipeline.prototype.before = function (existingFn, newFn) {
+  lunr.Pipeline.warnIfFunctionNotRegistered(newFn)
+
+  var pos = this._stack.indexOf(existingFn)
+  if (pos == -1) {
+    throw new Error('Cannot find existingFn')
+  }
+
+  this._stack.splice(pos, 0, newFn)
+}
+
+/**
+ * Removes a function from the pipeline.
+ *
+ * @param {lunr.PipelineFunction} fn The function to remove from the pipeline.
+ */
+lunr.Pipeline.prototype.remove = function (fn) {
+  var pos = this._stack.indexOf(fn)
+  if (pos == -1) {
+    return
+  }
+
+  this._stack.splice(pos, 1)
+}
+
+/**
+ * Runs the current list of functions that make up the pipeline against the
+ * passed tokens.
+ *
+ * @param {Array} tokens The tokens to run through the pipeline.
+ * @returns {Array}
+ */
+lunr.Pipeline.prototype.run = function (tokens) {
+  var stackLength = this._stack.length
+
+  for (var i = 0; i < stackLength; i++) {
+    var fn = this._stack[i]
+    var memo = []
+
+    for (var j = 0; j < tokens.length; j++) {
+      var result = fn(tokens[j], j, tokens)
+
+      if (result === void 0 || result === '') continue
+
+      if (result instanceof Array) {
+        for (var k = 0; k < result.length; k++) {
+          memo.push(result[k])
+        }
+      } else {
+        memo.push(result)
+      }
+    }
+
+    tokens = memo
+  }
+
+  return tokens
+}
+
+/**
+ * Convenience method for passing a string through a pipeline and getting
+ * strings out. This method takes care of wrapping the passed string in a
+ * token and mapping the resulting tokens back to strings.
+ *
+ * @param {string} str - The string to pass through the pipeline.
+ * @returns {string[]}
+ */
+lunr.Pipeline.prototype.runString = function (str) {
+  var token = new lunr.Token (str)
+
+  return this.run([token]).map(function (t) {
+    return t.toString()
+  })
+}
+
+/**
+ * Resets the pipeline by removing any existing processors.
+ *
+ */
+lunr.Pipeline.prototype.reset = function () {
+  this._stack = []
+}
+
+/**
+ * Returns a representation of the pipeline ready for serialisation.
+ *
+ * Logs a warning if the function has not been registered.
+ *
+ * @returns {Array}
+ */
+lunr.Pipeline.prototype.toJSON = function () {
+  return this._stack.map(function (fn) {
+    lunr.Pipeline.warnIfFunctionNotRegistered(fn)
+
+    return fn.label
+  })
+}
+/*!
+ * lunr.Vector
+ * Copyright (C) 2018 Oliver Nightingale
+ */
+
+/**
+ * A vector is used to construct the vector space of documents and queries. These
+ * vectors support operations to determine the similarity between two documents or
+ * a document and a query.
+ *
+ * Normally no parameters are required for initializing a vector, but in the case of
+ * loading a previously dumped vector the raw elements can be provided to the constructor.
+ *
+ * For performance reasons vectors are implemented with a flat array, where an elements
+ * index is immediately followed by its value. E.g. [index, value, index, value]. This
+ * allows the underlying array to be as sparse as possible and still offer decent
+ * performance when being used for vector calculations.
+ *
+ * @constructor
+ * @param {Number[]} [elements] - The flat list of element index and element value pairs.
+ */
+lunr.Vector = function (elements) {
+  this._magnitude = 0
+  this.elements = elements || []
+}
+
+
+/**
+ * Calculates the position within the vector to insert a given index.
+ *
+ * This is used internally by insert and upsert. If there are duplicate indexes then
+ * the position is returned as if the value for that index were to be updated, but it
+ * is the callers responsibility to check whether there is a duplicate at that index
+ *
+ * @param {Number} insertIdx - The index at which the element should be inserted.
+ * @returns {Number}
+ */
+lunr.Vector.prototype.positionForIndex = function (index) {
+  // For an empty vector the tuple can be inserted at the beginning
+  if (this.elements.length == 0) {
+    return 0
+  }
+
+  var start = 0,
+      end = this.elements.length / 2,
+      sliceLength = end - start,
+      pivotPoint = Math.floor(sliceLength / 2),
+      pivotIndex = this.elements[pivotPoint * 2]
+
+  while (sliceLength > 1) {
+    if (pivotIndex < index) {
+      start = pivotPoint
+    }
+
+    if (pivotIndex > index) {
+      end = pivotPoint
+    }
+
+    if (pivotIndex == index) {
+      break
+    }
+
+    sliceLength = end - start
+    pivotPoint = start + Math.floor(sliceLength / 2)
+    pivotIndex = this.elements[pivotPoint * 2]
+  }
+
+  if (pivotIndex == index) {
+    return pivotPoint * 2
+  }
+
+  if (pivotIndex > index) {
+    return pivotPoint * 2
+  }
+
+  if (pivotIndex < index) {
+    return (pivotPoint + 1) * 2
+  }
+}
+
+/**
+ * Inserts an element at an index within the vector.
+ *
+ * Does not allow duplicates, will throw an error if there is already an entry
+ * for this index.
+ *
+ * @param {Number} insertIdx - The index at which the element should be inserted.
+ * @param {Number} val - The value to be inserted into the vector.
+ */
+lunr.Vector.prototype.insert = function (insertIdx, val) {
+  this.upsert(insertIdx, val, function () {
+    throw "duplicate index"
+  })
+}
+
+/**
+ * Inserts or updates an existing index within the vector.
+ *
+ * @param {Number} insertIdx - The index at which the element should be inserted.
+ * @param {Number} val - The value to be inserted into the vector.
+ * @param {function} fn - A function that is called for updates, the existing value and the
+ * requested value are passed as arguments
+ */
+lunr.Vector.prototype.upsert = function (insertIdx, val, fn) {
+  this._magnitude = 0
+  var position = this.positionForIndex(insertIdx)
+
+  if (this.elements[position] == insertIdx) {
+    this.elements[position + 1] = fn(this.elements[position + 1], val)
+  } else {
+    this.elements.splice(position, 0, insertIdx, val)
+  }
+}
+
+/**
+ * Calculates the magnitude of this vector.
+ *
+ * @returns {Number}
+ */
+lunr.Vector.prototype.magnitude = function () {
+  if (this._magnitude) return this._magnitude
+
+  var sumOfSquares = 0,
+      elementsLength = this.elements.length
+
+  for (var i = 1; i < elementsLength; i += 2) {
+    var val = this.elements[i]
+    sumOfSquares += val * val
+  }
+
+  return this._magnitude = Math.sqrt(sumOfSquares)
+}
+
+/**
+ * Calculates the dot product of this vector and another vector.
+ *
+ * @param {lunr.Vector} otherVector - The vector to compute the dot product with.
+ * @returns {Number}
+ */
+lunr.Vector.prototype.dot = function (otherVector) {
+  var dotProduct = 0,
+      a = this.elements, b = otherVector.elements,
+      aLen = a.length, bLen = b.length,
+      aVal = 0, bVal = 0,
+      i = 0, j = 0
+
+  while (i < aLen && j < bLen) {
+    aVal = a[i], bVal = b[j]
+    if (aVal < bVal) {
+      i += 2
+    } else if (aVal > bVal) {
+      j += 2
+    } else if (aVal == bVal) {
+      dotProduct += a[i + 1] * b[j + 1]
+      i += 2
+      j += 2
+    }
+  }
+
+  return dotProduct
+}
+
+/**
+ * Calculates the cosine similarity between this vector and another
+ * vector.
+ *
+ * @param {lunr.Vector} otherVector - The other vector to calculate the
+ * similarity with.
+ * @returns {Number}
+ */
+lunr.Vector.prototype.similarity = function (otherVector) {
+  return this.dot(otherVector) / (this.magnitude() * otherVector.magnitude())
+}
+
+/**
+ * Converts the vector to an array of the elements within the vector.
+ *
+ * @returns {Number[]}
+ */
+lunr.Vector.prototype.toArray = function () {
+  var output = new Array (this.elements.length / 2)
+
+  for (var i = 1, j = 0; i < this.elements.length; i += 2, j++) {
+    output[j] = this.elements[i]
+  }
+
+  return output
+}
+
+/**
+ * A JSON serializable representation of the vector.
+ *
+ * @returns {Number[]}
+ */
+lunr.Vector.prototype.toJSON = function () {
+  return this.elements
+}
+/* eslint-disable */
+/*!
+ * lunr.stemmer
+ * Copyright (C) 2018 Oliver Nightingale
+ * Includes code from - http://tartarus.org/~martin/PorterStemmer/js.txt
+ */
+
+/**
+ * lunr.stemmer is an english language stemmer, this is a JavaScript
+ * implementation of the PorterStemmer taken from http://tartarus.org/~martin
+ *
+ * @static
+ * @implements {lunr.PipelineFunction}
+ * @param {lunr.Token} token - The string to stem
+ * @returns {lunr.Token}
+ * @see {@link lunr.Pipeline}
+ */
+lunr.stemmer = (function(){
+  var step2list = {
+      "ational" : "ate",
+      "tional" : "tion",
+      "enci" : "ence",
+      "anci" : "ance",
+      "izer" : "ize",
+      "bli" : "ble",
+      "alli" : "al",
+      "entli" : "ent",
+      "eli" : "e",
+      "ousli" : "ous",
+      "ization" : "ize",
+      "ation" : "ate",
+      "ator" : "ate",
+      "alism" : "al",
+      "iveness" : "ive",
+      "fulness" : "ful",
+      "ousness" : "ous",
+      "aliti" : "al",
+      "iviti" : "ive",
+      "biliti" : "ble",
+      "logi" : "log"
+    },
+
+    step3list = {
+      "icate" : "ic",
+      "ative" : "",
+      "alize" : "al",
+      "iciti" : "ic",
+      "ical" : "ic",
+      "ful" : "",
+      "ness" : ""
+    },
+
+    c = "[^aeiou]",          // consonant
+    v = "[aeiouy]",          // vowel
+    C = c + "[^aeiouy]*",    // consonant sequence
+    V = v + "[aeiou]*",      // vowel sequence
+
+    mgr0 = "^(" + C + ")?" + V + C,               // [C]VC... is m>0
+    meq1 = "^(" + C + ")?" + V + C + "(" + V + ")?$",  // [C]VC[V] is m=1
+    mgr1 = "^(" + C + ")?" + V + C + V + C,       // [C]VCVC... is m>1
+    s_v = "^(" + C + ")?" + v;                   // vowel in stem
+
+  var re_mgr0 = new RegExp(mgr0);
+  var re_mgr1 = new RegExp(mgr1);
+  var re_meq1 = new RegExp(meq1);
+  var re_s_v = new RegExp(s_v);
+
+  var re_1a = /^(.+?)(ss|i)es$/;
+  var re2_1a = /^(.+?)([^s])s$/;
+  var re_1b = /^(.+?)eed$/;
+  var re2_1b = /^(.+?)(ed|ing)$/;
+  var re_1b_2 = /.$/;
+  var re2_1b_2 = /(at|bl|iz)$/;
+  var re3_1b_2 = new RegExp("([^aeiouylsz])\\1$");
+  var re4_1b_2 = new RegExp("^" + C + v + "[^aeiouwxy]$");
+
+  var re_1c = /^(.+?[^aeiou])y$/;
+  var re_2 = /^(.+?)(ational|tional|enci|anci|izer|bli|alli|entli|eli|ousli|ization|ation|ator|alism|iveness|fulness|ousness|aliti|iviti|biliti|logi)$/;
+
+  var re_3 = /^(.+?)(icate|ative|alize|iciti|ical|ful|ness)$/;
+
+  var re_4 = /^(.+?)(al|ance|ence|er|ic|able|ible|ant|ement|ment|ent|ou|ism|ate|iti|ous|ive|ize)$/;
+  var re2_4 = /^(.+?)(s|t)(ion)$/;
+
+  var re_5 = /^(.+?)e$/;
+  var re_5_1 = /ll$/;
+  var re3_5 = new RegExp("^" + C + v + "[^aeiouwxy]$");
+
+  var porterStemmer = function porterStemmer(w) {
+    var stem,
+      suffix,
+      firstch,
+      re,
+      re2,
+      re3,
+      re4;
+
+    if (w.length < 3) { return w; }
+
+    firstch = w.substr(0,1);
+    if (firstch == "y") {
+      w = firstch.toUpperCase() + w.substr(1);
+    }
+
+    // Step 1a
+    re = re_1a
+    re2 = re2_1a;
+
+    if (re.test(w)) { w = w.replace(re,"$1$2"); }
+    else if (re2.test(w)) { w = w.replace(re2,"$1$2"); }
+
+    // Step 1b
+    re = re_1b;
+    re2 = re2_1b;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      re = re_mgr0;
+      if (re.test(fp[1])) {
+        re = re_1b_2;
+        w = w.replace(re,"");
+      }
+    } else if (re2.test(w)) {
+      var fp = re2.exec(w);
+      stem = fp[1];
+      re2 = re_s_v;
+      if (re2.test(stem)) {
+        w = stem;
+        re2 = re2_1b_2;
+        re3 = re3_1b_2;
+        re4 = re4_1b_2;
+        if (re2.test(w)) { w = w + "e"; }
+        else if (re3.test(w)) { re = re_1b_2; w = w.replace(re,""); }
+        else if (re4.test(w)) { w = w + "e"; }
+      }
+    }
+
+    // Step 1c - replace suffix y or Y by i if preceded by a non-vowel which is not the first letter of the word (so cry -> cri, by -> by, say -> say)
+    re = re_1c;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      stem = fp[1];
+      w = stem + "i";
+    }
+
+    // Step 2
+    re = re_2;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      stem = fp[1];
+      suffix = fp[2];
+      re = re_mgr0;
+      if (re.test(stem)) {
+        w = stem + step2list[suffix];
+      }
+    }
+
+    // Step 3
+    re = re_3;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      stem = fp[1];
+      suffix = fp[2];
+      re = re_mgr0;
+      if (re.test(stem)) {
+        w = stem + step3list[suffix];
+      }
+    }
+
+    // Step 4
+    re = re_4;
+    re2 = re2_4;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      stem = fp[1];
+      re = re_mgr1;
+      if (re.test(stem)) {
+        w = stem;
+      }
+    } else if (re2.test(w)) {
+      var fp = re2.exec(w);
+      stem = fp[1] + fp[2];
+      re2 = re_mgr1;
+      if (re2.test(stem)) {
+        w = stem;
+      }
+    }
+
+    // Step 5
+    re = re_5;
+    if (re.test(w)) {
+      var fp = re.exec(w);
+      stem = fp[1];
+      re = re_mgr1;
+      re2 = re_meq1;
+      re3 = re3_5;
+      if (re.test(stem) || (re2.test(stem) && !(re3.test(stem)))) {
+        w = stem;
+      }
+    }
+
+    re = re_5_1;
+    re2 = re_mgr1;
+    if (re.test(w) && re2.test(w)) {
+      re = re_1b_2;
+      w = w.replace(re,"");
+    }
+
+    // and turn initial Y back to y
+
+    if (firstch == "y") {
+      w = firstch.toLowerCase() + w.substr(1);
+    }
+
+    return w;
+  };
+
+  return function (token) {
+    return token.update(porterStemmer);
+  }
+})();
+
+lunr.Pipeline.registerFunction(lunr.stemmer, 'stemmer')
+/*!
+ * lunr.stopWordFilter
+ * Copyright (C) 2018 Oliver Nightingale
+ */
+
+/**
+ * lunr.generateStopWordFilter builds a stopWordFilter function from the provided
+ * list of stop words.
+ *
+ * The built in lunr.stopWordFilter is built using this generator and can be used
+ * to generate custom stopWordFilters for applications or non English languages.
+ *
+ * @param {Array} token The token to pass through the filter
+ * @returns {lunr.PipelineFunction}
+ * @see lunr.Pipeline
+ * @see lunr.stopWordFilter
+ */
+lunr.generateStopWordFilter = function (stopWords) {
+  var words = stopWords.reduce(function (memo, stopWord) {
+    memo[stopWord] = stopWord
+    return memo
+  }, {})
+
+  return function (token) {
+    if (token && words[token.toString()] !== token.toString()) return token
+  }
+}
+
+/**
+ * lunr.stopWordFilter is an English language stop word list filter, any words
+ * contained in the list will not be passed through the filter.
+ *
+ * This is intended to be used in the Pipeline. If the token does not pass the
+ * filter then undefined will be returned.
+ *
+ * @implements {lunr.PipelineFunction}
+ * @params {lunr.Token} token - A token to check for being a stop word.
+ * @returns {lunr.Token}
+ * @see {@link lunr.Pipeline}
+ */
+lunr.stopWordFilter = lunr.generateStopWordFilter([
+  'a',
+  'able',
+  'about',
+  'across',
+  'after',
+  'all',
+  'almost',
+  'also',
+  'am',
+  'among',
+  'an',
+  'and',
+  'any',
+  'are',
+  'as',
+  'at',
+  'be',
+  'because',
+  'been',
+  'but',
+  'by',
+  'can',
+  'cannot',
+  'could',
+  'dear',
+  'did',
+  'do',
+  'does',
+  'either',
+  'else',
+  'ever',
+  'every',
+  'for',
+  'from',
+  'get',
+  'got',
+  'had',
+  'has',
+  'have',
+  'he',
+  'her',
+  'hers',
+  'him',
+  'his',
+  'how',
+  'however',
+  'i',
+  'if',
+  'in',
+  'into',
+  'is',
+  'it',
+  'its',
+  'just',
+  'least',
+  'let',
+  'like',
+  'likely',
+  'may',
+  'me',
+  'might',
+  'most',
+  'must',
+  'my',
+  'neither',
+  'no',
+  'nor',
+  'not',
+  'of',
+  'off',
+  'often',
+  'on',
+  'only',
+  'or',
+  'other',
+  'our',
+  'own',
+  'rather',
+  'said',
+  'say',
+  'says',
+  'she',
+  'should',
+  'since',
+  'so',
+  'some',
+  'than',
+  'that',
+  'the',
+  'their',
+  'them',
+  'then',
+  'there',
+  'these',
+  'they',
+  'this',
+  'tis',
+  'to',
+  'too',
+  'twas',
+  'us',
+  'wants',
+  'was',
+  'we',
+  'were',
+  'what',
+  'when',
+  'where',
+  'which',
+  'while',
+  'who',
+  'whom',
+  'why',
+  'will',
+  'with',
+  'would',
+  'yet',
+  'you',
+  'your'
+])
+
+lunr.Pipeline.registerFunction(lunr.stopWordFilter, 'stopWordFilter')
+/*!
+ * lunr.trimmer
+ * Copyright (C) 2018 Oliver Nightingale
+ */
+
+/**
+ * lunr.trimmer is a pipeline function for trimming non word
+ * characters from the beginning and end of tokens before they
+ * enter the index.
+ *
+ * This implementation may not work correctly for non latin
+ * characters and should either be removed or adapted for use
+ * with languages with non-latin characters.
+ *
+ * @static
+ * @implements {lunr.PipelineFunction}
+ * @param {lunr.Token} token The token to pass through the filter
+ * @returns {lunr.Token}
+ * @see lunr.Pipeline
+ */
+lunr.trimmer = function (token) {
+  return token.update(function (s) {
+    return s.replace(/^\W+/, '').replace(/\W+$/, '')
+  })
+}
+
+lunr.Pipeline.registerFunction(lunr.trimmer, 'trimmer')
+/*!
+ * lunr.TokenSet
+ * Copyright (C) 2018 Oliver Nightingale
+ */
+
+/**
+ * A token set is used to store the unique list of all tokens
+ * within an index. Token sets are also used to represent an
+ * incoming query to the index, this query token set and index
+ * token set are then intersected to find which tokens to look
+ * up in the inverted index.
+ *
+ * A token set can hold multiple tokens, as in the case of the
+ * index token set, or it can hold a single token as in the
+ * case of a simple query token set.
+ *
+ * Additionally token sets are used to perform wildcard matching.
+ * Leading, contained and trailing wildcards are supported, and
+ * from this edit distance matching can also be provided.
+ *
+ * Token sets are implemented as a minimal finite state automata,
+ * where both common prefixes and suffixes are shared between tokens.
+ * This helps to reduce the space used for storing the token set.
+ *
+ * @constructor
+ */
+lunr.TokenSet = function () {
+  this.final = false
+  this.edges = {}
+  this.id = lunr.TokenSet._nextId
+  lunr.TokenSet._nextId += 1
+}
+
+/**
+ * Keeps track of the next, auto increment, identifier to assign
+ * to a new tokenSet.
+ *
+ * TokenSets require a unique identifier to be correctly minimised.
+ *
+ * @private
+ */
+lunr.TokenSet._nextId = 1
+
+/**
+ * Creates a TokenSet instance from the given sorted array of words.
+ *
+ * @param {String[]} arr - A sorted array of strings to create the set from.
+ * @returns {lunr.TokenSet}
+ * @throws Will throw an error if the input array is not sorted.
+ */
+lunr.TokenSet.fromArray = function (arr) {
+  var builder = new lunr.TokenSet.Builder
+
+  for (var i = 0, len = arr.length; i < len; i++) {
+    builder.insert(arr[i])
+  }
+
+  builder.finish()
+  return builder.root
+}
+
+/**
+ * Creates a token set from a query clause.
+ *
+ * @private
+ * @param {Object} clause - A single clause from lunr.Query.
+ * @param {string} clause.term - The query clause term.
+ * @param {number} [clause.editDistance] - The optional edit distance for the term.
+ * @returns {lunr.TokenSet}
+ */
+lunr.TokenSet.fromClause = function (clause) {
+  if ('editDistance' in clause) {
+    return lunr.TokenSet.fromFuzzyString(clause.term, clause.editDistance)
+  } else {
+    return lunr.TokenSet.fromString(clause.term)
+  }
+}
+
+/**
+ * Creates a token set representing a single string with a specified
+ * edit distance.
+ *
+ * Insertions, deletions, substitutions and transpositions are each
+ * treated as an edit distance of 1.
+ *
+ * Increasing the allowed edit distance will have a dramatic impact
+ * on the performance of both creating and intersecting these TokenSets.
+ * It is advised to keep the edit distance less than 3.
+ *
+ * @param {string} str - The string to create the token set from.
+ * @param {number} editDistance - The allowed edit distance to match.
+ * @returns {lunr.Vector}
+ */
+lunr.TokenSet.fromFuzzyString = function (str, editDistance) {
+  var root = new lunr.TokenSet
+
+  var stack = [{
+    node: root,
+    editsRemaining: editDistance,
+    str: str
+  }]
+
+  while (stack.length) {
+    var frame = stack.pop()
+
+    // no edit
+    if (frame.str.length > 0) {
+      var char = frame.str.charAt(0),
+          noEditNode
+
+      if (char in frame.node.edges) {
+        noEditNode = frame.node.edges[char]
+      } else {
+        noEditNode = new lunr.TokenSet
+        frame.node.edges[char] = noEditNode
+      }
+
+      if (frame.str.length == 1) {
+        noEditNode.final = true
+      } else {
+        stack.push({
+          node: noEditNode,
+          editsRemaining: frame.editsRemaining,
+          str: frame.str.slice(1)
+        })
+      }
+    }
+
+    // deletion
+    // can only do a deletion if we have enough edits remaining
+    // and if there are characters left to delete in the string
+    if (frame.editsRemaining > 0 && frame.str.length > 1) {
+      var char = frame.str.charAt(1),
+          deletionNode
+
+      if (char in frame.node.edges) {
+        deletionNode = frame.node.edges[char]
+      } else {
+        deletionNode = new lunr.TokenSet
+        frame.node.edges[char] = deletionNode
+      }
+
+      if (frame.str.length <= 2) {
+        deletionNode.final = true
+      } else {
+        stack.push({
+          node: deletionNode,
+          editsRemaining: frame.editsRemaining - 1,
+          str: frame.str.slice(2)
+        })
+      }
+    }
+
+    // deletion
+    // just removing the last character from the str
+    if (frame.editsRemaining > 0 && frame.str.length == 1) {
+      frame.node.final = true
+    }
+
+    // substitution
+    // can only do a substitution if we have enough edits remaining
+    // and if there are characters left to substitute
+    if (frame.editsRemaining > 0 && frame.str.length >= 1) {
+      if ("*" in frame.node.edges) {
+        var substitutionNode = frame.node.edges["*"]
+      } else {
+        var substitutionNode = new lunr.TokenSet
+        frame.node.edges["*"] = substitutionNode
+      }
+
+      if (frame.str.length == 1) {
+        substitutionNode.final = true
+      } else {
+        stack.push({
+          node: substitutionNode,
+          editsRemaining: frame.editsRemaining - 1,
+          str: frame.str.slice(1)
+        })
+      }
+    }
+
+    // insertion
+    // can only do insertion if there are edits remaining
+    if (frame.editsRemaining > 0) {
+      if ("*" in frame.node.edges) {
+        var insertionNode = frame.node.edges["*"]
+      } else {
+        var insertionNode = new lunr.TokenSet
+        frame.node.edges["*"] = insertionNode
+      }
+
+      if (frame.str.length == 0) {
+        insertionNode.final = true
+      } else {
+        stack.push({
+          node: insertionNode,
+          editsRemaining: frame.editsRemaining - 1,
+          str: frame.str
+        })
+      }
+    }
+
+    // transposition
+    // can only do a transposition if there are edits remaining
+    // and there are enough characters to transpose
+    if (frame.editsRemaining > 0 && frame.str.length > 1) {
+      var charA = frame.str.charAt(0),
+          charB = frame.str.charAt(1),
+          transposeNode
+
+      if (charB in frame.node.edges) {
+        transposeNode = frame.node.edges[charB]
+      } else {
+        transposeNode = new lunr.TokenSet
+        frame.node.edges[charB] = transposeNode
+      }
+
+      if (frame.str.length == 1) {
+        transposeNode.final = true
+      } else {
+        stack.push({
+          node: transposeNode,
+          editsRemaining: frame.editsRemaining - 1,
+          str: charA + frame.str.slice(2)
+        })
+      }
+    }
+  }
+
+  return root
+}
+
+/**
+ * Creates a TokenSet from a string.
+ *
+ * The string may contain one or more wildcard characters (*)
+ * that will allow wildcard matching when intersecting with
+ * another TokenSet.
+ *
+ * @param {string} str - The string to create a TokenSet from.
+ * @returns {lunr.TokenSet}
+ */
+lunr.TokenSet.fromString = function (str) {
+  var node = new lunr.TokenSet,
+      root = node,
+      wildcardFound = false
+
+  /*
+   * Iterates through all characters within the passed string
+   * appending a node for each character.
+   *
+   * As soon as a wildcard character is found then a self
+   * referencing edge is introduced to continually match
+   * any number of any characters.
+   */
+  for (var i = 0, len = str.length; i < len; i++) {
+    var char = str[i],
+        final = (i == len - 1)
+
+    if (char == "*") {
+      wildcardFound = true
+      node.edges[char] = node
+      node.final = final
+
+    } else {
+      var next = new lunr.TokenSet
+      next.final = final
+
+      node.edges[char] = next
+      node = next
+
+      // TODO: is this needed anymore?
+      if (wildcardFound) {
+        node.edges["*"] = root
+      }
+    }
+  }
+
+  return root
+}
+
+/**
+ * Converts this TokenSet into an array of strings
+ * contained within the TokenSet.
+ *
+ * @returns {string[]}
+ */
+lunr.TokenSet.prototype.toArray = function () {
+  var words = []
+
+  var stack = [{
+    prefix: "",
+    node: this
+  }]
+
+  while (stack.length) {
+    var frame = stack.pop(),
+        edges = Object.keys(frame.node.edges),
+        len = edges.length
+
+    if (frame.node.final) {
+      words.push(frame.prefix)
+    }
+
+    for (var i = 0; i < len; i++) {
+      var edge = edges[i]
+
+      stack.push({
+        prefix: frame.prefix.concat(edge),
+        node: frame.node.edges[edge]
+      })
+    }
+  }
+
+  return words
+}
+
+/**
+ * Generates a string representation of a TokenSet.
+ *
+ * This is intended to allow TokenSets to be used as keys
+ * in objects, largely to aid the construction and minimisation
+ * of a TokenSet. As such it is not designed to be a human
+ * friendly representation of the TokenSet.
+ *
+ * @returns {string}
+ */
+lunr.TokenSet.prototype.toString = function () {
+  // NOTE: Using Object.keys here as this.edges is very likely
+  // to enter 'hash-mode' with many keys being added
+  //
+  // avoiding a for-in loop here as it leads to the function
+  // being de-optimised (at least in V8). From some simple
+  // benchmarks the performance is comparable, but allowing
+  // V8 to optimize may mean easy performance wins in the future.
+
+  if (this._str) {
+    return this._str
+  }
+
+  var str = this.final ? '1' : '0',
+      labels = Object.keys(this.edges).sort(),
+      len = labels.length
+
+  for (var i = 0; i < len; i++) {
+    var label = labels[i],
+        node = this.edges[label]
+
+    str = str + label + node.id
+  }
+
+  return str
+}
+
+/**
+ * Returns a new TokenSet that is the intersection of
+ * this TokenSet and the passed TokenSet.
+ *
+ * This intersection will take into account any wildcards
+ * contained within the TokenSet.
+ *
+ * @param {lunr.TokenSet} b - An other TokenSet to intersect with.
+ * @returns {lunr.TokenSet}
+ */
+lunr.TokenSet.prototype.intersect = function (b) {
+  var output = new lunr.TokenSet,
+      frame = undefined
+
+  var stack = [{
+    qNode: b,
+    output: output,
+    node: this
+  }]
+
+  while (stack.length) {
+    frame = stack.pop()
+
+    // NOTE: As with the #toString method, we are using
+    // Object.keys and a for loop instead of a for-in loop
+    // as both of these objects enter 'hash' mode, causing
+    // the function to be de-optimised in V8
+    var qEdges = Object.keys(frame.qNode.edges),
+        qLen = qEdges.length,
+        nEdges = Object.keys(frame.node.edges),
+        nLen = nEdges.length
+
+    for (var q = 0; q < qLen; q++) {
+      var qEdge = qEdges[q]
+
+      for (var n = 0; n < nLen; n++) {
+        var nEdge = nEdges[n]
+
+        if (nEdge == qEdge || qEdge == '*') {
+          var node = frame.node.edges[nEdge],
+              qNode = frame.qNode.edges[qEdge],
+              final = node.final && qNode.final,
+              next = undefined
+
+          if (nEdge in frame.output.edges) {
+            // an edge already exists for this character
+            // no need to create a new node, just set the finality
+            // bit unless this node is already final
+            next = frame.output.edges[nEdge]
+            next.final = next.final || final
+
+          } else {
+            // no edge exists yet, must create one
+            // set the finality bit and insert it
+            // into the output
+            next = new lunr.TokenSet
+            next.final = final
+            frame.output.edges[nEdge] = next
+          }
+
+          stack.push({
+            qNode: qNode,
+            output: next,
+            node: node
+          })
+        }
+      }
+    }
+  }
+
+  return output
+}
+lunr.TokenSet.Builder = function () {
+  this.previousWord = ""
+  this.root = new lunr.TokenSet
+  this.uncheckedNodes = []
+  this.minimizedNodes = {}
+}
+
+lunr.TokenSet.Builder.prototype.insert = function (word) {
+  var node,
+      commonPrefix = 0
+
+  if (word < this.previousWord) {
+    throw new Error ("Out of order word insertion")
+  }
+
+  for (var i = 0; i < word.length && i < this.previousWord.length; i++) {
+    if (word[i] != this.previousWord[i]) break
+    commonPrefix++
+  }
+
+  this.minimize(commonPrefix)
+
+  if (this.uncheckedNodes.length == 0) {
+    node = this.root
+  } else {
+    node = this.uncheckedNodes[this.uncheckedNodes.length - 1].child
+  }
+
+  for (var i = commonPrefix; i < word.length; i++) {
+    var nextNode = new lunr.TokenSet,
+        char = word[i]
+
+    node.edges[char] = nextNode
+
+    this.uncheckedNodes.push({
+      parent: node,
+      char: char,
+      child: nextNode
+    })
+
+    node = nextNode
+  }
+
+  node.final = true
+  this.previousWord = word
+}
+
+lunr.TokenSet.Builder.prototype.finish = function () {
+  this.minimize(0)
+}
+
+lunr.TokenSet.Builder.prototype.minimize = function (downTo) {
+  for (var i = this.uncheckedNodes.length - 1; i >= downTo; i--) {
+    var node = this.uncheckedNodes[i],
+        childKey = node.child.toString()
+
+    if (childKey in this.minimizedNodes) {
+      node.parent.edges[node.char] = this.minimizedNodes[childKey]
+    } else {
+      // Cache the key for this node since
+      // we know it can't change anymore
+      node.child._str = childKey
+
+      this.minimizedNodes[childKey] = node.child
+    }
+
+    this.uncheckedNodes.pop()
+  }
+}
+/*!
+ * lunr.Index
+ * Copyright (C) 2018 Oliver Nightingale
+ */
+
+/**
+ * An index contains the built index of all documents and provides a query interface
+ * to the index.
+ *
+ * Usually instances of lunr.Index will not be created using this constructor, instead
+ * lunr.Builder should be used to construct new indexes, or lunr.Index.load should be
+ * used to load previously built and serialized indexes.
+ *
+ * @constructor
+ * @param {Object} attrs - The attributes of the built search index.
+ * @param {Object} attrs.invertedIndex - An index of term/field to document reference.
+ * @param {Object<string, lunr.Vector>} attrs.documentVectors - Document vectors keyed by document reference.
+ * @param {lunr.TokenSet} attrs.tokenSet - An set of all corpus tokens.
+ * @param {string[]} attrs.fields - The names of indexed document fields.
+ * @param {lunr.Pipeline} attrs.pipeline - The pipeline to use for search terms.
+ */
+lunr.Index = function (attrs) {
+  this.invertedIndex = attrs.invertedIndex
+  this.fieldVectors = attrs.fieldVectors
+  this.tokenSet = attrs.tokenSet
+  this.fields = attrs.fields
+  this.pipeline = attrs.pipeline
+}
+
+/**
+ * A result contains details of a document matching a search query.
+ * @typedef {Object} lunr.Index~Result
+ * @property {string} ref - The reference of the document this result represents.
+ * @property {number} score - A number between 0 and 1 representing how similar this document is to the query.
+ * @property {lunr.MatchData} matchData - Contains metadata about this match including which term(s) caused the match.
+ */
+
+/**
+ * Although lunr provides the ability to create queries using lunr.Query, it also provides a simple
+ * query language which itself is parsed into an instance of lunr.Query.
+ *
+ * For programmatically building queries it is advised to directly use lunr.Query, the query language
+ * is best used for human entered text rather than program generated text.
+ *
+ * At its simplest queries can just be a single term, e.g. `hello`, multiple terms are also supported
+ * and will be combined with OR, e.g `hello world` will match documents that contain either 'hello'
+ * or 'world', though those that contain both will rank higher in the results.
+ *
+ * Wildcards can be included in terms to match one or more unspecified characters, these wildcards can
+ * be inserted anywhere within the term, and more than one wildcard can exist in a single term. Adding
+ * wildcards will increase the number of documents that will be found but can also have a negative
+ * impact on query performance, especially with wildcards at the beginning of a term.
+ *
+ * Terms can be restricted to specific fields, e.g. `title:hello`, only documents with the term
+ * hello in the title field will match this query. Using a field not present in the index will lead
+ * to an error being thrown.
+ *
+ * Modifiers can also be added to terms, lunr supports edit distance and boost modifiers on terms. A term
+ * boost will make documents matching that term score higher, e.g. `foo^5`. Edit distance is also supported
+ * to provide fuzzy matching, e.g. 'hello~2' will match documents with hello with an edit distance of 2.
+ * Avoid large values for edit distance to improve query performance.
+ *
+ * To escape special characters the backslash character '\' can be used, this allows searches to include
+ * characters that would normally be considered modifiers, e.g. `foo\~2` will search for a term "foo~2" instead
+ * of attempting to apply a boost of 2 to the search term "foo".
+ *
+ * @typedef {string} lunr.Index~QueryString
+ * @example <caption>Simple single term query</caption>
+ * hello
+ * @example <caption>Multiple term query</caption>
+ * hello world
+ * @example <caption>term scoped to a field</caption>
+ * title:hello
+ * @example <caption>term with a boost of 10</caption>
+ * hello^10
+ * @example <caption>term with an edit distance of 2</caption>
+ * hello~2
+ */
+
+/**
+ * Performs a search against the index using lunr query syntax.
+ *
+ * Results will be returned sorted by their score, the most relevant results
+ * will be returned first.
+ *
+ * For more programmatic querying use lunr.Index#query.
+ *
+ * @param {lunr.Index~QueryString} queryString - A string containing a lunr query.
+ * @throws {lunr.QueryParseError} If the passed query string cannot be parsed.
+ * @returns {lunr.Index~Result[]}
+ */
+lunr.Index.prototype.search = function (queryString) {
+  return this.query(function (query) {
+    var parser = new lunr.QueryParser(queryString, query)
+    parser.parse()
+  })
+}
+
+/**
+ * A query builder callback provides a query object to be used to express
+ * the query to perform on the index.
+ *
+ * @callback lunr.Index~queryBuilder
+ * @param {lunr.Query} query - The query object to build up.
+ * @this lunr.Query
+ */
+
+/**
+ * Performs a query against the index using the yielded lunr.Query object.
+ *
+ * If performing programmatic queries against the index, this method is preferred
+ * over lunr.Index#search so as to avoid the additional query parsing overhead.
+ *
+ * A query object is yielded to the supplied function which should be used to
+ * express the query to be run against the index.
+ *
+ * Note that although this function takes a callback parameter it is _not_ an
+ * asynchronous operation, the callback is just yielded a query object to be
+ * customized.
+ *
+ * @param {lunr.Index~queryBuilder} fn - A function that is used to build the query.
+ * @returns {lunr.Index~Result[]}
+ */
+lunr.Index.prototype.query = function (fn) {
+  // for each query clause
+  // * process terms
+  // * expand terms from token set
+  // * find matching documents and metadata
+  // * get document vectors
+  // * score documents
+
+  var query = new lunr.Query(this.fields),
+      matchingFields = Object.create(null),
+      queryVectors = Object.create(null),
+      termFieldCache = Object.create(null)
+
+  fn.call(query, query)
+
+  for (var i = 0; i < query.clauses.length; i++) {
+    /*
+     * Unless the pipeline has been disabled for this term, which is
+     * the case for terms with wildcards, we need to pass the clause
+     * term through the search pipeline. A pipeline returns an array
+     * of processed terms. Pipeline functions may expand the passed
+     * term, which means we may end up performing multiple index lookups
+     * for a single query term.
+     */
+    var clause = query.clauses[i],
+        terms = null
+
+    if (clause.usePipeline) {
+      terms = this.pipeline.runString(clause.term)
+    } else {
+      terms = [clause.term]
+    }
+
+    for (var m = 0; m < terms.length; m++) {
+      var term = terms[m]
+
+      /*
+       * Each term returned from the pipeline needs to use the same query
+       * clause object, e.g. the same boost and or edit distance. The
+       * simplest way to do this is to re-use the clause object but mutate
+       * its term property.
+       */
+      clause.term = term
+
+      /*
+       * From the term in the clause we create a token set which will then
+       * be used to intersect the indexes token set to get a list of terms
+       * to lookup in the inverted index
+       */
+      var termTokenSet = lunr.TokenSet.fromClause(clause),
+          expandedTerms = this.tokenSet.intersect(termTokenSet).toArray()
+
+      for (var j = 0; j < expandedTerms.length; j++) {
+        /*
+         * For each term get the posting and termIndex, this is required for
+         * building the query vector.
+         */
+        var expandedTerm = expandedTerms[j],
+            posting = this.invertedIndex[expandedTerm],
+            termIndex = posting._index
+
+        for (var k = 0; k < clause.fields.length; k++) {
+          /*
+           * For each field that this query term is scoped by (by default
+           * all fields are in scope) we need to get all the document refs
+           * that have this term in that field.
+           *
+           * The posting is the entry in the invertedIndex for the matching
+           * term from above.
+           */
+          var field = clause.fields[k],
+              fieldPosting = posting[field],
+              matchingDocumentRefs = Object.keys(fieldPosting),
+              termField = expandedTerm + "/" + field
+
+          /*
+           * To support field level boosts a query vector is created per
+           * field. This vector is populated using the termIndex found for
+           * the term and a unit value with the appropriate boost applied.
+           *
+           * If the query vector for this field does not exist yet it needs
+           * to be created.
+           */
+          if (queryVectors[field] === undefined) {
+            queryVectors[field] = new lunr.Vector
+          }
+
+          /*
+           * Using upsert because there could already be an entry in the vector
+           * for the term we are working with. In that case we just add the scores
+           * together.
+           */
+          queryVectors[field].upsert(termIndex, 1 * clause.boost, function (a, b) { return a + b })
+
+          /**
+           * If we've already seen this term, field combo then we've already collected
+           * the matching documents and metadata, no need to go through all that again
+           */
+          if (termFieldCache[termField]) {
+            continue
+          }
+
+          for (var l = 0; l < matchingDocumentRefs.length; l++) {
+            /*
+             * All metadata for this term/field/document triple
+             * are then extracted and collected into an instance
+             * of lunr.MatchData ready to be returned in the query
+             * results
+             */
+            var matchingDocumentRef = matchingDocumentRefs[l],
+                matchingFieldRef = new lunr.FieldRef (matchingDocumentRef, field),
+                metadata = fieldPosting[matchingDocumentRef],
+                fieldMatch
+
+            if ((fieldMatch = matchingFields[matchingFieldRef]) === undefined) {
+              matchingFields[matchingFieldRef] = new lunr.MatchData (expandedTerm, field, metadata)
+            } else {
+              fieldMatch.add(expandedTerm, field, metadata)
+            }
+
+          }
+
+          termFieldCache[termField] = true
+        }
+      }
+    }
+  }
+
+  var matchingFieldRefs = Object.keys(matchingFields),
+      results = [],
+      matches = Object.create(null)
+
+  for (var i = 0; i < matchingFieldRefs.length; i++) {
+    /*
+     * Currently we have document fields that match the query, but we
+     * need to return documents. The matchData and scores are combined
+     * from multiple fields belonging to the same document.
+     *
+     * Scores are calculated by field, using the query vectors created
+     * above, and combined into a final document score using addition.
+     */
+    var fieldRef = lunr.FieldRef.fromString(matchingFieldRefs[i]),
+        docRef = fieldRef.docRef,
+        fieldVector = this.fieldVectors[fieldRef],
+        score = queryVectors[fieldRef.fieldName].similarity(fieldVector),
+        docMatch
+
+    if ((docMatch = matches[docRef]) !== undefined) {
+      docMatch.score += score
+      docMatch.matchData.combine(matchingFields[fieldRef])
+    } else {
+      var match = {
+        ref: docRef,
+        score: score,
+        matchData: matchingFields[fieldRef]
+      }
+      matches[docRef] = match
+      results.push(match)
+    }
+  }
+
+  /*
+   * Sort the results objects by score, highest first.
+   */
+  return results.sort(function (a, b) {
+    return b.score - a.score
+  })
+}
+
+/**
+ * Prepares the index for JSON serialization.
+ *
+ * The schema for this JSON blob will be described in a
+ * separate JSON schema file.
+ *
+ * @returns {Object}
+ */
+lunr.Index.prototype.toJSON = function () {
+  var invertedIndex = Object.keys(this.invertedIndex)
+    .sort()
+    .map(function (term) {
+      return [term, this.invertedIndex[term]]
+    }, this)
+
+  var fieldVectors = Object.keys(this.fieldVectors)
+    .map(function (ref) {
+      return [ref, this.fieldVectors[ref].toJSON()]
+    }, this)
+
+  return {
+    version: lunr.version,
+    fields: this.fields,
+    fieldVectors: fieldVectors,
+    invertedIndex: invertedIndex,
+    pipeline: this.pipeline.toJSON()
+  }
+}
+
+/**
+ * Loads a previously serialized lunr.Index
+ *
+ * @param {Object} serializedIndex - A previously serialized lunr.Index
+ * @returns {lunr.Index}
+ */
+lunr.Index.load = function (serializedIndex) {
+  var attrs = {},
+      fieldVectors = {},
+      serializedVectors = serializedIndex.fieldVectors,
+      invertedIndex = {},
+      serializedInvertedIndex = serializedIndex.invertedIndex,
+      tokenSetBuilder = new lunr.TokenSet.Builder,
+      pipeline = lunr.Pipeline.load(serializedIndex.pipeline)
+
+  if (serializedIndex.version != lunr.version) {
+    lunr.utils.warn("Version mismatch when loading serialised index. Current version of lunr '" + lunr.version + "' does not match serialized index '" + serializedIndex.version + "'")
+  }
+
+  for (var i = 0; i < serializedVectors.length; i++) {
+    var tuple = serializedVectors[i],
+        ref = tuple[0],
+        elements = tuple[1]
+
+    fieldVectors[ref] = new lunr.Vector(elements)
+  }
+
+  for (var i = 0; i < serializedInvertedIndex.length; i++) {
+    var tuple = serializedInvertedIndex[i],
+        term = tuple[0],
+        posting = tuple[1]
+
+    tokenSetBuilder.insert(term)
+    invertedIndex[term] = posting
+  }
+
+  tokenSetBuilder.finish()
+
+  attrs.fields = serializedIndex.fields
+
+  attrs.fieldVectors = fieldVectors
+  attrs.invertedIndex = invertedIndex
+  attrs.tokenSet = tokenSetBuilder.root
+  attrs.pipeline = pipeline
+
+  return new lunr.Index(attrs)
+}
+/*!
+ * lunr.Builder
+ * Copyright (C) 2018 Oliver Nightingale
+ */
+
+/**
+ * lunr.Builder performs indexing on a set of documents and
+ * returns instances of lunr.Index ready for querying.
+ *
+ * All configuration of the index is done via the builder, the
+ * fields to index, the document reference, the text processing
+ * pipeline and document scoring parameters are all set on the
+ * builder before indexing.
+ *
+ * @constructor
+ * @property {string} _ref - Internal reference to the document reference field.
+ * @property {string[]} _fields - Internal reference to the document fields to index.
+ * @property {object} invertedIndex - The inverted index maps terms to document fields.
+ * @property {object} documentTermFrequencies - Keeps track of document term frequencies.
+ * @property {object} documentLengths - Keeps track of the length of documents added to the index.
+ * @property {lunr.tokenizer} tokenizer - Function for splitting strings into tokens for indexing.
+ * @property {lunr.Pipeline} pipeline - The pipeline performs text processing on tokens before indexing.
+ * @property {lunr.Pipeline} searchPipeline - A pipeline for processing search terms before querying the index.
+ * @property {number} documentCount - Keeps track of the total number of documents indexed.
+ * @property {number} _b - A parameter to control field length normalization, setting this to 0 disabled normalization, 1 fully normalizes field lengths, the default value is 0.75.
+ * @property {number} _k1 - A parameter to control how quickly an increase in term frequency results in term frequency saturation, the default value is 1.2.
+ * @property {number} termIndex - A counter incremented for each unique term, used to identify a terms position in the vector space.
+ * @property {array} metadataWhitelist - A list of metadata keys that have been whitelisted for entry in the index.
+ */
+lunr.Builder = function () {
+  this._ref = "id"
+  this._fields = []
+  this.invertedIndex = Object.create(null)
+  this.fieldTermFrequencies = {}
+  this.fieldLengths = {}
+  this.tokenizer = lunr.tokenizer
+  this.pipeline = new lunr.Pipeline
+  this.searchPipeline = new lunr.Pipeline
+  this.documentCount = 0
+  this._b = 0.75
+  this._k1 = 1.2
+  this.termIndex = 0
+  this.metadataWhitelist = []
+}
+
+/**
+ * Sets the document field used as the document reference. Every document must have this field.
+ * The type of this field in the document should be a string, if it is not a string it will be
+ * coerced into a string by calling toString.
+ *
+ * The default ref is 'id'.
+ *
+ * The ref should _not_ be changed during indexing, it should be set before any documents are
+ * added to the index. Changing it during indexing can lead to inconsistent results.
+ *
+ * @param {string} ref - The name of the reference field in the document.
+ */
+lunr.Builder.prototype.ref = function (ref) {
+  this._ref = ref
+}
+
+/**
+ * Adds a field to the list of document fields that will be indexed. Every document being
+ * indexed should have this field. Null values for this field in indexed documents will
+ * not cause errors but will limit the chance of that document being retrieved by searches.
+ *
+ * All fields should be added before adding documents to the index. Adding fields after
+ * a document has been indexed will have no effect on already indexed documents.
+ *
+ * @param {string} field - The name of a field to index in all documents.
+ */
+lunr.Builder.prototype.field = function (field) {
+  this._fields.push(field)
+}
+
+/**
+ * A parameter to tune the amount of field length normalisation that is applied when
+ * calculating relevance scores. A value of 0 will completely disable any normalisation
+ * and a value of 1 will fully normalise field lengths. The default is 0.75. Values of b
+ * will be clamped to the range 0 - 1.
+ *
+ * @param {number} number - The value to set for this tuning parameter.
+ */
+lunr.Builder.prototype.b = function (number) {
+  if (number < 0) {
+    this._b = 0
+  } else if (number > 1) {
+    this._b = 1
+  } else {
+    this._b = number
+  }
+}
+
+/**
+ * A parameter that controls the speed at which a rise in term frequency results in term
+ * frequency saturation. The default value is 1.2. Setting this to a higher value will give
+ * slower saturation levels, a lower value will result in quicker saturation.
+ *
+ * @param {number} number - The value to set for this tuning parameter.
+ */
+lunr.Builder.prototype.k1 = function (number) {
+  this._k1 = number
+}
+
+/**
+ * Adds a document to the index.
+ *
+ * Before adding fields to the index the index should have been fully setup, with the document
+ * ref and all fields to index already having been specified.
+ *
+ * The document must have a field name as specified by the ref (by default this is 'id') and
+ * it should have all fields defined for indexing, though null or undefined values will not
+ * cause errors.
+ *
+ * @param {object} doc - The document to add to the index.
+ */
+lunr.Builder.prototype.add = function (doc) {
+  var docRef = doc[this._ref]
+
+  this.documentCount += 1
+
+  for (var i = 0; i < this._fields.length; i++) {
+    var fieldName = this._fields[i],
+        field = doc[fieldName],
+        tokens = this.tokenizer(field),
+        terms = this.pipeline.run(tokens),
+        fieldRef = new lunr.FieldRef (docRef, fieldName),
+        fieldTerms = Object.create(null)
+
+    this.fieldTermFrequencies[fieldRef] = fieldTerms
+    this.fieldLengths[fieldRef] = 0
+
+    // store the length of this field for this document
+    this.fieldLengths[fieldRef] += terms.length
+
+    // calculate term frequencies for this field
+    for (var j = 0; j < terms.length; j++) {
+      var term = terms[j]
+
+      if (fieldTerms[term] == undefined) {
+        fieldTerms[term] = 0
+      }
+
+      fieldTerms[term] += 1
+
+      // add to inverted index
+      // create an initial posting if one doesn't exist
+      if (this.invertedIndex[term] == undefined) {
+        var posting = Object.create(null)
+        posting["_index"] = this.termIndex
+        this.termIndex += 1
+
+        for (var k = 0; k < this._fields.length; k++) {
+          posting[this._fields[k]] = Object.create(null)
+        }
+
+        this.invertedIndex[term] = posting
+      }
+
+      // add an entry for this term/fieldName/docRef to the invertedIndex
+      if (this.invertedIndex[term][fieldName][docRef] == undefined) {
+        this.invertedIndex[term][fieldName][docRef] = Object.create(null)
+      }
+
+      // store all whitelisted metadata about this token in the
+      // inverted index
+      for (var l = 0; l < this.metadataWhitelist.length; l++) {
+        var metadataKey = this.metadataWhitelist[l],
+            metadata = term.metadata[metadataKey]
+
+        if (this.invertedIndex[term][fieldName][docRef][metadataKey] == undefined) {
+          this.invertedIndex[term][fieldName][docRef][metadataKey] = []
+        }
+
+        this.invertedIndex[term][fieldName][docRef][metadataKey].push(metadata)
+      }
+    }
+
+  }
+}
+
+/**
+ * Calculates the average document length for this index
+ *
+ * @private
+ */
+lunr.Builder.prototype.calculateAverageFieldLengths = function () {
+
+  var fieldRefs = Object.keys(this.fieldLengths),
+      numberOfFields = fieldRefs.length,
+      accumulator = {},
+      documentsWithField = {}
+
+  for (var i = 0; i < numberOfFields; i++) {
+    var fieldRef = lunr.FieldRef.fromString(fieldRefs[i]),
+        field = fieldRef.fieldName
+
+    documentsWithField[field] || (documentsWithField[field] = 0)
+    documentsWithField[field] += 1
+
+    accumulator[field] || (accumulator[field] = 0)
+    accumulator[field] += this.fieldLengths[fieldRef]
+  }
+
+  for (var i = 0; i < this._fields.length; i++) {
+    var field = this._fields[i]
+    accumulator[field] = accumulator[field] / documentsWithField[field]
+  }
+
+  this.averageFieldLength = accumulator
+}
+
+/**
+ * Builds a vector space model of every document using lunr.Vector
+ *
+ * @private
+ */
+lunr.Builder.prototype.createFieldVectors = function () {
+  var fieldVectors = {},
+      fieldRefs = Object.keys(this.fieldTermFrequencies),
+      fieldRefsLength = fieldRefs.length,
+      termIdfCache = Object.create(null)
+
+  for (var i = 0; i < fieldRefsLength; i++) {
+    var fieldRef = lunr.FieldRef.fromString(fieldRefs[i]),
+        field = fieldRef.fieldName,
+        fieldLength = this.fieldLengths[fieldRef],
+        fieldVector = new lunr.Vector,
+        termFrequencies = this.fieldTermFrequencies[fieldRef],
+        terms = Object.keys(termFrequencies),
+        termsLength = terms.length
+
+    for (var j = 0; j < termsLength; j++) {
+      var term = terms[j],
+          tf = termFrequencies[term],
+          termIndex = this.invertedIndex[term]._index,
+          idf, score, scoreWithPrecision
+
+      if (termIdfCache[term] === undefined) {
+        idf = lunr.idf(this.invertedIndex[term], this.documentCount)
+        termIdfCache[term] = idf
+      } else {
+        idf = termIdfCache[term]
+      }
+
+      score = idf * ((this._k1 + 1) * tf) / (this._k1 * (1 - this._b + this._b * (fieldLength / this.averageFieldLength[field])) + tf)
+      scoreWithPrecision = Math.round(score * 1000) / 1000
+      // Converts 1.23456789 to 1.234.
+      // Reducing the precision so that the vectors take up less
+      // space when serialised. Doing it now so that they behave
+      // the same before and after serialisation. Also, this is
+      // the fastest approach to reducing a number's precision in
+      // JavaScript.
+
+      fieldVector.insert(termIndex, scoreWithPrecision)
+    }
+
+    fieldVectors[fieldRef] = fieldVector
+  }
+
+  this.fieldVectors = fieldVectors
+}
+
+/**
+ * Creates a token set of all tokens in the index using lunr.TokenSet
+ *
+ * @private
+ */
+lunr.Builder.prototype.createTokenSet = function () {
+  this.tokenSet = lunr.TokenSet.fromArray(
+    Object.keys(this.invertedIndex).sort()
+  )
+}
+
+/**
+ * Builds the index, creating an instance of lunr.Index.
+ *
+ * This completes the indexing process and should only be called
+ * once all documents have been added to the index.
+ *
+ * @returns {lunr.Index}
+ */
+lunr.Builder.prototype.build = function () {
+  this.calculateAverageFieldLengths()
+  this.createFieldVectors()
+  this.createTokenSet()
+
+  return new lunr.Index({
+    invertedIndex: this.invertedIndex,
+    fieldVectors: this.fieldVectors,
+    tokenSet: this.tokenSet,
+    fields: this._fields,
+    pipeline: this.searchPipeline
+  })
+}
+
+/**
+ * Applies a plugin to the index builder.
+ *
+ * A plugin is a function that is called with the index builder as its context.
+ * Plugins can be used to customise or extend the behaviour of the index
+ * in some way. A plugin is just a function, that encapsulated the custom
+ * behaviour that should be applied when building the index.
+ *
+ * The plugin function will be called with the index builder as its argument, additional
+ * arguments can also be passed when calling use. The function will be called
+ * with the index builder as its context.
+ *
+ * @param {Function} plugin The plugin to apply.
+ */
+lunr.Builder.prototype.use = function (fn) {
+  var args = Array.prototype.slice.call(arguments, 1)
+  args.unshift(this)
+  fn.apply(this, args)
+}
+/**
+ * Contains and collects metadata about a matching document.
+ * A single instance of lunr.MatchData is returned as part of every
+ * lunr.Index~Result.
+ *
+ * @constructor
+ * @param {string} term - The term this match data is associated with
+ * @param {string} field - The field in which the term was found
+ * @param {object} metadata - The metadata recorded about this term in this field
+ * @property {object} metadata - A cloned collection of metadata associated with this document.
+ * @see {@link lunr.Index~Result}
+ */
+lunr.MatchData = function (term, field, metadata) {
+  var clonedMetadata = Object.create(null),
+      metadataKeys = Object.keys(metadata)
+
+  // Cloning the metadata to prevent the original
+  // being mutated during match data combination.
+  // Metadata is kept in an array within the inverted
+  // index so cloning the data can be done with
+  // Array#slice
+  for (var i = 0; i < metadataKeys.length; i++) {
+    var key = metadataKeys[i]
+    clonedMetadata[key] = metadata[key].slice()
+  }
+
+  this.metadata = Object.create(null)
+  this.metadata[term] = Object.create(null)
+  this.metadata[term][field] = clonedMetadata
+}
+
+/**
+ * An instance of lunr.MatchData will be created for every term that matches a
+ * document. However only one instance is required in a lunr.Index~Result. This
+ * method combines metadata from another instance of lunr.MatchData with this
+ * objects metadata.
+ *
+ * @param {lunr.MatchData} otherMatchData - Another instance of match data to merge with this one.
+ * @see {@link lunr.Index~Result}
+ */
+lunr.MatchData.prototype.combine = function (otherMatchData) {
+  var terms = Object.keys(otherMatchData.metadata)
+
+  for (var i = 0; i < terms.length; i++) {
+    var term = terms[i],
+        fields = Object.keys(otherMatchData.metadata[term])
+
+    if (this.metadata[term] == undefined) {
+      this.metadata[term] = Object.create(null)
+    }
+
+    for (var j = 0; j < fields.length; j++) {
+      var field = fields[j],
+          keys = Object.keys(otherMatchData.metadata[term][field])
+
+      if (this.metadata[term][field] == undefined) {
+        this.metadata[term][field] = Object.create(null)
+      }
+
+      for (var k = 0; k < keys.length; k++) {
+        var key = keys[k]
+
+        if (this.metadata[term][field][key] == undefined) {
+          this.metadata[term][field][key] = otherMatchData.metadata[term][field][key]
+        } else {
+          this.metadata[term][field][key] = this.metadata[term][field][key].concat(otherMatchData.metadata[term][field][key])
+        }
+
+      }
+    }
+  }
+}
+
+/**
+ * Add metadata for a term/field pair to this instance of match data.
+ *
+ * @param {string} term - The term this match data is associated with
+ * @param {string} field - The field in which the term was found
+ * @param {object} metadata - The metadata recorded about this term in this field
+ */
+lunr.MatchData.prototype.add = function (term, field, metadata) {
+  if (!(term in this.metadata)) {
+    this.metadata[term] = Object.create(null)
+    this.metadata[term][field] = metadata
+    return
+  }
+
+  if (!(field in this.metadata[term])) {
+    this.metadata[term][field] = metadata
+    return
+  }
+
+  var metadataKeys = Object.keys(metadata)
+
+  for (var i = 0; i < metadataKeys.length; i++) {
+    var key = metadataKeys[i]
+
+    if (key in this.metadata[term][field]) {
+      this.metadata[term][field][key] = this.metadata[term][field][key].concat(metadata[key])
+    } else {
+      this.metadata[term][field][key] = metadata[key]
+    }
+  }
+}
+/**
+ * A lunr.Query provides a programmatic way of defining queries to be performed
+ * against a {@link lunr.Index}.
+ *
+ * Prefer constructing a lunr.Query using the {@link lunr.Index#query} method
+ * so the query object is pre-initialized with the right index fields.
+ *
+ * @constructor
+ * @property {lunr.Query~Clause[]} clauses - An array of query clauses.
+ * @property {string[]} allFields - An array of all available fields in a lunr.Index.
+ */
+lunr.Query = function (allFields) {
+  this.clauses = []
+  this.allFields = allFields
+}
+
+/**
+ * Constants for indicating what kind of automatic wildcard insertion will be used when constructing a query clause.
+ *
+ * This allows wildcards to be added to the beginning and end of a term without having to manually do any string
+ * concatenation.
+ *
+ * The wildcard constants can be bitwise combined to select both leading and trailing wildcards.
+ *
+ * @constant
+ * @default
+ * @property {number} wildcard.NONE - The term will have no wildcards inserted, this is the default behaviour
+ * @property {number} wildcard.LEADING - Prepend the term with a wildcard, unless a leading wildcard already exists
+ * @property {number} wildcard.TRAILING - Append a wildcard to the term, unless a trailing wildcard already exists
+ * @see lunr.Query~Clause
+ * @see lunr.Query#clause
+ * @see lunr.Query#term
+ * @example <caption>query term with trailing wildcard</caption>
+ * query.term('foo', { wildcard: lunr.Query.wildcard.TRAILING })
+ * @example <caption>query term with leading and trailing wildcard</caption>
+ * query.term('foo', {
+ *   wildcard: lunr.Query.wildcard.LEADING | lunr.Query.wildcard.TRAILING
+ * })
+ */
+lunr.Query.wildcard = new String ("*")
+lunr.Query.wildcard.NONE = 0
+lunr.Query.wildcard.LEADING = 1
+lunr.Query.wildcard.TRAILING = 2
+
+/**
+ * A single clause in a {@link lunr.Query} contains a term and details on how to
+ * match that term against a {@link lunr.Index}.
+ *
+ * @typedef {Object} lunr.Query~Clause
+ * @property {string[]} fields - The fields in an index this clause should be matched against.
+ * @property {number} [boost=1] - Any boost that should be applied when matching this clause.
+ * @property {number} [editDistance] - Whether the term should have fuzzy matching applied, and how fuzzy the match should be.
+ * @property {boolean} [usePipeline] - Whether the term should be passed through the search pipeline.
+ * @property {number} [wildcard=0] - Whether the term should have wildcards appended or prepended.
+ */
+
+/**
+ * Adds a {@link lunr.Query~Clause} to this query.
+ *
+ * Unless the clause contains the fields to be matched all fields will be matched. In addition
+ * a default boost of 1 is applied to the clause.
+ *
+ * @param {lunr.Query~Clause} clause - The clause to add to this query.
+ * @see lunr.Query~Clause
+ * @returns {lunr.Query}
+ */
+lunr.Query.prototype.clause = function (clause) {
+  if (!('fields' in clause)) {
+    clause.fields = this.allFields
+  }
+
+  if (!('boost' in clause)) {
+    clause.boost = 1
+  }
+
+  if (!('usePipeline' in clause)) {
+    clause.usePipeline = true
+  }
+
+  if (!('wildcard' in clause)) {
+    clause.wildcard = lunr.Query.wildcard.NONE
+  }
+
+  if ((clause.wildcard & lunr.Query.wildcard.LEADING) && (clause.term.charAt(0) != lunr.Query.wildcard)) {
+    clause.term = "*" + clause.term
+  }
+
+  if ((clause.wildcard & lunr.Query.wildcard.TRAILING) && (clause.term.slice(-1) != lunr.Query.wildcard)) {
+    clause.term = "" + clause.term + "*"
+  }
+
+  this.clauses.push(clause)
+
+  return this
+}
+
+/**
+ * Adds a term to the current query, under the covers this will create a {@link lunr.Query~Clause}
+ * to the list of clauses that make up this query.
+ *
+ * @param {string} term - The term to add to the query.
+ * @param {Object} [options] - Any additional properties to add to the query clause.
+ * @returns {lunr.Query}
+ * @see lunr.Query#clause
+ * @see lunr.Query~Clause
+ * @example <caption>adding a single term to a query</caption>
+ * query.term("foo")
+ * @example <caption>adding a single term to a query and specifying search fields, term boost and automatic trailing wildcard</caption>
+ * query.term("foo", {
+ *   fields: ["title"],
+ *   boost: 10,
+ *   wildcard: lunr.Query.wildcard.TRAILING
+ * })
+ */
+lunr.Query.prototype.term = function (term, options) {
+  var clause = options || {}
+  clause.term = term
+
+  this.clause(clause)
+
+  return this
+}
+lunr.QueryParseError = function (message, start, end) {
+  this.name = "QueryParseError"
+  this.message = message
+  this.start = start
+  this.end = end
+}
+
+lunr.QueryParseError.prototype = new Error
+lunr.QueryLexer = function (str) {
+  this.lexemes = []
+  this.str = str
+  this.length = str.length
+  this.pos = 0
+  this.start = 0
+  this.escapeCharPositions = []
+}
+
+lunr.QueryLexer.prototype.run = function () {
+  var state = lunr.QueryLexer.lexText
+
+  while (state) {
+    state = state(this)
+  }
+}
+
+lunr.QueryLexer.prototype.sliceString = function () {
+  var subSlices = [],
+      sliceStart = this.start,
+      sliceEnd = this.pos
+
+  for (var i = 0; i < this.escapeCharPositions.length; i++) {
+    sliceEnd = this.escapeCharPositions[i]
+    subSlices.push(this.str.slice(sliceStart, sliceEnd))
+    sliceStart = sliceEnd + 1
+  }
+
+  subSlices.push(this.str.slice(sliceStart, this.pos))
+  this.escapeCharPositions.length = 0
+
+  return subSlices.join('')
+}
+
+lunr.QueryLexer.prototype.emit = function (type) {
+  this.lexemes.push({
+    type: type,
+    str: this.sliceString(),
+    start: this.start,
+    end: this.pos
+  })
+
+  this.start = this.pos
+}
+
+lunr.QueryLexer.prototype.escapeCharacter = function () {
+  this.escapeCharPositions.push(this.pos - 1)
+  this.pos += 1
+}
+
+lunr.QueryLexer.prototype.next = function () {
+  if (this.pos >= this.length) {
+    return lunr.QueryLexer.EOS
+  }
+
+  var char = this.str.charAt(this.pos)
+  this.pos += 1
+  return char
+}
+
+lunr.QueryLexer.prototype.width = function () {
+  return this.pos - this.start
+}
+
+lunr.QueryLexer.prototype.ignore = function () {
+  if (this.start == this.pos) {
+    this.pos += 1
+  }
+
+  this.start = this.pos
+}
+
+lunr.QueryLexer.prototype.backup = function () {
+  this.pos -= 1
+}
+
+lunr.QueryLexer.prototype.acceptDigitRun = function () {
+  var char, charCode
+
+  do {
+    char = this.next()
+    charCode = char.charCodeAt(0)
+  } while (charCode > 47 && charCode < 58)
+
+  if (char != lunr.QueryLexer.EOS) {
+    this.backup()
+  }
+}
+
+lunr.QueryLexer.prototype.more = function () {
+  return this.pos < this.length
+}
+
+lunr.QueryLexer.EOS = 'EOS'
+lunr.QueryLexer.FIELD = 'FIELD'
+lunr.QueryLexer.TERM = 'TERM'
+lunr.QueryLexer.EDIT_DISTANCE = 'EDIT_DISTANCE'
+lunr.QueryLexer.BOOST = 'BOOST'
+
+lunr.QueryLexer.lexField = function (lexer) {
+  lexer.backup()
+  lexer.emit(lunr.QueryLexer.FIELD)
+  lexer.ignore()
+  return lunr.QueryLexer.lexText
+}
+
+lunr.QueryLexer.lexTerm = function (lexer) {
+  if (lexer.width() > 1) {
+    lexer.backup()
+    lexer.emit(lunr.QueryLexer.TERM)
+  }
+
+  lexer.ignore()
+
+  if (lexer.more()) {
+    return lunr.QueryLexer.lexText
+  }
+}
+
+lunr.QueryLexer.lexEditDistance = function (lexer) {
+  lexer.ignore()
+  lexer.acceptDigitRun()
+  lexer.emit(lunr.QueryLexer.EDIT_DISTANCE)
+  return lunr.QueryLexer.lexText
+}
+
+lunr.QueryLexer.lexBoost = function (lexer) {
+  lexer.ignore()
+  lexer.acceptDigitRun()
+  lexer.emit(lunr.QueryLexer.BOOST)
+  return lunr.QueryLexer.lexText
+}
+
+lunr.QueryLexer.lexEOS = function (lexer) {
+  if (lexer.width() > 0) {
+    lexer.emit(lunr.QueryLexer.TERM)
+  }
+}
+
+// This matches the separator used when tokenising fields
+// within a document. These should match otherwise it is
+// not possible to search for some tokens within a document.
+//
+// It is possible for the user to change the separator on the
+// tokenizer so it _might_ clash with any other of the special
+// characters already used within the search string, e.g. :.
+//
+// This means that it is possible to change the separator in
+// such a way that makes some words unsearchable using a search
+// string.
+lunr.QueryLexer.termSeparator = lunr.tokenizer.separator
+
+lunr.QueryLexer.lexText = function (lexer) {
+  while (true) {
+    var char = lexer.next()
+
+    if (char == lunr.QueryLexer.EOS) {
+      return lunr.QueryLexer.lexEOS
+    }
+
+    // Escape character is '\'
+    if (char.charCodeAt(0) == 92) {
+      lexer.escapeCharacter()
+      continue
+    }
+
+    if (char == ":") {
+      return lunr.QueryLexer.lexField
+    }
+
+    if (char == "~") {
+      lexer.backup()
+      if (lexer.width() > 0) {
+        lexer.emit(lunr.QueryLexer.TERM)
+      }
+      return lunr.QueryLexer.lexEditDistance
+    }
+
+    if (char == "^") {
+      lexer.backup()
+      if (lexer.width() > 0) {
+        lexer.emit(lunr.QueryLexer.TERM)
+      }
+      return lunr.QueryLexer.lexBoost
+    }
+
+    if (char.match(lunr.QueryLexer.termSeparator)) {
+      return lunr.QueryLexer.lexTerm
+    }
+  }
+}
+
+lunr.QueryParser = function (str, query) {
+  this.lexer = new lunr.QueryLexer (str)
+  this.query = query
+  this.currentClause = {}
+  this.lexemeIdx = 0
+}
+
+lunr.QueryParser.prototype.parse = function () {
+  this.lexer.run()
+  this.lexemes = this.lexer.lexemes
+
+  var state = lunr.QueryParser.parseFieldOrTerm
+
+  while (state) {
+    state = state(this)
+  }
+
+  return this.query
+}
+
+lunr.QueryParser.prototype.peekLexeme = function () {
+  return this.lexemes[this.lexemeIdx]
+}
+
+lunr.QueryParser.prototype.consumeLexeme = function () {
+  var lexeme = this.peekLexeme()
+  this.lexemeIdx += 1
+  return lexeme
+}
+
+lunr.QueryParser.prototype.nextClause = function () {
+  var completedClause = this.currentClause
+  this.query.clause(completedClause)
+  this.currentClause = {}
+}
+
+lunr.QueryParser.parseFieldOrTerm = function (parser) {
+  var lexeme = parser.peekLexeme()
+
+  if (lexeme == undefined) {
+    return
+  }
+
+  switch (lexeme.type) {
+    case lunr.QueryLexer.FIELD:
+      return lunr.QueryParser.parseField
+    case lunr.QueryLexer.TERM:
+      return lunr.QueryParser.parseTerm
+    default:
+      var errorMessage = "expected either a field or a term, found " + lexeme.type
+
+      if (lexeme.str.length >= 1) {
+        errorMessage += " with value '" + lexeme.str + "'"
+      }
+
+      throw new lunr.QueryParseError (errorMessage, lexeme.start, lexeme.end)
+  }
+}
+
+lunr.QueryParser.parseField = function (parser) {
+  var lexeme = parser.consumeLexeme()
+
+  if (lexeme == undefined) {
+    return
+  }
+
+  if (parser.query.allFields.indexOf(lexeme.str) == -1) {
+    var possibleFields = parser.query.allFields.map(function (f) { return "'" + f + "'" }).join(', '),
+        errorMessage = "unrecognised field '" + lexeme.str + "', possible fields: " + possibleFields
+
+    throw new lunr.QueryParseError (errorMessage, lexeme.start, lexeme.end)
+  }
+
+  parser.currentClause.fields = [lexeme.str]
+
+  var nextLexeme = parser.peekLexeme()
+
+  if (nextLexeme == undefined) {
+    var errorMessage = "expecting term, found nothing"
+    throw new lunr.QueryParseError (errorMessage, lexeme.start, lexeme.end)
+  }
+
+  switch (nextLexeme.type) {
+    case lunr.QueryLexer.TERM:
+      return lunr.QueryParser.parseTerm
+    default:
+      var errorMessage = "expecting term, found '" + nextLexeme.type + "'"
+      throw new lunr.QueryParseError (errorMessage, nextLexeme.start, nextLexeme.end)
+  }
+}
+
+lunr.QueryParser.parseTerm = function (parser) {
+  var lexeme = parser.consumeLexeme()
+
+  if (lexeme == undefined) {
+    return
+  }
+
+  parser.currentClause.term = lexeme.str.toLowerCase()
+
+  if (lexeme.str.indexOf("*") != -1) {
+    parser.currentClause.usePipeline = false
+  }
+
+  var nextLexeme = parser.peekLexeme()
+
+  if (nextLexeme == undefined) {
+    parser.nextClause()
+    return
+  }
+
+  switch (nextLexeme.type) {
+    case lunr.QueryLexer.TERM:
+      parser.nextClause()
+      return lunr.QueryParser.parseTerm
+    case lunr.QueryLexer.FIELD:
+      parser.nextClause()
+      return lunr.QueryParser.parseField
+    case lunr.QueryLexer.EDIT_DISTANCE:
+      return lunr.QueryParser.parseEditDistance
+    case lunr.QueryLexer.BOOST:
+      return lunr.QueryParser.parseBoost
+    default:
+      var errorMessage = "Unexpected lexeme type '" + nextLexeme.type + "'"
+      throw new lunr.QueryParseError (errorMessage, nextLexeme.start, nextLexeme.end)
+  }
+}
+
+lunr.QueryParser.parseEditDistance = function (parser) {
+  var lexeme = parser.consumeLexeme()
+
+  if (lexeme == undefined) {
+    return
+  }
+
+  var editDistance = parseInt(lexeme.str, 10)
+
+  if (isNaN(editDistance)) {
+    var errorMessage = "edit distance must be numeric"
+    throw new lunr.QueryParseError (errorMessage, lexeme.start, lexeme.end)
+  }
+
+  parser.currentClause.editDistance = editDistance
+
+  var nextLexeme = parser.peekLexeme()
+
+  if (nextLexeme == undefined) {
+    parser.nextClause()
+    return
+  }
+
+  switch (nextLexeme.type) {
+    case lunr.QueryLexer.TERM:
+      parser.nextClause()
+      return lunr.QueryParser.parseTerm
+    case lunr.QueryLexer.FIELD:
+      parser.nextClause()
+      return lunr.QueryParser.parseField
+    case lunr.QueryLexer.EDIT_DISTANCE:
+      return lunr.QueryParser.parseEditDistance
+    case lunr.QueryLexer.BOOST:
+      return lunr.QueryParser.parseBoost
+    default:
+      var errorMessage = "Unexpected lexeme type '" + nextLexeme.type + "'"
+      throw new lunr.QueryParseError (errorMessage, nextLexeme.start, nextLexeme.end)
+  }
+}
+
+lunr.QueryParser.parseBoost = function (parser) {
+  var lexeme = parser.consumeLexeme()
+
+  if (lexeme == undefined) {
+    return
+  }
+
+  var boost = parseInt(lexeme.str, 10)
+
+  if (isNaN(boost)) {
+    var errorMessage = "boost must be numeric"
+    throw new lunr.QueryParseError (errorMessage, lexeme.start, lexeme.end)
+  }
+
+  parser.currentClause.boost = boost
+
+  var nextLexeme = parser.peekLexeme()
+
+  if (nextLexeme == undefined) {
+    parser.nextClause()
+    return
+  }
+
+  switch (nextLexeme.type) {
+    case lunr.QueryLexer.TERM:
+      parser.nextClause()
+      return lunr.QueryParser.parseTerm
+    case lunr.QueryLexer.FIELD:
+      parser.nextClause()
+      return lunr.QueryParser.parseField
+    case lunr.QueryLexer.EDIT_DISTANCE:
+      return lunr.QueryParser.parseEditDistance
+    case lunr.QueryLexer.BOOST:
+      return lunr.QueryParser.parseBoost
+    default:
+      var errorMessage = "Unexpected lexeme type '" + nextLexeme.type + "'"
+      throw new lunr.QueryParseError (errorMessage, nextLexeme.start, nextLexeme.end)
+  }
+}
+
+  /**
+   * export the module via AMD, CommonJS or as a browser global
+   * Export code from https://github.com/umdjs/umd/blob/master/returnExports.js
+   */
+  ;(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+      // AMD. Register as an anonymous module.
+      define(factory)
+    } else if (typeof exports === 'object') {
+      /**
+       * Node. Does not work with strict CommonJS, but
+       * only CommonJS-like enviroments that support module.exports,
+       * like Node.
+       */
+      module.exports = factory()
+    } else {
+      // Browser globals (root is window)
+      root.lunr = factory()
+    }
+  }(this, function () {
+    /**
+     * Just return a value to define the module export.
+     * This example returns an object, but the module
+     * can return a function as the exported value.
+     */
+    return lunr
+  }))
+})();
diff --git a/docs/search/main.js b/docs/search/main.js
new file mode 100644
index 00000000..0a82ab56
--- /dev/null
+++ b/docs/search/main.js
@@ -0,0 +1,96 @@
+function getSearchTermFromLocation() {
+  var sPageURL = window.location.search.substring(1);
+  var sURLVariables = sPageURL.split('&');
+  for (var i = 0; i < sURLVariables.length; i++) {
+    var sParameterName = sURLVariables[i].split('=');
+    if (sParameterName[0] == 'q') {
+      return decodeURIComponent(sParameterName[1].replace(/\+/g, '%20'));
+    }
+  }
+}
+
+function joinUrl (base, path) {
+  if (path.substring(0, 1) === "/") {
+    // path starts with `/`. Thus it is absolute.
+    return path;
+  }
+  if (base.substring(base.length-1) === "/") {
+    // base ends with `/`
+    return base + path;
+  }
+  return base + "/" + path;
+}
+
+function formatResult (location, title, summary) {
+  return '<article><h3><a href="' + joinUrl(base_url, location) + '">'+ title + '</a></h3><p>' + summary +'</p></article>';
+}
+
+function displayResults (results) {
+  var search_results = document.getElementById("mkdocs-search-results");
+  while (search_results.firstChild) {
+    search_results.removeChild(search_results.firstChild);
+  }
+  if (results.length > 0){
+    for (var i=0; i < results.length; i++){
+      var result = results[i];
+      var html = formatResult(result.location, result.title, result.summary);
+      search_results.insertAdjacentHTML('beforeend', html);
+    }
+  } else {
+    search_results.insertAdjacentHTML('beforeend', "<p>No results found</p>");
+  }
+}
+
+function doSearch () {
+  var query = document.getElementById('mkdocs-search-query').value;
+  if (query.length > 2) {
+    if (!window.Worker) {
+      displayResults(search(query));
+    } else {
+      searchWorker.postMessage({query: query});
+    }
+  } else {
+    // Clear results for short queries
+    displayResults([]);
+  }
+}
+
+function initSearch () {
+  var search_input = document.getElementById('mkdocs-search-query');
+  if (search_input) {
+    search_input.addEventListener("keyup", doSearch);
+  }
+  var term = getSearchTermFromLocation();
+  if (term) {
+    search_input.value = term;
+    doSearch();
+  }
+}
+
+function onWorkerMessage (e) {
+  if (e.data.allowSearch) {
+    initSearch();
+  } else if (e.data.results) {
+    var results = e.data.results;
+    displayResults(results);
+  }
+}
+
+if (!window.Worker) {
+  console.log('Web Worker API not supported');
+  // load index in main thread
+  $.getScript(joinUrl(base_url, "search/worker.js")).done(function () {
+    console.log('Loaded worker');
+    init();
+    window.postMessage = function (msg) {
+      onWorkerMessage({data: msg});
+    };
+  }).fail(function (jqxhr, settings, exception) {
+    console.error('Could not load worker.js');
+  });
+} else {
+  // Wrap search in a web worker
+  var searchWorker = new Worker(joinUrl(base_url, "search/worker.js"));
+  searchWorker.postMessage({init: true});
+  searchWorker.onmessage = onWorkerMessage;
+}
diff --git a/docs/search/search_index.json b/docs/search/search_index.json
index 15b59cbe..5fcacec0 100644
--- a/docs/search/search_index.json
+++ b/docs/search/search_index.json
@@ -1,1144 +1 @@
-{
-    "docs": [
-        {
-            "location": "/about/",
-            "text": "About\n\n\nWhat is guizero?\n\n\nguizero is a Python 3 library for creating simple GUIs. \n\n\nIt is designed to allow new learners to quickly and easily create GUIs for their programs.\n\n\n\n\nfrom guizero import App, Text, PushButton\n\napp = App(title=\"guizero\")\n\nintro = Text(app, text=\"Have a go with guizero and see what you can create.\")\nok = PushButton(app, text=\"Ok\")\n\napp.display()\n\n\n\n\nAims\n\n\nThe aim of guizero is to make the process of creating simple GUIs quick, accessible and understandable for new learners.\n\n\n\n\nWorks with standard Python Tkinter GUI library (and no need to install other libraries)\n\n\nAbstracts away details new learners find difficult to understand (such as Tkinter StringVar() objects)\n\n\nAccessible widget naming system to help new learners to build up a mental model\n\n\nFlexible enough to be used for projects up to A-Level standard, yet accessible to primary school children\n\n\nComprehensive and accessible documentation with examples\n\n\nGenerates helpful additional error messages\n\n\n\n\nVersion\n\n\nguizero is currently \nversion 0.6.3\n\n\nThere may be bugs and features may change and be updated.",
-            "title": "About"
-        },
-        {
-            "location": "/about/#about",
-            "text": "",
-            "title": "About"
-        },
-        {
-            "location": "/about/#what-is-guizero",
-            "text": "guizero is a Python 3 library for creating simple GUIs.   It is designed to allow new learners to quickly and easily create GUIs for their programs.   from guizero import App, Text, PushButton\n\napp = App(title=\"guizero\")\n\nintro = Text(app, text=\"Have a go with guizero and see what you can create.\")\nok = PushButton(app, text=\"Ok\")\n\napp.display()",
-            "title": "What is guizero?"
-        },
-        {
-            "location": "/about/#aims",
-            "text": "The aim of guizero is to make the process of creating simple GUIs quick, accessible and understandable for new learners.   Works with standard Python Tkinter GUI library (and no need to install other libraries)  Abstracts away details new learners find difficult to understand (such as Tkinter StringVar() objects)  Accessible widget naming system to help new learners to build up a mental model  Flexible enough to be used for projects up to A-Level standard, yet accessible to primary school children  Comprehensive and accessible documentation with examples  Generates helpful additional error messages",
-            "title": "Aims"
-        },
-        {
-            "location": "/about/#version",
-            "text": "guizero is currently  version 0.6.3  There may be bugs and features may change and be updated.",
-            "title": "Version"
-        },
-        {
-            "location": "/",
-            "text": "Installation\n\n\nguizero is designed to allow new learners to quickly and easily create GUIs for their programs.\n\n\nIf you can download and unzip a file, you can \ninstall guizero\n - \nno special permissions or administrator rights are required\n.\n\n\nIf you have administrator rights and are connected to the internet, you can use \npip to install guizero\n.\n\n\nEasy install\n\n\n\n\n\n\nGo to the \nguizero repository\n on GitHub.\n\n\n\n\n\n\nClick the green \"Clone or download\" button and then \"Download ZIP\"\n\n\n\n\n\n\n\n\nOpen the zip file\n\n\n\n\n\n\nOpen the \nguizero-master\n folder, then copy the \nguizero\n folder and paste it into your home directory\n\n\n\n\n\n\nWindows\n\n\n\n\n\n\n\n\nmacOS\n\n\n\n\n\n\n\n\n\n\n\n\nThat's it! When you write your guizero code, make sure you save it into your home directory.\n\n\n\n\n\n\nInstall using pip\n\n\nYou can use the command prompt and \npip\n to install guizero for:\n\n\n\n\nWindows\n\n\nmacOS\n\n\nRaspberry Pi\n\n\nLinux\n\n\n\n\npip\n can also be used to \ninstall additional features\n and \nupgrade guizero\n.\n\n\nWindows\n\n\n\n\n\n\nOpen a command prompt by clicking \nStart\n > \nWindows System\n > \nCommand Prompt\n, or by typing 'command' into the start menu's search bar.\n\n\n\n\n\n\n\n\nType this command and press enter:\n\n\npip3 install guizero\n\n\n\n\n\n\n\n\nIf you experience problems, have a look at this guide to \nUsing pip on Windows\n.\n\n\nmacOS\n\n\n\n\n\n\nOpen a terminal window by clicking \nApplications\n > \nUtilities\n > \nTerminal\n, or by typing 'terminal' into the desktop's search bar.\n\n\n\n\n\n\n\n\nType this command and press enter:\n\n\npip3 install guizero\n\n\n\n\n\n\n\n\nRaspberry Pi\n\n\n\n\n\n\nOpen a terminal window by clicking \nMenu\n > \nAccessories\n > \nTerminal\n.\n\n\n\n\n\n\n\n\nType this command and press enter:\n\n\nsudo pip3 install guizero\n\n\n\n\n\n\n\n\nLinux\n\n\n\n\nOpen a terminal\n\n\nInstall \ntkinter\n using your distribution's package manager, e.g. \nsudo apt install python3-tk\n\n\n\n\nInstall guizero using pip by typing \npip3 install guizero\n or \nsudo pip3 install guizero\n if you dont have superuser rights\n\n\n\n\n\n\n\n\nAdditional features install\n\n\nTo use the additional \nimage features\n of guizero such as:\n\n\n\n\nJPG image support\n\n\nscaling images\n\n\nanimated gifs \n\n\n\n\n... you will need to install guizero with the pip command:\n\n\n\n\n\n\nWindows / macOS\n\n\npip3 install guizero[images]\n\n\n\n\n\n\nLinux / Raspberry Pi\n\n\nsudo pip3 install guizero[images]\n\n\n\n\n\n\nUpgrading\n\n\nUpgrade guizero using the pip command \n\n\n\n\n\n\nWindows / macOS\n\n\npip3 install guizero --upgrade\n\n\n\n\n\n\nLinux / Raspberry Pi\n\n\nsudo pip3 install guizero --upgrade",
-            "title": "Installation"
-        },
-        {
-            "location": "/#installation",
-            "text": "guizero is designed to allow new learners to quickly and easily create GUIs for their programs.  If you can download and unzip a file, you can  install guizero  -  no special permissions or administrator rights are required .  If you have administrator rights and are connected to the internet, you can use  pip to install guizero .",
-            "title": "Installation"
-        },
-        {
-            "location": "/#easy-install",
-            "text": "Go to the  guizero repository  on GitHub.    Click the green \"Clone or download\" button and then \"Download ZIP\"     Open the zip file    Open the  guizero-master  folder, then copy the  guizero  folder and paste it into your home directory    Windows     macOS       That's it! When you write your guizero code, make sure you save it into your home directory.",
-            "title": "Easy install"
-        },
-        {
-            "location": "/#install-using-pip",
-            "text": "You can use the command prompt and  pip  to install guizero for:   Windows  macOS  Raspberry Pi  Linux   pip  can also be used to  install additional features  and  upgrade guizero .",
-            "title": "Install using pip"
-        },
-        {
-            "location": "/#windows",
-            "text": "Open a command prompt by clicking  Start  >  Windows System  >  Command Prompt , or by typing 'command' into the start menu's search bar.     Type this command and press enter:  pip3 install guizero     If you experience problems, have a look at this guide to  Using pip on Windows .",
-            "title": "Windows"
-        },
-        {
-            "location": "/#macos",
-            "text": "Open a terminal window by clicking  Applications  >  Utilities  >  Terminal , or by typing 'terminal' into the desktop's search bar.     Type this command and press enter:  pip3 install guizero",
-            "title": "macOS"
-        },
-        {
-            "location": "/#raspberry-pi",
-            "text": "Open a terminal window by clicking  Menu  >  Accessories  >  Terminal .     Type this command and press enter:  sudo pip3 install guizero",
-            "title": "Raspberry Pi"
-        },
-        {
-            "location": "/#linux",
-            "text": "Open a terminal  Install  tkinter  using your distribution's package manager, e.g.  sudo apt install python3-tk   Install guizero using pip by typing  pip3 install guizero  or  sudo pip3 install guizero  if you dont have superuser rights",
-            "title": "Linux"
-        },
-        {
-            "location": "/#additional-features-install",
-            "text": "To use the additional  image features  of guizero such as:   JPG image support  scaling images  animated gifs    ... you will need to install guizero with the pip command:    Windows / macOS  pip3 install guizero[images]    Linux / Raspberry Pi  sudo pip3 install guizero[images]",
-            "title": "Additional features install"
-        },
-        {
-            "location": "/#upgrading",
-            "text": "Upgrade guizero using the pip command     Windows / macOS  pip3 install guizero --upgrade    Linux / Raspberry Pi  sudo pip3 install guizero --upgrade",
-            "title": "Upgrading"
-        },
-        {
-            "location": "/start/",
-            "text": "Getting Started\n\n\nAt the start of every guizero program, choose the widgets you need from the guizero library and import them:\n\n\nfrom guizero import App, PushButton, Slider\n\n\n\n\nYou only need to import each widget once, and then you can use it in your program as many times as you like.\n\n\nHello World\n\n\nAll guizero projects begin with a main window which is called an \nApp\n. At the end of every guizero program you must tell the program to display the app you have just created.\n\n\nLet's create an app window with the title \"Hello world\":\n\n\nfrom guizero import App\napp = App(title=\"Hello world\")\napp.display()\n\n\n\n\nSave and run the code - you've created your first guizero app!\n\n\nAdding widgets\n\n\nWidgets are the things which appear on the GUI, such as text boxes, buttons, sliders and even plain old pieces of text.\n\n\nAll widgets\n go between the line of code to create the \nApp\n and the \napp.display()\n line.\n\n\nfrom guizero import App, Text\napp = App(title=\"Hello world\")\nmessage = Text(app, text=\"Welcome to the Hello world app!\")\napp.display()\n\n\n\n\n\n\nLet\u2019s look at the \nText\n widget code in a bit more detail:\n\n\nmessage = Text(app, text=\"Welcome to the Hello world app!\")\n\n\n\n\n\n\nmessage =\n - The \nText\n object has a name, just like any variable\n\n\nText\n - an \nobject\n which creates a piece of text on the screen\n\n\napp\n \u2013 This tells the \nText\n where it will live. Most of the time your widgets will live directly inside the app.\n\n\ntext=\"Welcome to the Hello world app!\"\n - The text to display\n\n\n\n\nAnd that's it! Now have a look on the documentation pages for the individual widgets to find out more about how to use them.",
-            "title": "Getting started"
-        },
-        {
-            "location": "/start/#getting-started",
-            "text": "At the start of every guizero program, choose the widgets you need from the guizero library and import them:  from guizero import App, PushButton, Slider  You only need to import each widget once, and then you can use it in your program as many times as you like.",
-            "title": "Getting Started"
-        },
-        {
-            "location": "/start/#hello-world",
-            "text": "All guizero projects begin with a main window which is called an  App . At the end of every guizero program you must tell the program to display the app you have just created.  Let's create an app window with the title \"Hello world\":  from guizero import App\napp = App(title=\"Hello world\")\napp.display()  Save and run the code - you've created your first guizero app!",
-            "title": "Hello World"
-        },
-        {
-            "location": "/start/#adding-widgets",
-            "text": "Widgets are the things which appear on the GUI, such as text boxes, buttons, sliders and even plain old pieces of text.  All widgets  go between the line of code to create the  App  and the  app.display()  line.  from guizero import App, Text\napp = App(title=\"Hello world\")\nmessage = Text(app, text=\"Welcome to the Hello world app!\")\napp.display()   Let\u2019s look at the  Text  widget code in a bit more detail:  message = Text(app, text=\"Welcome to the Hello world app!\")   message =  - The  Text  object has a name, just like any variable  Text  - an  object  which creates a piece of text on the screen  app  \u2013 This tells the  Text  where it will live. Most of the time your widgets will live directly inside the app.  text=\"Welcome to the Hello world app!\"  - The text to display   And that's it! Now have a look on the documentation pages for the individual widgets to find out more about how to use them.",
-            "title": "Adding widgets"
-        },
-        {
-            "location": "/commands/",
-            "text": "Commands\n\n\nWidgets in guizero can be given a \ncommand\n when created, which can be used to call a function when the widget is used.\n\n\nBy using commands you can make your GUI change and take actions when the user uses it e.g. clicking a button, selecting an option, typing a message. \n\n\nExample\n\n\nCreate an application which puts \nhello world\n on the GUI when a button is pressed:\n\n\nfrom guizero import App, Text, PushButton\n\ndef say_hello():\n    text.value = \"hello world\"\n\napp = App()\ntext = Text(app)\nbutton = PushButton(app, command=say_hello)\napp.display()",
-            "title": "Commands"
-        },
-        {
-            "location": "/commands/#commands",
-            "text": "Widgets in guizero can be given a  command  when created, which can be used to call a function when the widget is used.  By using commands you can make your GUI change and take actions when the user uses it e.g. clicking a button, selecting an option, typing a message.",
-            "title": "Commands"
-        },
-        {
-            "location": "/commands/#example",
-            "text": "Create an application which puts  hello world  on the GUI when a button is pressed:  from guizero import App, Text, PushButton\n\ndef say_hello():\n    text.value = \"hello world\"\n\napp = App()\ntext = Text(app)\nbutton = PushButton(app, command=say_hello)\napp.display()",
-            "title": "Example"
-        },
-        {
-            "location": "/multiple_windows/",
-            "text": "Multiple Windows\n\n\nA guizero application should only have have 1 \nApp\n object, this is the main window and controller of your program.\n\n\nIf you want to create a 2nd (or 3rd, 4th, 5th) window, your program should use a \nWindow\n object.\n\n\nA 2nd Window\n\n\nCreating a 2nd Window is easy and just like creating a widget you need to pass it the App:\n\n\nfrom guizero import App, Window\n\napp = App(title=\"Main window\")\nwindow = Window(app, title=\"2nd window\")\n\napp.display()\n\n\n\n\n\nAdding widgets to the 2nd window is the same as adding them to an app, by passing the name of the window:\n\n\nfrom guizero import App, Window, Text\n\napp = App(title=\"Main window\")\nwindow = Window(app, title=\"2nd window\")\ntext = Text(window, text=\"text\")\n\napp.display()\n\n\n\n\n\nOpening and closing windows\n\n\nWhen a \nWindow\n object is created it is immediately displayed on the screen, you can control it using the \nshow()\n and \nhide()\n methods.\n\n\nTo make a window which is shown when a button on the \nApp\n is clicked and closed when a button is clicked on the \nWindow\n.\n\n\nfrom guizero import App, Window\n\ndef open_window():\n    window.show()\n\ndef close_window():\n    window.hide()\n\napp = App(title=\"Main window\")\n\nwindow = Window(app, title=\"2nd window\")\nwindow.hide()\n\nopen_button = PushButton(app, text=\"Open\", command=open_window)\nclose_button = PushButton(window, text=\"Close\", command=close_window)\n\napp.display()\n\n\n\n\nModal windows\n\n\nWhen a window is opened using \nshow()\n it is opening side by side with the main window, and both windows can be used at the same time\n\n\nTo open a \"modal\" window which prevents the other windows in the applcation being used until it is closed you can pass \nTrue\n to the optional \nwait\n parameter of \nshow\n e.g. \nwindow.show(wait=True)\n.\n\n\nThis will force all other windows to wait until this window is closed before they can be used.\n\n\ndef open_window():\n    window.show(wait=True)",
-            "title": "Multiple windows"
-        },
-        {
-            "location": "/multiple_windows/#multiple-windows",
-            "text": "A guizero application should only have have 1  App  object, this is the main window and controller of your program.  If you want to create a 2nd (or 3rd, 4th, 5th) window, your program should use a  Window  object.",
-            "title": "Multiple Windows"
-        },
-        {
-            "location": "/multiple_windows/#a-2nd-window",
-            "text": "Creating a 2nd Window is easy and just like creating a widget you need to pass it the App:  from guizero import App, Window\n\napp = App(title=\"Main window\")\nwindow = Window(app, title=\"2nd window\")\n\napp.display()  Adding widgets to the 2nd window is the same as adding them to an app, by passing the name of the window:  from guizero import App, Window, Text\n\napp = App(title=\"Main window\")\nwindow = Window(app, title=\"2nd window\")\ntext = Text(window, text=\"text\")\n\napp.display()",
-            "title": "A 2nd Window"
-        },
-        {
-            "location": "/multiple_windows/#opening-and-closing-windows",
-            "text": "When a  Window  object is created it is immediately displayed on the screen, you can control it using the  show()  and  hide()  methods.  To make a window which is shown when a button on the  App  is clicked and closed when a button is clicked on the  Window .  from guizero import App, Window\n\ndef open_window():\n    window.show()\n\ndef close_window():\n    window.hide()\n\napp = App(title=\"Main window\")\n\nwindow = Window(app, title=\"2nd window\")\nwindow.hide()\n\nopen_button = PushButton(app, text=\"Open\", command=open_window)\nclose_button = PushButton(window, text=\"Close\", command=close_window)\n\napp.display()",
-            "title": "Opening and closing windows"
-        },
-        {
-            "location": "/multiple_windows/#modal-windows",
-            "text": "When a window is opened using  show()  it is opening side by side with the main window, and both windows can be used at the same time  To open a \"modal\" window which prevents the other windows in the applcation being used until it is closed you can pass  True  to the optional  wait  parameter of  show  e.g.  window.show(wait=True) .  This will force all other windows to wait until this window is closed before they can be used.  def open_window():\n    window.show(wait=True)",
-            "title": "Modal windows"
-        },
-        {
-            "location": "/layout/",
-            "text": "Layouts\n\n\nThe layout of your GUI is how you arrange the widgets in the window.\n\n\nWidgets can be arranged into \"containers\" (e.g. \nApp\n, \nWindow\n, \nBox\n) using either of these layouts:\n\n\n\n\nauto\n - where widgets are positioned automatically\n\n\ngrid\n - you specify where in a grid each widget should be positioned\n\n\n\n\nThe layout is set using \nlayout\n parameter of the container e.g.\n\n\napp = App(layout=\"auto\")\napp = App(layout=\"grid\")\n\n\n\n\nIf no \nlayout\n parameter is specified, the default \nauto\n layout is used.\n\n\nAuto layout\n\n\nauto\n is the default layout used when a container is created. All widgets will be arranged in the order they are created and aligned to the centre, e.g. the following code will create two Text widgets, one on top of the other.\n\n\nfrom guizero import App, Text\napp = App()\ntext_1 = Text(app, text=\"on top\")\ntext_2 = Text(app, text=\"below\")\napp.display()\n\n\n\n\n\n\nAligning\n\n\nWidgets can be aligned to either the \ntop\n, \nbottom\n, \nleft\n or \nright\n, using the \nalign\n property when created.\n\n\nAligning Widgets will cause them to be \"stuck\" to that side of the container e.g.\n\n\nfrom guizero import App, Text\napp = App()\ntop_text = Text(app, text=\"at the top\", align=\"top\")\nbottom_text = Text(app, text=\"at the bottom\", align=\"bottom\")\nleft_text = Text(app, text=\"to the left\", align=\"left\")\nright_text = Text(app, text=\"to the right\", align=\"right\")\napp.display()\n\n\n\n\n\n\nBy aligning multiple widgets to the same side of the container, widgets can be made to stack together e.g.\n\n\nfrom guizero import App, Text, TextBox, PushButton\napp = App()\ntext = Text(app, text=\"label\", align=\"left\")\ntext_box = TextBox(app, text=\"enter text\", align=\"left\")\nbutton = PushButton(app, text=\"submit\", align=\"left\")\napp.display()\n\n\n\n\n\n\nThe widgets will stack in the order they are created, so the widget created first will be closest to the edge in the direction specified.\n\n\nFilling\n\n\nWidgets can also be made to \"fill\" all the available space by setting the \nwidth\n and \nheight\n parameters to \nfill\n.\n\n\ne.g.\n\n\nA TextBox could span the entire width of the container:\n\n\nfrom guizero import App, TextBox\napp = App()\ntext_box = TextBox(app, text=\"enter text\", width=\"fill\")\napp.display()\n\n\n\n\n\n\nOr a ListBox could fill the left hand side by using \nfill\n for the \nheight\n and \nalign\n to the \nleft\n e.g.\n\n\nfrom guizero import App, ListBox\napp = App()\nlist_box = ListBox(app, items=[\"a list\"], height=\"fill\", align=\"left\")\napp.display()\n\n\n\n\n\n\nUsing \nfill\n for the \nwidth\n and the \nheight\n will make a widget use all the available space e.g.\n\n\nfrom guizero import App, PushButton\napp = App()\nbutton = PushButton(app, width=\"fill\", height=\"fill\")\napp.display()\n\n\n\n\n\n\nWhen multiple widgets use \nfill\n the Window Manager (operating system) will distribute the space accordingly between all the widgets which need to fill it.\n\n\nfrom guizero import App, ListBox, PushButton\napp = App()\nlist_box = ListBox(app, items=[\"a list\", \"of items\", \"yay\"], height=\"fill\", align=\"left\")\nbutton = PushButton(app, width=\"fill\", height=\"fill\", align=\"right\")\napp.display()\n\n\n\n\n\n\nNote :\n Using fill may not always have the effect you are expecting as it is up to the operating system to distribute screen space.\n\n\nGrid layout\n\n\nThe \ngrid\n layout allows you to position widgets into a virtual grid.\n\n\nWhen you create a widget you will need to pass an extra parameter called \ngrid\n which is a list containing \n[x,y]\n coordinates for where you want the widget to appear, like this:\n\n\napp = App(layout=\"grid\")\ntext = Text(app, text=\"Hello world\", grid=[0,1])\n\n\n\n\nThere is no need to specify the width or height of the grid you want - it will expand depending on the coordinates you provide with each widget. However, grid cells containing no objects will have no height or width.\n\n\nThis is really useful when creating GUIs where you want widgets to line up.\n\n\ne.g.\n\n\nCreating a number keypad:\n\n\n\n\nfrom guizero import App, PushButton\n\napp = App(layout=\"grid\")\n\nbutton1 = PushButton(app, text=\"1\", grid=[0,0])\nbutton2 = PushButton(app, text=\"2\", grid=[1,0])\nbutton3  = PushButton(app, text=\"3\", grid=[2,0])\nbutton4  = PushButton(app, text=\"4\", grid=[0,1])\nbutton5  = PushButton(app, text=\"5\", grid=[1,1])\nbutton6  = PushButton(app, text=\"6\", grid=[2,1])\nbutton7  = PushButton(app, text=\"7\", grid=[0,2])\nbutton8  = PushButton(app, text=\"8\", grid=[1,2])\nbutton9  = PushButton(app, text=\"9\", grid=[2,2])\nbutton0  = PushButton(app, text=\"0\", grid=[1,3])\n\napp.display()\n\n\n\n\nYou can also align widgets within the grid, e.g. when you are creating a form:\n\n\n\n\nfrom guizero import App, Text, TextBox\n\napp = App(layout=\"grid\")\n\nname_label = Text(app, text=\"Name\", grid=[0,0], align=\"left\")\nname = TextBox(app, grid=[1,0])\nsurname_label = Text(app, text=\"Surname\", grid=[0,1], align=\"left\")\nsurname = TextBox(app, grid=[1,1])\ndob_label = Text(app, text=\"Date of Birth\", grid=[0,2], align=\"left\")\ndob = TextBox(app, grid=[1,2])\n\napp.display()\n\n\n\n\nSpanning columns or rows\n\n\nWidgets can be made to span multiple columns or rows by specifying the span within the grid parameter. These are optional, but if specified both must be included using the format \n[x,y,xspan,yspan]\n.\n\n\nThe example below shows text widget located at 0,1 spanning two columns (x) and one row (y):\n\n\ntext = Text(app, text=\"Hello world\", grid=[0,1,2,1])\n\n\n\n\nThis can be used to include widgets of different sizes arranged alongside each other.\n\n\nfrom guizero import App, Picture\n\napp = App(layout=\"grid\")\n\npicture1 = Picture(app, image=\"std1.gif\", grid=[0,0])\npicture2 = Picture(app, image=\"std2.gif\", grid=[1,0])\npicture3 = Picture(app, image=\"tall1.gif\", grid=[2,0,1,2])\npicture4 = Picture(app, image=\"wide1.gif\", grid=[0,1,2,1])\n\napp.display()\n\n\n\n\n\n\nBoxes\n\n\nBy using a \nBox\n widget you can segment your GUI into different sections allowing you to lay out your user interface in any way you want.\n\n\n\n\ncode for example above\n\n\nIf you wanted to create a title in the top left hand corner of your GUI, you could use a \nBox\n which fills the top of the \nApp\n and put a \nText\n widget inside aligned to the \nleft\n.\n\n\nfrom guizero import App, Box, Text\napp = App()\n\ntitle_box = Box(app, width=\"fill\", align=\"top\")\ntitle = Text(title_box, text=\"title\", align=\"left\")\n\napp.display()\n\n\n\n\n\n\nYou may find it easier to design your layout if your Boxes have borders, which can be done by setting the \nborder\n parameter on \nBox\n to \nTrue\n.\n\n\ntitle_box = Box(app, width=\"fill\", align=\"top\", border=True)\n\n\n\n\n\n\nA similar method can be used to put \"OK\" and \"Cancel\" buttons at the bottom right of the GUI. Remember that the widgets will get stacked on the right in order of creation, so the cancel button is created first.\n\n\nfrom guizero import App, Box, PushButton\napp = App()\n\nbuttons_box = Box(app, width=\"fill\", align=\"bottom\")\ncancel = PushButton(buttons_box, text=\"Cancel\", align=\"right\")\nok = PushButton(buttons_box, text=\"OK\", align=\"right\")\n\napp.display()\n\n\n\n\n\n\nNote :\n A \nBox\n can also be contained in a \nBox\n, allowing you to layer boxes and position your widgets.\n\n\nTip :\n When creating a GUI you may find it easier to design it first on paper, noting where your boxes will be positioned.",
-            "title": "Layouts"
-        },
-        {
-            "location": "/layout/#layouts",
-            "text": "The layout of your GUI is how you arrange the widgets in the window.  Widgets can be arranged into \"containers\" (e.g.  App ,  Window ,  Box ) using either of these layouts:   auto  - where widgets are positioned automatically  grid  - you specify where in a grid each widget should be positioned   The layout is set using  layout  parameter of the container e.g.  app = App(layout=\"auto\")\napp = App(layout=\"grid\")  If no  layout  parameter is specified, the default  auto  layout is used.",
-            "title": "Layouts"
-        },
-        {
-            "location": "/layout/#auto-layout",
-            "text": "auto  is the default layout used when a container is created. All widgets will be arranged in the order they are created and aligned to the centre, e.g. the following code will create two Text widgets, one on top of the other.  from guizero import App, Text\napp = App()\ntext_1 = Text(app, text=\"on top\")\ntext_2 = Text(app, text=\"below\")\napp.display()",
-            "title": "Auto layout"
-        },
-        {
-            "location": "/layout/#aligning",
-            "text": "Widgets can be aligned to either the  top ,  bottom ,  left  or  right , using the  align  property when created.  Aligning Widgets will cause them to be \"stuck\" to that side of the container e.g.  from guizero import App, Text\napp = App()\ntop_text = Text(app, text=\"at the top\", align=\"top\")\nbottom_text = Text(app, text=\"at the bottom\", align=\"bottom\")\nleft_text = Text(app, text=\"to the left\", align=\"left\")\nright_text = Text(app, text=\"to the right\", align=\"right\")\napp.display()   By aligning multiple widgets to the same side of the container, widgets can be made to stack together e.g.  from guizero import App, Text, TextBox, PushButton\napp = App()\ntext = Text(app, text=\"label\", align=\"left\")\ntext_box = TextBox(app, text=\"enter text\", align=\"left\")\nbutton = PushButton(app, text=\"submit\", align=\"left\")\napp.display()   The widgets will stack in the order they are created, so the widget created first will be closest to the edge in the direction specified.",
-            "title": "Aligning"
-        },
-        {
-            "location": "/layout/#filling",
-            "text": "Widgets can also be made to \"fill\" all the available space by setting the  width  and  height  parameters to  fill .  e.g.  A TextBox could span the entire width of the container:  from guizero import App, TextBox\napp = App()\ntext_box = TextBox(app, text=\"enter text\", width=\"fill\")\napp.display()   Or a ListBox could fill the left hand side by using  fill  for the  height  and  align  to the  left  e.g.  from guizero import App, ListBox\napp = App()\nlist_box = ListBox(app, items=[\"a list\"], height=\"fill\", align=\"left\")\napp.display()   Using  fill  for the  width  and the  height  will make a widget use all the available space e.g.  from guizero import App, PushButton\napp = App()\nbutton = PushButton(app, width=\"fill\", height=\"fill\")\napp.display()   When multiple widgets use  fill  the Window Manager (operating system) will distribute the space accordingly between all the widgets which need to fill it.  from guizero import App, ListBox, PushButton\napp = App()\nlist_box = ListBox(app, items=[\"a list\", \"of items\", \"yay\"], height=\"fill\", align=\"left\")\nbutton = PushButton(app, width=\"fill\", height=\"fill\", align=\"right\")\napp.display()   Note :  Using fill may not always have the effect you are expecting as it is up to the operating system to distribute screen space.",
-            "title": "Filling"
-        },
-        {
-            "location": "/layout/#grid-layout",
-            "text": "The  grid  layout allows you to position widgets into a virtual grid.  When you create a widget you will need to pass an extra parameter called  grid  which is a list containing  [x,y]  coordinates for where you want the widget to appear, like this:  app = App(layout=\"grid\")\ntext = Text(app, text=\"Hello world\", grid=[0,1])  There is no need to specify the width or height of the grid you want - it will expand depending on the coordinates you provide with each widget. However, grid cells containing no objects will have no height or width.  This is really useful when creating GUIs where you want widgets to line up.  e.g.  Creating a number keypad:   from guizero import App, PushButton\n\napp = App(layout=\"grid\")\n\nbutton1 = PushButton(app, text=\"1\", grid=[0,0])\nbutton2 = PushButton(app, text=\"2\", grid=[1,0])\nbutton3  = PushButton(app, text=\"3\", grid=[2,0])\nbutton4  = PushButton(app, text=\"4\", grid=[0,1])\nbutton5  = PushButton(app, text=\"5\", grid=[1,1])\nbutton6  = PushButton(app, text=\"6\", grid=[2,1])\nbutton7  = PushButton(app, text=\"7\", grid=[0,2])\nbutton8  = PushButton(app, text=\"8\", grid=[1,2])\nbutton9  = PushButton(app, text=\"9\", grid=[2,2])\nbutton0  = PushButton(app, text=\"0\", grid=[1,3])\n\napp.display()  You can also align widgets within the grid, e.g. when you are creating a form:   from guizero import App, Text, TextBox\n\napp = App(layout=\"grid\")\n\nname_label = Text(app, text=\"Name\", grid=[0,0], align=\"left\")\nname = TextBox(app, grid=[1,0])\nsurname_label = Text(app, text=\"Surname\", grid=[0,1], align=\"left\")\nsurname = TextBox(app, grid=[1,1])\ndob_label = Text(app, text=\"Date of Birth\", grid=[0,2], align=\"left\")\ndob = TextBox(app, grid=[1,2])\n\napp.display()",
-            "title": "Grid layout"
-        },
-        {
-            "location": "/layout/#spanning-columns-or-rows",
-            "text": "Widgets can be made to span multiple columns or rows by specifying the span within the grid parameter. These are optional, but if specified both must be included using the format  [x,y,xspan,yspan] .  The example below shows text widget located at 0,1 spanning two columns (x) and one row (y):  text = Text(app, text=\"Hello world\", grid=[0,1,2,1])  This can be used to include widgets of different sizes arranged alongside each other.  from guizero import App, Picture\n\napp = App(layout=\"grid\")\n\npicture1 = Picture(app, image=\"std1.gif\", grid=[0,0])\npicture2 = Picture(app, image=\"std2.gif\", grid=[1,0])\npicture3 = Picture(app, image=\"tall1.gif\", grid=[2,0,1,2])\npicture4 = Picture(app, image=\"wide1.gif\", grid=[0,1,2,1])\n\napp.display()",
-            "title": "Spanning columns or rows"
-        },
-        {
-            "location": "/layout/#boxes",
-            "text": "By using a  Box  widget you can segment your GUI into different sections allowing you to lay out your user interface in any way you want.   code for example above  If you wanted to create a title in the top left hand corner of your GUI, you could use a  Box  which fills the top of the  App  and put a  Text  widget inside aligned to the  left .  from guizero import App, Box, Text\napp = App()\n\ntitle_box = Box(app, width=\"fill\", align=\"top\")\ntitle = Text(title_box, text=\"title\", align=\"left\")\n\napp.display()   You may find it easier to design your layout if your Boxes have borders, which can be done by setting the  border  parameter on  Box  to  True .  title_box = Box(app, width=\"fill\", align=\"top\", border=True)   A similar method can be used to put \"OK\" and \"Cancel\" buttons at the bottom right of the GUI. Remember that the widgets will get stacked on the right in order of creation, so the cancel button is created first.  from guizero import App, Box, PushButton\napp = App()\n\nbuttons_box = Box(app, width=\"fill\", align=\"bottom\")\ncancel = PushButton(buttons_box, text=\"Cancel\", align=\"right\")\nok = PushButton(buttons_box, text=\"OK\", align=\"right\")\n\napp.display()   Note :  A  Box  can also be contained in a  Box , allowing you to layer boxes and position your widgets.  Tip :  When creating a GUI you may find it easier to design it first on paper, noting where your boxes will be positioned.",
-            "title": "Boxes"
-        },
-        {
-            "location": "/alerts/",
-            "text": "Alerts\n\n\nAlerts are pop-up windows which can be used to interupt the user by asking question or providing information.\n\n\n\n\nUsing alerts\n\n\nTo use the alerts you will need to import each one individually at the start of your program. For example:\n\n\nfrom guizero import warn, info\n\n\n\n\nPurpose\n\n\nThese functions pop up a box on the screen that displays a message. The functions available are:\n\n\n\n\nwarn(title, text)\n - popup box with a warning icon\n\n\ninfo(title, text)\n - popup box with an information icon\n\n\nerror(title, text)\n - popup box with an error icon\n\n\nyesno(title, text)\n - popup box with yes and no options. Pressing \nYes\n returns \nTrue\n and pressing \nNo\n returns \nFalse\n.\n\n\n\n\nAll pop up boxes use the native display, so they will look different depending on your operating system.\n\n\nExamples\n\n\nWarning box\n\n\nThis will pop up a warning box with the title \n\"Uh oh!\"\n and the message \n\"You are almost out of biscuits!\"\n.\n\n\nfrom guizero import App, warn\napp = App(title=\"Biscuit monitor\")\nwarn(\"Uh oh!\", \"You are almost out of biscuits!\")\napp.display()\n\n\n\n\nOn Windows, the box looks like this:\n\n\n\n\nThe \ninfo\n and \nerror\n boxes work in exactly the same way but will display different icons.\n\n\nYes/No box\n\n\nWhen this function is called it returns a \nboolean\n value.\n\n\n\n\nIf \nYes\n was pressed, return \nTrue\n\n\nIf \nNo\n was pressed, return \nFalse\n\n\n\n\nYou can store this value in a variable and test it:\n\n\nfrom guizero import App, yesno, info, error\napp = App(title=\"Snowman\")\nbuild_a_snowman = yesno(\"A question...\", \"Do you want to build a snowman?\")\nif build_a_snowman == True:\n    info(\"Snowman\", \"It doesn't have to be a snowman\")\nelse:\n    error(\"Snowman\", \"Okay bye...\")\napp.display()\n\n\n\n\nThis code will first display the yes/no box\n\n\n\n\nIf \nYes\n is pressed, an information box will be displayed:\n\n\n\n\nIf \nNo\n is pressed, an error box will be displayed\n\n\n\n\nExample: Using an alert as a callback\n\n\nYou can also use these functions in a \ncallback\n (when you have to provide a function for another widget to call). Here is an example with a \nPushButton\n which pops up an \ninfo\n box when it is pressed.\n\n\nfrom guizero import App, PushButton, info\napp = App()\nbutton = PushButton(app, command=info, args=[\"Info\", \"You pressed the button\"])\napp.display()\n\n\n\n\nThe arguments provided to the \nPushButton\n are:\n\n\n\n\nWhere the button should be created (within the \napp\n)\n\n\nThe name of the function to call when pressed (\ninfo\n)\n\n\nA list of the arguments to the function you are calling (values for the \ntitle\n and \nmessage\n arguments for the \ninfo\n function)\n\n\n\n\nExample: Do you really want to close?\n\n\nYou can use a \nyesno\n box to check whether someone really wants to exit your app. If they click yes, the app is closed, if not, nothing happens and they can continue with what they were doing.\n\n\nfrom guizero import App, Text, yesno\n\n# Ask the user if they really want to close the window\ndef do_this_on_close():\n    if yesno(\"Close\", \"Do you want to quit?\"):\n        app.destroy()\n\napp = App()\n\ntitle = Text(app, text=\"blank app\")\n\n# When the user tries to close the window, run the function do_this_on_close()\napp.on_close(do_this_on_close)\n\napp.display()",
-            "title": "Alerts"
-        },
-        {
-            "location": "/alerts/#alerts",
-            "text": "Alerts are pop-up windows which can be used to interupt the user by asking question or providing information.",
-            "title": "Alerts"
-        },
-        {
-            "location": "/alerts/#using-alerts",
-            "text": "To use the alerts you will need to import each one individually at the start of your program. For example:  from guizero import warn, info",
-            "title": "Using alerts"
-        },
-        {
-            "location": "/alerts/#purpose",
-            "text": "These functions pop up a box on the screen that displays a message. The functions available are:   warn(title, text)  - popup box with a warning icon  info(title, text)  - popup box with an information icon  error(title, text)  - popup box with an error icon  yesno(title, text)  - popup box with yes and no options. Pressing  Yes  returns  True  and pressing  No  returns  False .   All pop up boxes use the native display, so they will look different depending on your operating system.",
-            "title": "Purpose"
-        },
-        {
-            "location": "/alerts/#examples",
-            "text": "Warning box  This will pop up a warning box with the title  \"Uh oh!\"  and the message  \"You are almost out of biscuits!\" .  from guizero import App, warn\napp = App(title=\"Biscuit monitor\")\nwarn(\"Uh oh!\", \"You are almost out of biscuits!\")\napp.display()  On Windows, the box looks like this:   The  info  and  error  boxes work in exactly the same way but will display different icons.  Yes/No box  When this function is called it returns a  boolean  value.   If  Yes  was pressed, return  True  If  No  was pressed, return  False   You can store this value in a variable and test it:  from guizero import App, yesno, info, error\napp = App(title=\"Snowman\")\nbuild_a_snowman = yesno(\"A question...\", \"Do you want to build a snowman?\")\nif build_a_snowman == True:\n    info(\"Snowman\", \"It doesn't have to be a snowman\")\nelse:\n    error(\"Snowman\", \"Okay bye...\")\napp.display()  This code will first display the yes/no box   If  Yes  is pressed, an information box will be displayed:   If  No  is pressed, an error box will be displayed   Example: Using an alert as a callback  You can also use these functions in a  callback  (when you have to provide a function for another widget to call). Here is an example with a  PushButton  which pops up an  info  box when it is pressed.  from guizero import App, PushButton, info\napp = App()\nbutton = PushButton(app, command=info, args=[\"Info\", \"You pressed the button\"])\napp.display()  The arguments provided to the  PushButton  are:   Where the button should be created (within the  app )  The name of the function to call when pressed ( info )  A list of the arguments to the function you are calling (values for the  title  and  message  arguments for the  info  function)   Example: Do you really want to close?  You can use a  yesno  box to check whether someone really wants to exit your app. If they click yes, the app is closed, if not, nothing happens and they can continue with what they were doing.  from guizero import App, Text, yesno\n\n# Ask the user if they really want to close the window\ndef do_this_on_close():\n    if yesno(\"Close\", \"Do you want to quit?\"):\n        app.destroy()\n\napp = App()\n\ntitle = Text(app, text=\"blank app\")\n\n# When the user tries to close the window, run the function do_this_on_close()\napp.on_close(do_this_on_close)\n\napp.display()",
-            "title": "Examples"
-        },
-        {
-            "location": "/size/",
-            "text": "Sizes\n\n\nYou can set the \nwidth\n and \nheight\n of widgets in guizero.\n\n\nWidgets are sized by pixels or characters depending on the widget and what it contains.\n\n\nSome widgets size can also be set to \n\"fill\"\n where it will use up all of the available space.\n\n\nfrom guizero import App, PushButton, Slider, ListBox\n\napp = App()\n\n# a PushButton's size is noted in characters\nbutton = PushButton(app, width=30, height=5)\n\n# a Slider's size is noted in pixels\nslider = Slider(app, width=300, height=30)\n\n# some widgets, such as ListBox can also be told to fill all the available space\nlistbox = ListBox(app, width=\"fill\", height=\"fill\")\n\napp.display()\n\n\n\n\n\n\n\n\n\n\nWidget\n\n\nCharacters or Pixels\n\n\nFill\n\n\nNotes\n\n\n\n\n\n\n\n\n\n\nBox\n\n\nPixels\n\n\nYes\n\n\nIf a Box is sized in Pixels, both width and height must be specified.\n\n\n\n\n\n\nButtonGroup\n\n\nCharacters\n\n\nYes\n\n\nThe height of a ButtonGroup must divide by the number of buttons in it\n\n\n\n\n\n\nCheckBox\n\n\nCharacters\n\n\nYes\n\n\n\n\n\n\n\n\nCombo\n\n\nCharacters\n\n\nYes\n\n\n\n\n\n\n\n\nListBox\n\n\nPixels\n\n\nYes\n\n\n\n\n\n\n\n\nPicture\n\n\nPixels\n\n\nNo\n\n\nSee \nImages\n for more information\n\n\n\n\n\n\nPushButton\n\n\nCharacters\n\n\nYes\n\n\n\n\n\n\n\n\nPushButton\n with image\n\n\nPixels\n\n\nNo\n\n\nPushButton's which have images are sized in pixels\n\n\n\n\n\n\nSlider\n\n\nPixels\n\n\nYes\n\n\n\n\n\n\n\n\nText\n\n\nCharacters\n\n\nYes\n\n\n\n\n\n\n\n\nTextBox\n\n\nCharacters\n\n\nYes\n\n\nOnly a TextBox's width can be set\n\n\n\n\n\n\nWaffle\n\n\nPixels\n\n\nNo",
-            "title": "Sizes"
-        },
-        {
-            "location": "/size/#sizes",
-            "text": "You can set the  width  and  height  of widgets in guizero.  Widgets are sized by pixels or characters depending on the widget and what it contains.  Some widgets size can also be set to  \"fill\"  where it will use up all of the available space.  from guizero import App, PushButton, Slider, ListBox\n\napp = App()\n\n# a PushButton's size is noted in characters\nbutton = PushButton(app, width=30, height=5)\n\n# a Slider's size is noted in pixels\nslider = Slider(app, width=300, height=30)\n\n# some widgets, such as ListBox can also be told to fill all the available space\nlistbox = ListBox(app, width=\"fill\", height=\"fill\")\n\napp.display()     Widget  Characters or Pixels  Fill  Notes      Box  Pixels  Yes  If a Box is sized in Pixels, both width and height must be specified.    ButtonGroup  Characters  Yes  The height of a ButtonGroup must divide by the number of buttons in it    CheckBox  Characters  Yes     Combo  Characters  Yes     ListBox  Pixels  Yes     Picture  Pixels  No  See  Images  for more information    PushButton  Characters  Yes     PushButton  with image  Pixels  No  PushButton's which have images are sized in pixels    Slider  Pixels  Yes     Text  Characters  Yes     TextBox  Characters  Yes  Only a TextBox's width can be set    Waffle  Pixels  No",
-            "title": "Sizes"
-        },
-        {
-            "location": "/colors/",
-            "text": "Colors (or Colo\nu\nrs)\n\n\nYou can set colors in guizero using:\n\n\n\n\nthe name of the color - \nwhite\n\n\na #rgb hex value - \n#ffffff\n\n\na list of rgb values - \n(255,255,255)\n \n\n\n\n\nColors can be used as either starting parameters e.g. :\n\n\napp = App(bg = \"red\")\napp = App(bg = \"#ff0000\")\napp = App(bg = (255, 0, 0))\n\n\n\n\nor as properties e.g. :\n\n\ntext = Text(app, text = \"hi\")\ntext.text_color = \"green\"\ntext.text_color = \"#00ff00\"\ntext.text_color = (0, 255, 0)\n\n\n\n\nIf a color is set using a list of rgb values (\n(255,255,255)\n) it will be returned as an #rgb hex value (\n#ffffff\n)\n\n\nColor names\n\n\nColor names can be given as strings e.g.\n\n\n\n\nwhite\n\n\nblack\n\n\nred\n\n\ngreen\n\n\nblue\n\n\nyellow\n\n\n\n\nA complete list of color names is available at \nwiki.tcl.tk/37701\n\n\nrgb hex value\n\n\nA rgb color value must start with a \n#\n and 6 characters following, 2 each for the red, green and blue value in hex. Each value must be \n00\n - \nff\n e.g.\n\n\n\n\nwhite = \n#ffffff\n\n\nblack = \n#000000\n\n\nred = \n#ff0000\n\n\ngreen = \n#00ff00\n\n\nblue = \n#0000ff\n\n\nyellow = \n#ffff00\n\n\n\n\nYou can mix your own color by changing the red, green and blue values. \n\n\nThere is a RGB calculator application at \nhttps://www.w3schools.com/colors/colors_rgb.asp\n where you can create your own color and get the \n#rrggbb\n value.\n\n\nrgb list\n\n\nThe \n(red, green, blue)\n list color, must have 3 elements in the order red, green, blue with values 0 - 255 e.g.\n\n\n\n\nwhite = (255, 255, 255)\n\n\nblack = (0, 0, 0)\n\n\nred = (255, 0, 0)\n\n\ngreen = (0, 255, 0)\n\n\nblue = (0, 0, 255)\n\n\nyellow = (255, 255, 0)",
-            "title": "Colors"
-        },
-        {
-            "location": "/colors/#colors-or-colours",
-            "text": "You can set colors in guizero using:   the name of the color -  white  a #rgb hex value -  #ffffff  a list of rgb values -  (255,255,255)     Colors can be used as either starting parameters e.g. :  app = App(bg = \"red\")\napp = App(bg = \"#ff0000\")\napp = App(bg = (255, 0, 0))  or as properties e.g. :  text = Text(app, text = \"hi\")\ntext.text_color = \"green\"\ntext.text_color = \"#00ff00\"\ntext.text_color = (0, 255, 0)  If a color is set using a list of rgb values ( (255,255,255) ) it will be returned as an #rgb hex value ( #ffffff )",
-            "title": "Colors (or Colours)"
-        },
-        {
-            "location": "/colors/#color-names",
-            "text": "Color names can be given as strings e.g.   white  black  red  green  blue  yellow   A complete list of color names is available at  wiki.tcl.tk/37701",
-            "title": "Color names"
-        },
-        {
-            "location": "/colors/#rgb-hex-value",
-            "text": "A rgb color value must start with a  #  and 6 characters following, 2 each for the red, green and blue value in hex. Each value must be  00  -  ff  e.g.   white =  #ffffff  black =  #000000  red =  #ff0000  green =  #00ff00  blue =  #0000ff  yellow =  #ffff00   You can mix your own color by changing the red, green and blue values.   There is a RGB calculator application at  https://www.w3schools.com/colors/colors_rgb.asp  where you can create your own color and get the  #rrggbb  value.",
-            "title": "rgb hex value"
-        },
-        {
-            "location": "/colors/#rgb-list",
-            "text": "The  (red, green, blue)  list color, must have 3 elements in the order red, green, blue with values 0 - 255 e.g.   white = (255, 255, 255)  black = (0, 0, 0)  red = (255, 0, 0)  green = (0, 255, 0)  blue = (0, 0, 255)  yellow = (255, 255, 0)",
-            "title": "rgb list"
-        },
-        {
-            "location": "/images/",
-            "text": "Images\n\n\nWidgets such as \nPicture\n and \nPushButton\n allow you to use images in your GUI.\n\n\nfrom guizero import App, Picture\napp = App()\npicture = Picture(app, image=\"test.gif\")\napp.display()\n\n\n\n\nThe types of image (GIF, JPG, PNG, etc) supported depend on how you \ninstalled guizero\n and the setup of your computer.\n\n\nSupported files types\n\n\nAll systems support the \nGIF\n file type.\n\n\nWindows and Linux also support \nPNG\n files.\n\n\nIf you \ninstalled the addition image features\n using \npip\n it will also have installed \nPIL\n (Python Imaging Library) and you will be able use the majority of commonly used image types.\n\n\nguizero will tell you what file types are supported on your computer using the following code:\n\n\nfrom guizero import system_config\nprint(system_config.supported_image_types)\n\n\n\n\n\n\n\n\n\n\nOperating System\n\n\nPIL NOT available\n\n\nPIL available\n\n\n\n\n\n\n\n\n\n\nWindows\n\n\nGIF, PNG\n\n\nGIF, Animated GIF, BMP, ICO, PNG, JPG, TIF\n\n\n\n\n\n\nMacOS\n\n\nGIF\n\n\nGIF, Animated GIF, BMP, ICO, PNG, JPG, TIF\n\n\n\n\n\n\nLinux\n\n\nGIF, PNG\n\n\nGIF, Animated GIF, BMP, ICO, PNG, JPG, TIF\n\n\n\n\n\n\nRaspbian\n\n\nGIF, PNG\n\n\nGIF, Animated GIF, BMP, ICO, PNG, JPG, TIF\n\n\n\n\n\n\n\n\nResizing\n\n\nWhen the size of a widget is changed the image will be changed to fit the widget, if \nPIL\n is available the image will be scaled correctly, if not the image will be cropped.\n\n\nAnimated GIFs\n\n\nIf \nPIL\n is installed guizero supports displaying animated GIFs, if not, the GIF will be displayed as a static image.",
-            "title": "Images"
-        },
-        {
-            "location": "/images/#images",
-            "text": "Widgets such as  Picture  and  PushButton  allow you to use images in your GUI.  from guizero import App, Picture\napp = App()\npicture = Picture(app, image=\"test.gif\")\napp.display()  The types of image (GIF, JPG, PNG, etc) supported depend on how you  installed guizero  and the setup of your computer.",
-            "title": "Images"
-        },
-        {
-            "location": "/images/#supported-files-types",
-            "text": "All systems support the  GIF  file type.  Windows and Linux also support  PNG  files.  If you  installed the addition image features  using  pip  it will also have installed  PIL  (Python Imaging Library) and you will be able use the majority of commonly used image types.  guizero will tell you what file types are supported on your computer using the following code:  from guizero import system_config\nprint(system_config.supported_image_types)     Operating System  PIL NOT available  PIL available      Windows  GIF, PNG  GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF    MacOS  GIF  GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF    Linux  GIF, PNG  GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF    Raspbian  GIF, PNG  GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF",
-            "title": "Supported files types"
-        },
-        {
-            "location": "/images/#resizing",
-            "text": "When the size of a widget is changed the image will be changed to fit the widget, if  PIL  is available the image will be scaled correctly, if not the image will be cropped.",
-            "title": "Resizing"
-        },
-        {
-            "location": "/images/#animated-gifs",
-            "text": "If  PIL  is installed guizero supports displaying animated GIFs, if not, the GIF will be displayed as a static image.",
-            "title": "Animated GIFs"
-        },
-        {
-            "location": "/blocking/",
-            "text": "Loops and sleeping\n\n\nYou may be used to writing programs which contain loops or make use of the \nsleep()\n command, but find when you try to use these with guizero they cause your GUI to freeze. This is because guizero (in common with almost all GUIs) operates an \nevent driven\n model of programming which may be different to the one you are familiar with.\n\n\nYour first guizero program might look a bit like this:\n\n\nfrom guizero import App\napp = App(\"Hello world\")\napp.display()\n\n\n\n\nThe line of code \napp.display()\n doesn't just display the app - it enters an \ninfinite event loop\n which is watching and waiting for events to happen on the GUI. Events include things like the user clicking on a button, moving a slider, typing in a text box etc. No code written after this line will ever execute because the event loop is infinite.\n\n\nExample\n\n\nSuppose you want a counter on your GUI to start counting up by 1 every second. You might be tempted to write a program like this:\n\n\nfrom guizero import App, Text\nfrom time import sleep\n\napp = App(\"Hello world\")\ntext = Text(app, text=\"1\")\nwhile True:\n    text.value = int(text.value) + 1\n    sleep(1)\napp.display()\n\n\n\n\nIf you run this program, you'll see that this does not have the desired effect - your program crashes! This is because you have blocked the updating of your GUI in two ways:\n\n\n\n\n\n\nThe \nsleep()\n command - whilst your program is sleeping, the GUI will not update and you will not be able to click on anything.\n\n\n\n\n\n\nThe \nwhile\n loop - once you enter this loop, your GUI will never update ever again and will probably crash.\n\n\n\n\n\n\nSolution\n\n\nThis behaviour is not a bug within guizero or tkinter.\n\n\nYou must write GUI based programs in a different way to the one you may be used to. If you want to repeatedly perform an action you would do it like this:\n\n\n\n\n\n\nWrite a function which performs the desired action (in this example \ncounter()\n)\n\n\n\n\n\n\nSet a \ncallback\n to that function. You can either schedule the same callback to occur repeatedly after a given number of milliseconds (in this example \n1000\n), or you can schedule it only once.\n\n\n\n\n\n\nfrom guizero import App, Text\n\n# Action you would like to perform\ndef counter():\n    text.value = int(text.value) + 1\n\napp = App(\"Hello world\")\ntext = Text(app, text=\"1\")\ntext.repeat(1000, counter)  # Schedule call to counter() every 1000ms\napp.display()",
-            "title": "Loops and sleeping"
-        },
-        {
-            "location": "/blocking/#loops-and-sleeping",
-            "text": "You may be used to writing programs which contain loops or make use of the  sleep()  command, but find when you try to use these with guizero they cause your GUI to freeze. This is because guizero (in common with almost all GUIs) operates an  event driven  model of programming which may be different to the one you are familiar with.  Your first guizero program might look a bit like this:  from guizero import App\napp = App(\"Hello world\")\napp.display()  The line of code  app.display()  doesn't just display the app - it enters an  infinite event loop  which is watching and waiting for events to happen on the GUI. Events include things like the user clicking on a button, moving a slider, typing in a text box etc. No code written after this line will ever execute because the event loop is infinite.",
-            "title": "Loops and sleeping"
-        },
-        {
-            "location": "/blocking/#example",
-            "text": "Suppose you want a counter on your GUI to start counting up by 1 every second. You might be tempted to write a program like this:  from guizero import App, Text\nfrom time import sleep\n\napp = App(\"Hello world\")\ntext = Text(app, text=\"1\")\nwhile True:\n    text.value = int(text.value) + 1\n    sleep(1)\napp.display()  If you run this program, you'll see that this does not have the desired effect - your program crashes! This is because you have blocked the updating of your GUI in two ways:    The  sleep()  command - whilst your program is sleeping, the GUI will not update and you will not be able to click on anything.    The  while  loop - once you enter this loop, your GUI will never update ever again and will probably crash.",
-            "title": "Example"
-        },
-        {
-            "location": "/blocking/#solution",
-            "text": "This behaviour is not a bug within guizero or tkinter.  You must write GUI based programs in a different way to the one you may be used to. If you want to repeatedly perform an action you would do it like this:    Write a function which performs the desired action (in this example  counter() )    Set a  callback  to that function. You can either schedule the same callback to occur repeatedly after a given number of milliseconds (in this example  1000 ), or you can schedule it only once.    from guizero import App, Text\n\n# Action you would like to perform\ndef counter():\n    text.value = int(text.value) + 1\n\napp = App(\"Hello world\")\ntext = Text(app, text=\"1\")\ntext.repeat(1000, counter)  # Schedule call to counter() every 1000ms\napp.display()",
-            "title": "Solution"
-        },
-        {
-            "location": "/events/",
-            "text": "Events\n\n\nWarning - events are currently experimental, issues maybe experienced and the API may change.\n.\n\n\nCustom events can be added to guizero widgets to call functions when the user takes the following actions:\n\n\n\n\nwhen clicked - \nwhen_clicked\n\n\nwhen the left mouse button is pressed - \nwhen_left_button_pressed\n\n\nwhen the left mouse button is released - \nwhen_left_button_released\n\n\nwhen the right mouse button is pressed - \nwhen_right_button_pressed\n\n\nwhen the right mouse button is released - \nwhen_right_button_released\n\n\nwhen a key is pressed - \nwhen_key_pressed\n\n\nwhen a key is released - \nwhen_key_released\n\n\nwhen the mouse enters a widget - \nwhen_mouse_enters\n\n\nwhen the mouse leaves a widget - \nwhen_mouse_leaves\n\n\nwhen the mouse is dragged across a widget - \nwhen_mouse_dragged\n\n\n\n\nEvents are set by assigning them to a function:\n\n\ndef clicked():\n    print(\"clicked\")\n\nwidget.when_clicked = clicked\n\n\n\n\nEvent Data\n\n\nThe function which is called can also accept a parameter and will be passed data about the event which occured.\n\n\nThe event data returned has:\n\n\n\n\nwidget\n - the guizero widget which raised the event\n\n\ntk_event\n - the \ntkinter event object\n\n\nkey\n - the key which raised the event\n\n\nx\n - the mouse's x position relative to the widget when the event occured\n\n\ny\n - the mouse's y position relative to the widget when the event occured\n\n\ndisplay_x\n - the mouse's x position on the display when the event occured\n\n\ndisplay_y\n - the mouse's y position on the display when the event occured\n\n\n\n\ndef clicked(event_data):\n    print(\"widget clicked = \" + event_data.widget)\n    print(\"mouse position = \" + event_data.x + \".\" + event_data.y)\n\nwidget.when_clicked = clicked\n\n\n\n\nExample\n\n\nHighlight a text box widget by changing its background color (\nbg\n) when the mouse is hovering over it.\n\n\nfrom guizero import App, TextBox\n\ndef highlight():\n    text_box.bg = \"lightblue\"\n\ndef lowlight():\n    text_box.bg = \"white\"\n\napp = App()\ntext_box = TextBox(app)\n\n# when the mouse enters the textbox\ntext_box.when_mouse_enters = highlight\n# when the mouse leaves the textbox\ntext_box.when_mouse_leaves = lowlight\n\napp.display()",
-            "title": "Events"
-        },
-        {
-            "location": "/events/#events",
-            "text": "Warning - events are currently experimental, issues maybe experienced and the API may change. .  Custom events can be added to guizero widgets to call functions when the user takes the following actions:   when clicked -  when_clicked  when the left mouse button is pressed -  when_left_button_pressed  when the left mouse button is released -  when_left_button_released  when the right mouse button is pressed -  when_right_button_pressed  when the right mouse button is released -  when_right_button_released  when a key is pressed -  when_key_pressed  when a key is released -  when_key_released  when the mouse enters a widget -  when_mouse_enters  when the mouse leaves a widget -  when_mouse_leaves  when the mouse is dragged across a widget -  when_mouse_dragged   Events are set by assigning them to a function:  def clicked():\n    print(\"clicked\")\n\nwidget.when_clicked = clicked",
-            "title": "Events"
-        },
-        {
-            "location": "/events/#event-data",
-            "text": "The function which is called can also accept a parameter and will be passed data about the event which occured.  The event data returned has:   widget  - the guizero widget which raised the event  tk_event  - the  tkinter event object  key  - the key which raised the event  x  - the mouse's x position relative to the widget when the event occured  y  - the mouse's y position relative to the widget when the event occured  display_x  - the mouse's x position on the display when the event occured  display_y  - the mouse's y position on the display when the event occured   def clicked(event_data):\n    print(\"widget clicked = \" + event_data.widget)\n    print(\"mouse position = \" + event_data.x + \".\" + event_data.y)\n\nwidget.when_clicked = clicked",
-            "title": "Event Data"
-        },
-        {
-            "location": "/events/#example",
-            "text": "Highlight a text box widget by changing its background color ( bg ) when the mouse is hovering over it.  from guizero import App, TextBox\n\ndef highlight():\n    text_box.bg = \"lightblue\"\n\ndef lowlight():\n    text_box.bg = \"white\"\n\napp = App()\ntext_box = TextBox(app)\n\n# when the mouse enters the textbox\ntext_box.when_mouse_enters = highlight\n# when the mouse leaves the textbox\ntext_box.when_mouse_leaves = lowlight\n\napp.display()",
-            "title": "Example"
-        },
-        {
-            "location": "/usingtk/",
-            "text": "Using tkinter\n\n\nIf you are an advanced user, you can still make use of tkinter when using guizero.\n\n\nYou can combine the use of \nguizero\n and \ntkinter\n seamlessly in a program, taking advantage of the simplified syntax of guizero whilst still being able to access the full range of functionality in tkinter if you need it.\n\n\nUsing tkinter widgets in guizero\n\n\nYou can add tk widgets into your guizero app using the \nadd_tk_widget\n method of \nApp\n, \nWindow\n and \nBox\n.\n\n\nIn this example, we are adding the tkinter widget \nSpinbox\n into a guizero \nApp\n:\n\n\nfrom guizero import App, Text\nfrom tkinter import Spinbox\n\napp = App()\ntext = Text(app, text=\"A Spinbox widget\")\n\nspinbox = Spinbox(from_=0, to=10)\napp.add_tk_widget(spinbox)\n\na.display()\n\n\n\n\nUsing a tkinter method on a guizero object\n\n\nEach guizero widget itself contains a tk widget - you can find out which by looking on the guizero documentation page for the widget. For example, a guizero \nTextBox\n contains a tkinter \nEntry\n object. You can access the internal object using the syntax \n<object_name>.tk\n.\n\n\nIn this example, we have guizero \nApp\n and \nTextBox\n widgets and are using the tk widgets \nconfig\n method to change the mouse cursor when it is over the \nTextBox\n.\n\n\nfrom guizero import App, TextBox\napp = App()\nname = TextBox(app, text=\"Laura\")\nname.tk.config(cursor=\"target\") \napp.display()",
-            "title": "Using tkinter"
-        },
-        {
-            "location": "/usingtk/#using-tkinter",
-            "text": "If you are an advanced user, you can still make use of tkinter when using guizero.  You can combine the use of  guizero  and  tkinter  seamlessly in a program, taking advantage of the simplified syntax of guizero whilst still being able to access the full range of functionality in tkinter if you need it.",
-            "title": "Using tkinter"
-        },
-        {
-            "location": "/usingtk/#using-tkinter-widgets-in-guizero",
-            "text": "You can add tk widgets into your guizero app using the  add_tk_widget  method of  App ,  Window  and  Box .  In this example, we are adding the tkinter widget  Spinbox  into a guizero  App :  from guizero import App, Text\nfrom tkinter import Spinbox\n\napp = App()\ntext = Text(app, text=\"A Spinbox widget\")\n\nspinbox = Spinbox(from_=0, to=10)\napp.add_tk_widget(spinbox)\n\na.display()",
-            "title": "Using tkinter widgets in guizero"
-        },
-        {
-            "location": "/usingtk/#using-a-tkinter-method-on-a-guizero-object",
-            "text": "Each guizero widget itself contains a tk widget - you can find out which by looking on the guizero documentation page for the widget. For example, a guizero  TextBox  contains a tkinter  Entry  object. You can access the internal object using the syntax  <object_name>.tk .  In this example, we have guizero  App  and  TextBox  widgets and are using the tk widgets  config  method to change the mouse cursor when it is over the  TextBox .  from guizero import App, TextBox\napp = App()\nname = TextBox(app, text=\"Laura\")\nname.tk.config(cursor=\"target\") \napp.display()",
-            "title": "Using a tkinter method on a guizero object"
-        },
-        {
-            "location": "/gettinghelp/",
-            "text": "Getting help\n\n\nYou may encounter a problem when using guizero, so here are some ways you can get help to solve your problem.\n\n\nGetting help\n\n\nIf you have a question about your guizero program it is a good idea to join a community to ask for support:\n\n\n\n\nRaspberry Pi Forums\n - some people post questions about guizero on these forums and other members of the community step in to help. The creators of guizero periodically check the Python forum.\n\n\nStack Overflow\n - a popular site for techy questions\n\n\nComputing at School\n - a useful site for teachers\n\n\n\n\nIf you would like to read guides and resources for guizero there are many freely available:\n\n\n\n\n\n\nGetting started with GUIs\n - a beginners guide to guizero by the Raspberry Pi Foundation\n\n\n\n\n\n\nPython guizero video\n - a series of videos by \nDevon Schafer\n on using guizero.\n\n\n\n\n\n\nExample programs\n - some example programs to get you going.\n\n\n\n\n\n\nUsing guizero with hardware\n - Ben Nuttall's projects using guizero combined with hardware\n\n\n\n\n\n\nCat name generator\n - materials for a kids workshop, first run at the \nCotswold Jam\n\n\n\n\n\n\nName your pet\n - article on page 42 of \nHello World\n magazine issue 2.\n\n\n\n\n\n\nBugs and feature requests\n\n\nLike many Python libraries, guizero has a \nGitHub repository\n where you can add issues. These issues come under two headings:\n\n\n\n\nYou found a bug in guizero\n\n\nYou would like to request we consider including a new feature\n\n\n\n\nWe look at and respond to all issues created on GitHub. However, we ask that you only create issues for bugs and feature requests, rather than support, as we do not have time to answer everything :)",
-            "title": "Getting help"
-        },
-        {
-            "location": "/gettinghelp/#getting-help",
-            "text": "You may encounter a problem when using guizero, so here are some ways you can get help to solve your problem.",
-            "title": "Getting help"
-        },
-        {
-            "location": "/gettinghelp/#getting-help_1",
-            "text": "If you have a question about your guizero program it is a good idea to join a community to ask for support:   Raspberry Pi Forums  - some people post questions about guizero on these forums and other members of the community step in to help. The creators of guizero periodically check the Python forum.  Stack Overflow  - a popular site for techy questions  Computing at School  - a useful site for teachers   If you would like to read guides and resources for guizero there are many freely available:    Getting started with GUIs  - a beginners guide to guizero by the Raspberry Pi Foundation    Python guizero video  - a series of videos by  Devon Schafer  on using guizero.    Example programs  - some example programs to get you going.    Using guizero with hardware  - Ben Nuttall's projects using guizero combined with hardware    Cat name generator  - materials for a kids workshop, first run at the  Cotswold Jam    Name your pet  - article on page 42 of  Hello World  magazine issue 2.",
-            "title": "Getting help"
-        },
-        {
-            "location": "/gettinghelp/#bugs-and-feature-requests",
-            "text": "Like many Python libraries, guizero has a  GitHub repository  where you can add issues. These issues come under two headings:   You found a bug in guizero  You would like to request we consider including a new feature   We look at and respond to all issues created on GitHub. However, we ask that you only create issues for bugs and feature requests, rather than support, as we do not have time to answer everything :)",
-            "title": "Bugs and feature requests"
-        },
-        {
-            "location": "/recipes/",
-            "text": "Recipes\n\n\nThese are examples of how you can use \nguizero\n to create user interfaces. Don't be restricted to these ideas, check out \nUsing guizero\n and the \nwidgets\n.\n\n\nHello World\n\n\nCreate a guizero app and display some text.\n\n\nfrom guizero import App, Text\napp = App()\ntext = Text(app, text=\"hello world\")\napp.display()\n\n\n\n\nGet some text\n\n\nGet some data from the user using a \nTextBox\n.\n\n\nfrom guizero import App, TextBox\n\napp = App()\nname = TextBox(app. text=\"Enter your name\")\n\napp.display()\n\n\n\n\nPush a button\n\n\nUse a \nPushButton\n to display a message when the button is pressed. \n\n\nfrom guizero import App, TextBox, PushButton, Text\n\ndef update_text():\n    label.value = name.value\n\napp = App()\nlabel = Text(app, text=\"What's your name?\")\nname = TextBox(app)\nbutton = PushButton(app, command=update_text)\n\napp.display()\n\n\n\n\nDisplay an image\n\n\nUse a \nPicture\n object to display an image.\n\n\nfrom guizero import App, Picture\napp = App()\npic = Picture(app, image=\"myimage.gif\")\napp.display()\n\n\n\n\nToggle 2 buttons\n\n\nHave 2 buttons, \nstart\n and \nstop\n with them changing the \nenabled\n state of each other.\n\n\nfrom guizero import App, PushButton\n\ndef start():\n    start_button.disable()\n    stop_button.enable()\n\ndef stop():\n    start_button.enable()\n    stop_button.disable()\n\napp = App()\nstart_button = PushButton(app, command=start, text=\"start\")\nstop_button = PushButton(app, command=stop, text=\"stop\", enabled=False)\napp.display()\n\n\n\n\nChange your apps appearance\n\n\nYour app doesn't have to use the standard colors and text, let your user pick the background and text color from 2 combo's.\n\n\nfrom guizero import App, Combo, Text\n\ndef update_bg():\n    app.bg = bg_combo.value\n\ndef update_text():\n    app.text_color = text_combo.value\n\ncolors = [\"black\", \"white\", \"red\", \"green\", \"blue\"]\n\napp = App()\napp.bg = \"black\"\napp.text_color = \"white\"\n\ntitle1 = Text(app, text=\"Background color\")\nbg_combo = Combo(app, options=colors, selected=app.bg, command=update_bg)\n\ntitle2 = Text(app, text=\"Text color\")\ntext_combo = Combo(app, options=colors, selected=app.text_color, command=update_text)\n\napp.display()\n\n\n\n\nScale an image\n\n\nDisplay an image on the screen with 2 sliders, 1 for height and 1 for width.\n\n\nfrom guizero import App, Slider, Picture\n\ndef resize():\n    picture.width = width.value\n    picture.height = height.value\n\napp = App(layout=\"grid\")\n\npicture = Picture(app, image=\"image.gif\", grid=[0,1])\n\nwidth = Slider(app, command=resize, grid=[0,0], start=1, end=picture.width)\nwidth.width = picture.width\nwidth.value = picture.width\n\nheight = Slider(app, command=resize, horizontal=False, grid=[1,1], start=1, end=picture.height)\nheight.height = picture.height\nheight.value = picture.height\n\napp.display()",
-            "title": "Recipes"
-        },
-        {
-            "location": "/recipes/#recipes",
-            "text": "These are examples of how you can use  guizero  to create user interfaces. Don't be restricted to these ideas, check out  Using guizero  and the  widgets .",
-            "title": "Recipes"
-        },
-        {
-            "location": "/recipes/#hello-world",
-            "text": "Create a guizero app and display some text.  from guizero import App, Text\napp = App()\ntext = Text(app, text=\"hello world\")\napp.display()",
-            "title": "Hello World"
-        },
-        {
-            "location": "/recipes/#get-some-text",
-            "text": "Get some data from the user using a  TextBox .  from guizero import App, TextBox\n\napp = App()\nname = TextBox(app. text=\"Enter your name\")\n\napp.display()",
-            "title": "Get some text"
-        },
-        {
-            "location": "/recipes/#push-a-button",
-            "text": "Use a  PushButton  to display a message when the button is pressed.   from guizero import App, TextBox, PushButton, Text\n\ndef update_text():\n    label.value = name.value\n\napp = App()\nlabel = Text(app, text=\"What's your name?\")\nname = TextBox(app)\nbutton = PushButton(app, command=update_text)\n\napp.display()",
-            "title": "Push a button"
-        },
-        {
-            "location": "/recipes/#display-an-image",
-            "text": "Use a  Picture  object to display an image.  from guizero import App, Picture\napp = App()\npic = Picture(app, image=\"myimage.gif\")\napp.display()",
-            "title": "Display an image"
-        },
-        {
-            "location": "/recipes/#toggle-2-buttons",
-            "text": "Have 2 buttons,  start  and  stop  with them changing the  enabled  state of each other.  from guizero import App, PushButton\n\ndef start():\n    start_button.disable()\n    stop_button.enable()\n\ndef stop():\n    start_button.enable()\n    stop_button.disable()\n\napp = App()\nstart_button = PushButton(app, command=start, text=\"start\")\nstop_button = PushButton(app, command=stop, text=\"stop\", enabled=False)\napp.display()",
-            "title": "Toggle 2 buttons"
-        },
-        {
-            "location": "/recipes/#change-your-apps-appearance",
-            "text": "Your app doesn't have to use the standard colors and text, let your user pick the background and text color from 2 combo's.  from guizero import App, Combo, Text\n\ndef update_bg():\n    app.bg = bg_combo.value\n\ndef update_text():\n    app.text_color = text_combo.value\n\ncolors = [\"black\", \"white\", \"red\", \"green\", \"blue\"]\n\napp = App()\napp.bg = \"black\"\napp.text_color = \"white\"\n\ntitle1 = Text(app, text=\"Background color\")\nbg_combo = Combo(app, options=colors, selected=app.bg, command=update_bg)\n\ntitle2 = Text(app, text=\"Text color\")\ntext_combo = Combo(app, options=colors, selected=app.text_color, command=update_text)\n\napp.display()",
-            "title": "Change your apps appearance"
-        },
-        {
-            "location": "/recipes/#scale-an-image",
-            "text": "Display an image on the screen with 2 sliders, 1 for height and 1 for width.  from guizero import App, Slider, Picture\n\ndef resize():\n    picture.width = width.value\n    picture.height = height.value\n\napp = App(layout=\"grid\")\n\npicture = Picture(app, image=\"image.gif\", grid=[0,1])\n\nwidth = Slider(app, command=resize, grid=[0,0], start=1, end=picture.width)\nwidth.width = picture.width\nwidth.value = picture.width\n\nheight = Slider(app, command=resize, horizontal=False, grid=[1,1], start=1, end=picture.height)\nheight.height = picture.height\nheight.value = picture.height\n\napp.display()",
-            "title": "Scale an image"
-        },
-        {
-            "location": "/app/",
-            "text": "App\n\n\n(Contains a \ntkinter.Tk\n object)\n\n\n__init__(self, title=\"guizero\", width=500, height=500, layout=\"auto\", bgcolor=None, bg=None, visible=True)\n\n\nWhat is it?\n\n\nThe \nApp\n object is the basis of all GUIs created using guizero. It is the main window which contains all of the other widgets.\n\n\n\n\nHow do I make one?\n\n\nCreate an \nApp\n object like this:\n\n\nfrom guizero import App\napp = App()\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create an \nApp\n object you can specify any of the following parameters, all of which are optional. Specify parameters in the brackets like this: \napp = App(bg=\"red\", height=200)\n\n\n\n\n\n\n\n\nParameter\n\n\nData type\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nNone\n\n\nNo\n\n\nThe background colour of the app window and widgets inside it. Takes a \ncolor\n value.\n\n\n\n\n\n\nheight\n\n\nint\n\n\n500\n\n\nNo\n\n\nThe height of the window in pixels.\n\n\n\n\n\n\nlayout\n\n\nstring\n\n\n\"auto\"\n\n\nNo\n\n\nWhether widgets pack themselves (\n\"auto\"\n) or you specify their position on a grid (\n\"grid\"\n)\n\n\n\n\n\n\ntitle\n\n\nstring\n\n\n\"guizero\"\n\n\nNo\n\n\nThe title displayed in the bar at the top of the window.\n\n\n\n\n\n\nwidth\n\n\nint\n\n\n500\n\n\nNo\n\n\nThe width of the window in pixels.\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the App should be visible.\n\n\n\n\n\n\nbgcolor\n\n\nstring\n\n\nNone\n\n\nNo\n\n\nReplaced by \nbg\n parameter\n\n\n\n\n\n\n\n\nParameters in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nMethods\n\n\nYou can call the following methods on an \nApp\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nadd_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None)\n\n\ntk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int)\n\n\nWidget\n\n\nAdds a tk widget into a guizero container. Note - this is an advanced feature see \nUsing tk\n for more information.\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables all the widgets in the app so that they cannot be interacted with\n\n\n\n\n\n\ndisplay()\n\n\n-\n\n\n-\n\n\nDisplays the app on the screen. You \nMUST\n call this method at the end of your program to display the app on the screen.\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables all the widgets in the app\n\n\n\n\n\n\nexit_full_screen()\n\n\n-\n\n\n-\n\n\nExit full screen display\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the app window from view.\n\n\n\n\n\n\non_close(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCalls the given function when the user tries to close the window.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the app window if it was previously hidden\n\n\n\n\n\n\nupdate()\n\n\n-\n\n\n-\n\n\nForce the application to update itself, useful if changes aren't reflected in the UI.\n\n\n\n\n\n\nset_full_screen(keybind)\n\n\nString\n\n\n-\n\n\nSet the application to display full screen. Option to specify a key to exit full screen (default is 'Esc'.)\n\n\n\n\n\n\nset_title(title)\n\n\ntitle (string)\n\n\n-\n\n\nReplaced by \ntitle\n property\n\n\n\n\n\n\nbgcolor\n\n\nbgcolor (string)\n\n\n-\n\n\nReplaced by \nbg\n property\n\n\n\n\n\n\n\n\nParameters in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the window\n\n\n\n\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the app is enabled\n\n\n\n\n\n\n\n\n\n\nheight\n\n\nint\n\n\nThe height of the window\n\n\n\n\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font that widgets should use\n\n\n\n\n\n\n\n\n\n\nfull_screen\n\n\nboolean\n\n\nFalse\n\n\nNo\n\n\nWhether the App is full screen\n\n\n\n\n\n\nlayout\n\n\nstring\n\n\nThe layout being used by the App (\n\"auto\"\n) or (\n\"grid\"\n)\n\n\n\n\n\n\n\n\n\n\ntitle\n\n\nstring\n\n\nThe title of the window\n\n\n\n\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text widgets should use\n\n\n\n\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text widgets should use\n\n\n\n\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf the app is visible\n\n\n\n\n\n\n\n\n\n\nwidth\n\n\nint\n\n\nThe width of the window\n\n\n\n\n\n\n\n\n\n\n\n\nRefer to a property as \n<name of widget>.property\n. For example, if your \nApp\n object is called \napp\n you would write \napp.title\n.\n\n\nYou can \nset\n the property (for example \napp.title = \"Hello world\"\n) or \nget\n the value of the property to use (for example \nprint(app.title)\n).\n\n\nExamples\n\n\nCreating an App object\n\n\nCreate an \nApp\n object by calling the \nApp()\n constructor. You should give the object a name so you can refer to it later - in this case we have called it \napp\n. It is best to keep the name you give to your \nApp\n object quite short, as you will have to use it to tell other widgets where they should be stored.\n\n\nAt the end of the program you \nMUST\n tell the app object to begin the display loop.\n\n\nfrom guizero import App\napp = App(title=\"My app\", height=300, width=200)\napp.display()\n\n\n\n\nChanging the title\n\n\nYou can change the title of the app object once it has been created like this:\n\n\nfrom guizero import App\napp = App(title=\"My app\", height=300, width=200)\napp.title = \"A different title\"\napp.display()\n\n\n\n\nThis will display the app with the updated title:",
-            "title": "App"
-        },
-        {
-            "location": "/app/#app",
-            "text": "(Contains a  tkinter.Tk  object)  __init__(self, title=\"guizero\", width=500, height=500, layout=\"auto\", bgcolor=None, bg=None, visible=True)",
-            "title": "App"
-        },
-        {
-            "location": "/app/#what-is-it",
-            "text": "The  App  object is the basis of all GUIs created using guizero. It is the main window which contains all of the other widgets.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/app/#how-do-i-make-one",
-            "text": "Create an  App  object like this:  from guizero import App\napp = App()\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/app/#starting-parameters",
-            "text": "When you create an  App  object you can specify any of the following parameters, all of which are optional. Specify parameters in the brackets like this:  app = App(bg=\"red\", height=200)     Parameter  Data type  Default  Compulsory  Description      bg  color  None  No  The background colour of the app window and widgets inside it. Takes a  color  value.    height  int  500  No  The height of the window in pixels.    layout  string  \"auto\"  No  Whether widgets pack themselves ( \"auto\" ) or you specify their position on a grid ( \"grid\" )    title  string  \"guizero\"  No  The title displayed in the bar at the top of the window.    width  int  500  No  The width of the window in pixels.    visible  boolean  True  No  If the App should be visible.    bgcolor  string  None  No  Replaced by  bg  parameter     Parameters in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/app/#methods",
-            "text": "You can call the following methods on an  App  object.     Method  Takes  Returns  Description      add_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None)  tk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int)  Widget  Adds a tk widget into a guizero container. Note - this is an advanced feature see  Using tk  for more information.    after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    destroy()  -  -  Destroys the widget    disable()  -  -  Disables all the widgets in the app so that they cannot be interacted with    display()  -  -  Displays the app on the screen. You  MUST  call this method at the end of your program to display the app on the screen.    enable()  -  -  Enables all the widgets in the app    exit_full_screen()  -  -  Exit full screen display    focus()  -  -  Gives focus to the widget    hide()  -  -  Hides the app window from view.    on_close(command)  command (function name)  -  Calls the given function when the user tries to close the window.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    show()  -  -  Displays the app window if it was previously hidden    update()  -  -  Force the application to update itself, useful if changes aren't reflected in the UI.    set_full_screen(keybind)  String  -  Set the application to display full screen. Option to specify a key to exit full screen (default is 'Esc'.)    set_title(title)  title (string)  -  Replaced by  title  property    bgcolor  bgcolor (string)  -  Replaced by  bg  property     Parameters in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Methods"
-        },
-        {
-            "location": "/app/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description        bg  color  The background colour of the window      enabled  boolean  True  if the app is enabled      height  int  The height of the window      font  string  The font that widgets should use      full_screen  boolean  False  No  Whether the App is full screen    layout  string  The layout being used by the App ( \"auto\" ) or ( \"grid\" )      title  string  The title of the window      text_size  int  The size of the text widgets should use      text_color  color  The colour of the text widgets should use      visible  boolean  If the app is visible      width  int  The width of the window       Refer to a property as  <name of widget>.property . For example, if your  App  object is called  app  you would write  app.title .  You can  set  the property (for example  app.title = \"Hello world\" ) or  get  the value of the property to use (for example  print(app.title) ).",
-            "title": "Properties"
-        },
-        {
-            "location": "/app/#examples",
-            "text": "Creating an App object  Create an  App  object by calling the  App()  constructor. You should give the object a name so you can refer to it later - in this case we have called it  app . It is best to keep the name you give to your  App  object quite short, as you will have to use it to tell other widgets where they should be stored.  At the end of the program you  MUST  tell the app object to begin the display loop.  from guizero import App\napp = App(title=\"My app\", height=300, width=200)\napp.display()  Changing the title  You can change the title of the app object once it has been created like this:  from guizero import App\napp = App(title=\"My app\", height=300, width=200)\napp.title = \"A different title\"\napp.display()  This will display the app with the updated title:",
-            "title": "Examples"
-        },
-        {
-            "location": "/box/",
-            "text": "Box\n\n\n(Contains a \ntkinter.Frame\n object)\n\n\n__init__(self, master, layout=\"auto\", grid=None, align=None, visible=True, enabled=None)\n\n\nWhat is it?\n\n\nThe \nBox\n object is an invisible container which can contain other widgets. It is the only object other than \nApp\n which can act as the \nmaster\n for other objects and can have its own layout manager.\n\n\nYou can use the \nBox\n object to group other objects within your GUI.\n\n\nHow do I make one?\n\n\nCreate a \nBox\n object like this:\n\n\nfrom guizero import App, Box\napp = App()\nbox = Box(app)\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nBox\n object you \nmust\n specify a master, and you can specify any of the optional parameters. Specify parameters in the brackets like this: \nbox = Box(app, layout=\"grid\")\n\n\n\n\n\n\n\n\nParameter\n\n\nData type\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\ngrid\n\n\nList\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\nlayout\n\n\nstring\n\n\n\"auto\"\n\n\n-\n\n\nWhether widgets \ninside this box\n pack themselves (\n\"auto\"\n) or you specify their position on a grid (\n\"grid\"\n)\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the width of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the height of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\nborder\n\n\nint\n\n\nNone\n\n\nNo\n\n\nSets the border thickness. \n0\n or \nFalse\n is no border. \nTrue\n or value > 1 sets a border.\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on a \nBox\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nadd_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None)\n\n\ntk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int)\n\n\nWidget\n\n\nAdds a tk widget into a guizero container. Note - this is an advanced feature see \nUsing tk\n for more information.\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables all the widgets in the box so that they cannot be interacted with\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables all the widgets in the box\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget (e.g. focusing a \nTextBox\n so that the user can type inside it)\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nset_border(thickness, color)\n\n\nthickness (int), color (\ncolor\n)\n\n\n-\n\n\nSets the border thickness and color. Setting thickness to \n0\n will result in no border.\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nborder\n\n\nint\n\n\nThe border thickness, setting to \n0\n or \nFalse\n (the default) there is no border.\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the box is enabled\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font that widgets should use\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\nlayout\n\n\nstring\n\n\nThe layout being used by the Box (\n\"auto\"\n) or (\n\"grid\"\n)\n\n\n\n\n\n\nmaster\n\n\nApp\n\n\nThe \nApp\n object to which this box belongs\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text widgets should use\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text widgets should use\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\n\n\nExamples\n\n\nPutting widgets in a Box\n\n\nA \nBox\n object is invisible, but it can contain other widgets. In this example, there are two \nText\n objects. One has \nbox\n as its master, the other has \napp\n as its master.\n\n\nfrom guizero import App, Box, Text\napp = App(title=\"My app\", height=300, width=400)\nbox = Box(app)\ntext1 = Text(box, text=\"Hello from the box\", size=14, text_color=\"red\", font=\"Arial\")\ntext2 = Text(app, text=\"Hello from the app\", size=14, text_color=\"blue\", font=\"Courier New\")\napp.display()\n\n\n\n\n\n\nGrouping objects within a Box\n\n\nIt is useful to put objects in a box to group them together. For example here we have given the \napp\n a grid layout, then placed some text at [0,0] and the \nBox\n object at [1,0]. This means that the text will appear on the left, and the contents of the Box will appear on the right.\n\n\nThe \nBox\n object itself has a grid layout and contains six buttons which are positioned on a \nseparate\n grid layout belonging to the box.\n\n\nfrom guizero import App, Text, Box, PushButton\ndef do_nothing():\n    return 0\n\napp = App(title=\"My app\", height=300, width=300, layout=\"grid\")\ntext = Text(app, text=\"Some text here\", grid=[0,0])\nbox = Box(app, layout=\"grid\", grid=[1,0])\nbutton1 = PushButton(box, command=do_nothing, text=\"1\", grid=[0,0])\nbutton2 = PushButton(box, command=do_nothing, text=\"2\", grid=[1,0])\nbutton3 = PushButton(box, command=do_nothing, text=\"3\", grid=[2,0])\nbutton4 = PushButton(box, command=do_nothing, text=\"4\", grid=[0,1])\nbutton5 = PushButton(box, command=do_nothing, text=\"5\", grid=[1,1])\nbutton6 = PushButton(box, command=do_nothing, text=\"6\", grid=[2,1])\napp.display()",
-            "title": "Box"
-        },
-        {
-            "location": "/box/#box",
-            "text": "(Contains a  tkinter.Frame  object)  __init__(self, master, layout=\"auto\", grid=None, align=None, visible=True, enabled=None)",
-            "title": "Box"
-        },
-        {
-            "location": "/box/#what-is-it",
-            "text": "The  Box  object is an invisible container which can contain other widgets. It is the only object other than  App  which can act as the  master  for other objects and can have its own layout manager.  You can use the  Box  object to group other objects within your GUI.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/box/#how-do-i-make-one",
-            "text": "Create a  Box  object like this:  from guizero import App, Box\napp = App()\nbox = Box(app)\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/box/#starting-parameters",
-            "text": "When you create a  Box  object you  must  specify a master, and you can specify any of the optional parameters. Specify parameters in the brackets like this:  box = Box(app, layout=\"grid\")     Parameter  Data type  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    grid  List  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    layout  string  \"auto\"  -  Whether widgets  inside this box  pack themselves ( \"auto\" ) or you specify their position on a grid ( \"grid\" )    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    width  size  None  No  Set the width of the widget in pixels or to  \"fill\"    height  size  None  No  Set the height of the widget in pixels or to  \"fill\"    border  int  None  No  Sets the border thickness.  0  or  False  is no border.  True  or value > 1 sets a border.",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/box/#methods",
-            "text": "You can call the following methods on a  Box  object.     Method  Takes  Returns  Description      add_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None)  tk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int)  Widget  Adds a tk widget into a guizero container. Note - this is an advanced feature see  Using tk  for more information.    after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    disable()  -  -  Disables all the widgets in the box so that they cannot be interacted with    destroy()  -  -  Destroys the widget    enable()  -  -  Enables all the widgets in the box    focus()  -  -  Gives focus to the widget (e.g. focusing a  TextBox  so that the user can type inside it)    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    set_border(thickness, color)  thickness (int), color ( color )  -  Sets the border thickness and color. Setting thickness to  0  will result in no border.    show()  -  -  Displays the widget if it was previously hidden",
-            "title": "Methods"
-        },
-        {
-            "location": "/box/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    border  int  The border thickness, setting to  0  or  False  (the default) there is no border.    bg  color  The background colour of the widget    enabled  boolean  True  if the box is enabled    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    font  string  The font that widgets should use    height  size  Set the height of the widget in pixels or to  \"fill\"    layout  string  The layout being used by the Box ( \"auto\" ) or ( \"grid\" )    master  App  The  App  object to which this box belongs    text_size  int  The size of the text widgets should use    text_color  color  The colour of the text widgets should use    visible  boolean  If this widget is visible    width  size  Set the width of the widget in pixels or to  \"fill\"",
-            "title": "Properties"
-        },
-        {
-            "location": "/box/#examples",
-            "text": "Putting widgets in a Box  A  Box  object is invisible, but it can contain other widgets. In this example, there are two  Text  objects. One has  box  as its master, the other has  app  as its master.  from guizero import App, Box, Text\napp = App(title=\"My app\", height=300, width=400)\nbox = Box(app)\ntext1 = Text(box, text=\"Hello from the box\", size=14, text_color=\"red\", font=\"Arial\")\ntext2 = Text(app, text=\"Hello from the app\", size=14, text_color=\"blue\", font=\"Courier New\")\napp.display()   Grouping objects within a Box  It is useful to put objects in a box to group them together. For example here we have given the  app  a grid layout, then placed some text at [0,0] and the  Box  object at [1,0]. This means that the text will appear on the left, and the contents of the Box will appear on the right.  The  Box  object itself has a grid layout and contains six buttons which are positioned on a  separate  grid layout belonging to the box.  from guizero import App, Text, Box, PushButton\ndef do_nothing():\n    return 0\n\napp = App(title=\"My app\", height=300, width=300, layout=\"grid\")\ntext = Text(app, text=\"Some text here\", grid=[0,0])\nbox = Box(app, layout=\"grid\", grid=[1,0])\nbutton1 = PushButton(box, command=do_nothing, text=\"1\", grid=[0,0])\nbutton2 = PushButton(box, command=do_nothing, text=\"2\", grid=[1,0])\nbutton3 = PushButton(box, command=do_nothing, text=\"3\", grid=[2,0])\nbutton4 = PushButton(box, command=do_nothing, text=\"4\", grid=[0,1])\nbutton5 = PushButton(box, command=do_nothing, text=\"5\", grid=[1,1])\nbutton6 = PushButton(box, command=do_nothing, text=\"6\", grid=[2,1])\napp.display()",
-            "title": "Examples"
-        },
-        {
-            "location": "/buttongroup/",
-            "text": "ButtonGroup\n\n\n(Contains a \ntkinter.Frame\n object)\n\n\n__init__(self, master, options=[], selected=None, horizontal=False, command=None, grid=None, align=None, args=None, visible=True, enabled=None)\n\n\nWhat is it?\n\n\nThe \nButtonGroup\n object displays a group of radio buttons, allowing the user to choose a single option.\n\n\n\n\nHow do I make one?\n\n\nCreate a \nButtonGroup\n object like this:\n\n\nfrom guizero import App, ButtonGroup\napp = App()\nchoice = ButtonGroup(app, options=[\"cheese\", \"ham\", \"salad\"], selected=\"cheese\")\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nButtonGroup\n object you \nmust\n specify a \nmaster\n and you can specify any of the optional parameters. Specify parameters in the brackets like this: \nchoice = ButtonGroup(app, options=[\"cheese\", \"ham\", \"salad\"], selected=1)\n\n\n\n\n\n\n\n\nParameter\n\n\nTakes\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\noptions\n\n\nlist or 2D List\n\n\n-\n\n\nNo\n\n\nEither a list or a 2D list of [text, value] pairs. If a 2D list is specified, the first item in the pair will be displayed on the interface, and the second item will be a hidden value associated with this option.\n\n\n\n\n\n\nselected\n\n\nstring\n\n\n-\n\n\n-\n\n\nThe option that should be selected, if a value isn't provided the first option will be selected.\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\ncommand\n\n\nfunction name\n\n\nNone\n\n\n-\n\n\nThe name of a function to call when the selected option changes.\n\n\n\n\n\n\nargs\n\n\nlist\n\n\nNone\n\n\n-\n\n\nIf you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list\n\n\n\n\n\n\ngrid\n\n\nlist [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\nhorizontal\n\n\nboolean\n\n\nFalse\n\n\n-\n\n\nWhether the buttons stack vertically or horizontally. (Defaults to vertical)\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the height of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on an \nButtonGroup\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nappend(option)\n\n\nitem (string)\n\n\n-\n\n\nAppends a new \noption\n to the end of the ButtonGroup.\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it is \"greyed out\" and cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget\n\n\n\n\n\n\nget_group_as_list()\n\n\n-\n\n\nlist\n\n\nReturns a list containing all of the text/hidden value pairs from the ButtonGroup (useful for debugging)\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\ninsert(index, option)\n\n\nindex (int), option (string)\n\n\n-\n\n\nInsert a new \noption\n in the ButtonGroup at \nindex\n\n\n\n\n\n\nremove(option)\n\n\nitem (string)\n\n\nBoolean\n\n\nRemoves the first \noption\n from the ButtonGroup. Returns \nTrue\n if an item was removed.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\nupdate_command(command, args =None)\n\n\ncommand (function name), args (\nOptional\n List of arguments to be passed to command)\n\n\n-\n\n\nUpdates the function to call when the selected option changes\n\n\n\n\n\n\nget()\n\n\n-\n\n\nstring\n\n\nReplaced by \nvalue\n property\n\n\n\n\n\n\nset(value)\n\n\nvalue (string)\n\n\n-\n\n\nReplaced by \nvalue\n property\n\n\n\n\n\n\n\n\nParameters in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font of the text\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nvalue\n\n\nstring\n\n\nThe hidden value associated with the currently selected option\n\n\n\n\n\n\nvalue_text\n\n\nstring\n\n\nThe text associated with the currently selected option\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text\n\n\n\n\n\n\n\n\nRefer to a property as \n<name of widget>.property\n. For example, if your \nButtonGroup\n object is called \nchoice\n you would write \nchoice.value\n.\n\n\nYou can \nset\n the property (for example \nchoice.value = \"2\"\n) or \nget\n the value of the property to use (for example \nprint(choice.value)\n).\n\n\nExamples\n\n\nCreating a ButtonGroup with a 2D list\n\n\nIf you want to create a ButtonGroup object with your own hidden values you can specify a 2D list of options:\n\n\nfrom guizero import App, ButtonGroup, Text\n\ndef update_text():\n    what_is_selected.value = activities.value\n\napp = App()\nactivities = ButtonGroup(app, options=[\n                              [\"Roller Skating\", \"skate\"],\n                              [\"White water rafting\", \"WWR\"],\n                              [\"Mountain climbing\", \"climb\"]\n                            ],\n                            selected=\"skate\", command=update_text)\n\nwhat_is_selected = Text(app, text=\"skate\")\napp.display()",
-            "title": "ButtonGroup"
-        },
-        {
-            "location": "/buttongroup/#buttongroup",
-            "text": "(Contains a  tkinter.Frame  object)  __init__(self, master, options=[], selected=None, horizontal=False, command=None, grid=None, align=None, args=None, visible=True, enabled=None)",
-            "title": "ButtonGroup"
-        },
-        {
-            "location": "/buttongroup/#what-is-it",
-            "text": "The  ButtonGroup  object displays a group of radio buttons, allowing the user to choose a single option.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/buttongroup/#how-do-i-make-one",
-            "text": "Create a  ButtonGroup  object like this:  from guizero import App, ButtonGroup\napp = App()\nchoice = ButtonGroup(app, options=[\"cheese\", \"ham\", \"salad\"], selected=\"cheese\")\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/buttongroup/#starting-parameters",
-            "text": "When you create a  ButtonGroup  object you  must  specify a  master  and you can specify any of the optional parameters. Specify parameters in the brackets like this:  choice = ButtonGroup(app, options=[\"cheese\", \"ham\", \"salad\"], selected=1)     Parameter  Takes  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    options  list or 2D List  -  No  Either a list or a 2D list of [text, value] pairs. If a 2D list is specified, the first item in the pair will be displayed on the interface, and the second item will be a hidden value associated with this option.    selected  string  -  -  The option that should be selected, if a value isn't provided the first option will be selected.    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    command  function name  None  -  The name of a function to call when the selected option changes.    args  list  None  -  If you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list    grid  list [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    horizontal  boolean  False  -  Whether the buttons stack vertically or horizontally. (Defaults to vertical)    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    width  size  None  No  Set the width of the widget in characters or to  \"fill\"    height  size  None  No  Set the height of the widget in characters or to  \"fill\"",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/buttongroup/#methods",
-            "text": "You can call the following methods on an  ButtonGroup  object.     Method  Takes  Returns  Description      append(option)  item (string)  -  Appends a new  option  to the end of the ButtonGroup.    after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it is \"greyed out\" and cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget    get_group_as_list()  -  list  Returns a list containing all of the text/hidden value pairs from the ButtonGroup (useful for debugging)    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    insert(index, option)  index (int), option (string)  -  Insert a new  option  in the ButtonGroup at  index    remove(option)  item (string)  Boolean  Removes the first  option  from the ButtonGroup. Returns  True  if an item was removed.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    show()  -  -  Displays the widget if it was previously hidden    update_command(command, args =None)  command (function name), args ( Optional  List of arguments to be passed to command)  -  Updates the function to call when the selected option changes    get()  -  string  Replaced by  value  property    set(value)  value (string)  -  Replaced by  value  property     Parameters in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Methods"
-        },
-        {
-            "location": "/buttongroup/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    enabled  boolean  True  if the widget is enabled    font  string  The font of the text    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height of the widget in characters or to  \"fill\"    master  App or Box  The container to which this widget belongs    value  string  The hidden value associated with the currently selected option    value_text  string  The text associated with the currently selected option    visible  boolean  If this widget is visible    width  size  Set the width of the widget in characters or to  \"fill\"    text_size  int  The size of the text    text_color  color  The colour of the text     Refer to a property as  <name of widget>.property . For example, if your  ButtonGroup  object is called  choice  you would write  choice.value .  You can  set  the property (for example  choice.value = \"2\" ) or  get  the value of the property to use (for example  print(choice.value) ).",
-            "title": "Properties"
-        },
-        {
-            "location": "/buttongroup/#examples",
-            "text": "Creating a ButtonGroup with a 2D list  If you want to create a ButtonGroup object with your own hidden values you can specify a 2D list of options:  from guizero import App, ButtonGroup, Text\n\ndef update_text():\n    what_is_selected.value = activities.value\n\napp = App()\nactivities = ButtonGroup(app, options=[\n                              [\"Roller Skating\", \"skate\"],\n                              [\"White water rafting\", \"WWR\"],\n                              [\"Mountain climbing\", \"climb\"]\n                            ],\n                            selected=\"skate\", command=update_text)\n\nwhat_is_selected = Text(app, text=\"skate\")\napp.display()",
-            "title": "Examples"
-        },
-        {
-            "location": "/checkbox/",
-            "text": "CheckBox\n\n\n(Contains a \ntkinter.Checkbutton\n object)\n\n\n__init__(self, master, text, command=None, grid=None, align=None, args=None, visible=True, enabled=None)\n\n\nWhat is it?\n\n\nThe \nCheckBox\n object displays a check box to allow an option to be ticked or unticked\n\n\n\n\nHow do I make one?\n\n\nCreate a \nCheckBox\n object like this:\n\n\nfrom guizero import App, CheckBox\napp = App()\ncheckbox = CheckBox(app, text=\"Add extra glitter\")\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nCheckBox\n object you \nmust\n specify \nmaster\n and \ntext\n and you can specify any of the optional parameters. Specify parameters in the brackets, like this: \ncheckbox = CheckBox(app, text=\"Add extra glitter\")\n\n\n\n\n\n\n\n\nParameter\n\n\nTakes\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\ntext\n\n\nstring\n\n\n\"\"\n\n\nNo\n\n\nThe text to display next to the check box\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\ncommand\n\n\nfunction name\n\n\nNone\n\n\n-\n\n\nThe name of a function to call when this checkbox is ticked/unticked\n\n\n\n\n\n\nargs\n\n\nlist\n\n\nNone\n\n\n-\n\n\nIf you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list\n\n\n\n\n\n\ngrid\n\n\nList [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the height of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on a \nCheckBox\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it is \"greyed out\" and cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\ntoggle()\n\n\n-\n\n\n-\n\n\nSwitches the \nCheckBox\n to the opposite of its current value. i.e. if it is ticked, untick it and vice versa\n\n\n\n\n\n\nupdate_command(command, args =None)\n\n\ncommand (function name), args (\nOptional\n List of arguments to be passed to command)\n\n\n-\n\n\nUpdates the function to call when the checkbox is ticked/unticked\n\n\n\n\n\n\nchange_text(newtext)\n\n\nnewtext (string)\n\n\n-\n\n\nReplaced by the \ntext\n property\n\n\n\n\n\n\nget_text()\n\n\n-\n\n\nstring\n\n\nReplaced by the \ntext\n property\n\n\n\n\n\n\nget_value()\n\n\n-\n\n\nint\n\n\nReplaced by the \nvalue\n property\n\n\n\n\n\n\n\n\nMethods in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font of the text\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\ntext\n\n\nstring\n\n\nThe text associated with the checkbox\n\n\n\n\n\n\nvalue\n\n\nint\n\n\n1\n if the CheckBox is ticked or \n0\n if it is not ticked\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text\n\n\n\n\n\n\n\n\nRefer to a property as \n<name of widget>.property\n. For example, if your \nCheckBox\n object is called \ncheckbox\n you would write \ncheckbox.value\n.\n\n\nYou can \nset\n the property (for example \ncheckbox.value = 1\n) or \nget\n the value of the property to use (for example \nprint(checkbox.value)\n).\n\n\nExamples\n\n\nCreating multiple CheckBoxes\n\n\nCreate multiple CheckBoxes like this.\n\n\nfrom guizero import App, CheckBox\napp = App()\nglitter = CheckBox(app, text=\"Add glitter\")\nsparkles = CheckBox(app, text=\"Add sparkles\")\napp.display()\n\n\n\n\nCalling a function when a CheckBox value changes\n\n\nYou can call a function when the value of a CheckBox changes (becomes checked or unchecked). In this particular example all three CheckBoxes call the same function, but it is possible for each CheckBox object to call a different function.\n\n\nfrom guizero import App, Text, CheckBox, TextBox\ndef calculate_extras():\n    total = 0\n    if syrup.value == 1:\n        total += 20\n    if sprinkles.value == 1:\n        total += 10\n    if cream.value == 1:\n        total += 50\n    cost.value = total\n\n\napp = App()\n\nquestions = Text(app, text=\"What would you like with your coffee?\")\n\nsyrup = CheckBox(app, text=\"Caramel syrup (20p)\", command=calculate_extras)\nsprinkles = CheckBox(app, text=\"Chocolate sprinkles (10p)\", command=calculate_extras)\ncream = CheckBox(app, text=\"Whipped cream (50p)\", command=calculate_extras)\n\ncost_of_extras = Text(app, text=\"Cost of extras:\")\ncost = TextBox(app, text=\"0\")\n\napp.display()",
-            "title": "CheckBox"
-        },
-        {
-            "location": "/checkbox/#checkbox",
-            "text": "(Contains a  tkinter.Checkbutton  object)  __init__(self, master, text, command=None, grid=None, align=None, args=None, visible=True, enabled=None)",
-            "title": "CheckBox"
-        },
-        {
-            "location": "/checkbox/#what-is-it",
-            "text": "The  CheckBox  object displays a check box to allow an option to be ticked or unticked",
-            "title": "What is it?"
-        },
-        {
-            "location": "/checkbox/#how-do-i-make-one",
-            "text": "Create a  CheckBox  object like this:  from guizero import App, CheckBox\napp = App()\ncheckbox = CheckBox(app, text=\"Add extra glitter\")\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/checkbox/#starting-parameters",
-            "text": "When you create a  CheckBox  object you  must  specify  master  and  text  and you can specify any of the optional parameters. Specify parameters in the brackets, like this:  checkbox = CheckBox(app, text=\"Add extra glitter\")     Parameter  Takes  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    text  string  \"\"  No  The text to display next to the check box    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    command  function name  None  -  The name of a function to call when this checkbox is ticked/unticked    args  list  None  -  If you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list    grid  List [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    width  size  None  No  Set the width of the widget in characters or to  \"fill\"    height  size  None  No  Set the height of the widget in characters or to  \"fill\"",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/checkbox/#methods",
-            "text": "You can call the following methods on a  CheckBox  object.     Method  Takes  Returns  Description      after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it is \"greyed out\" and cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    show()  -  -  Displays the widget if it was previously hidden    toggle()  -  -  Switches the  CheckBox  to the opposite of its current value. i.e. if it is ticked, untick it and vice versa    update_command(command, args =None)  command (function name), args ( Optional  List of arguments to be passed to command)  -  Updates the function to call when the checkbox is ticked/unticked    change_text(newtext)  newtext (string)  -  Replaced by the  text  property    get_text()  -  string  Replaced by the  text  property    get_value()  -  int  Replaced by the  value  property     Methods in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Methods"
-        },
-        {
-            "location": "/checkbox/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    enabled  boolean  True  if the widget is enabled    font  string  The font of the text    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height of the widget in characters or to  \"fill\"    master  App or Box  The container to which this widget belongs    text  string  The text associated with the checkbox    value  int  1  if the CheckBox is ticked or  0  if it is not ticked    visible  boolean  If this widget is visible    width  size  Set the width of the widget in characters or to  \"fill\"    text_size  int  The size of the text    text_color  color  The colour of the text     Refer to a property as  <name of widget>.property . For example, if your  CheckBox  object is called  checkbox  you would write  checkbox.value .  You can  set  the property (for example  checkbox.value = 1 ) or  get  the value of the property to use (for example  print(checkbox.value) ).",
-            "title": "Properties"
-        },
-        {
-            "location": "/checkbox/#examples",
-            "text": "Creating multiple CheckBoxes  Create multiple CheckBoxes like this.  from guizero import App, CheckBox\napp = App()\nglitter = CheckBox(app, text=\"Add glitter\")\nsparkles = CheckBox(app, text=\"Add sparkles\")\napp.display()  Calling a function when a CheckBox value changes  You can call a function when the value of a CheckBox changes (becomes checked or unchecked). In this particular example all three CheckBoxes call the same function, but it is possible for each CheckBox object to call a different function.  from guizero import App, Text, CheckBox, TextBox\ndef calculate_extras():\n    total = 0\n    if syrup.value == 1:\n        total += 20\n    if sprinkles.value == 1:\n        total += 10\n    if cream.value == 1:\n        total += 50\n    cost.value = total\n\n\napp = App()\n\nquestions = Text(app, text=\"What would you like with your coffee?\")\n\nsyrup = CheckBox(app, text=\"Caramel syrup (20p)\", command=calculate_extras)\nsprinkles = CheckBox(app, text=\"Chocolate sprinkles (10p)\", command=calculate_extras)\ncream = CheckBox(app, text=\"Whipped cream (50p)\", command=calculate_extras)\n\ncost_of_extras = Text(app, text=\"Cost of extras:\")\ncost = TextBox(app, text=\"0\")\n\napp.display()",
-            "title": "Examples"
-        },
-        {
-            "location": "/combo/",
-            "text": "Combo\n\n\n(Contains a \ntkinter.OptionMenu\n object)\n\n\n__init__(self, master, options=[], selected=None, command=None, grid=None, align=None, visible=True, enabled=None)\n\n\nWhat is it?\n\n\nThe \nCombo\n object displays a drop down box allowing a single option to be selected from a list of options.\n\n\n\n\nHow do I make one?\n\n\nCreate a \nCombo\n object like this:\n\n\nfrom guizero import App, Combo\napp = App()\ncombo = Combo(app, options=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"])\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nCombo\n object you \nmust\n specify a \nmaster\n  and you can specify any of the optional parameters. Specify parameters in the brackets, like this: \ncombo = Combo(app, options=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"])\n\n\n\n\n\n\n\n\nParameter\n\n\nTakes\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\noptions\n\n\nList\n\n\n[]\n\n\nNo\n\n\nA list of options to display\n\n\n\n\n\n\nselected\n\n\nstring\n\n\nNone\n\n\nNo\n\n\nThe option to select by default\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\ncommand\n\n\nfunction name\n\n\nNone\n\n\n-\n\n\nThe name of a function to call when a different option is selected. This function MUST take either zero or one argument, if the function takes one argument the current value of the Combo will be given.\n\n\n\n\n\n\ngrid\n\n\nList [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the height of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on a \nCombo\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nappend(option)\n\n\nitem (string)\n\n\n-\n\n\nAppends a new \noption\n to the end of the Combo.\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\nclear()\n\n\n-\n\n\n-\n\n\nRemoves all options from the Combo box\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it is \"greyed out\" and cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\ninsert(index, option)\n\n\nindex (int), item (string)\n\n\n-\n\n\nInsert a new \noption\n in the Combo at \nindex\n\n\n\n\n\n\nremove(option)\n\n\nitem (string)\n\n\nBoolean\n\n\nRemoves the first \noption\n from the Combo. Returns \nTrue\n if an item was removed.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nselect_default()\n\n\n-\n\n\n-\n\n\nResets the combo box so that the first item is selected\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\nupdate_command(command)\n\n\ncommand (function name)\n\n\n-\n\n\nUpdates the function to call when a different option is selected.\n\n\n\n\n\n\nadd_option(option)\n\n\noption (string)\n\n\n-\n\n\nAdds a new item to the combo box with the value \noption\n\n\n\n\n\n\nget()\n\n\n-\n\n\nstring\n\n\nReplaced by the \nvalue\n property\n\n\n\n\n\n\nset(text)\n\n\ntext (string)\n\n\n-\n\n\nReplaced by the \nvalue\n property\n\n\n\n\n\n\n\n\nMethods in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font of the text\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nvalue\n\n\nstring\n\n\nThe text associated with the currently selected option\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text\n\n\n\n\n\n\n\n\nRefer to a property as \n<name of widget>.property\n. For example, if your \nCombo\n object is called \ncombo\n you would write \ncombo.value\n.\n\n\nYou can \nset\n the property (for example \ncombo.value = \"Chicken\"\n) or \nget\n the value of the property to use (for example \nprint(combo.value)\n).\n\n\nExamples\n\n\nCalling a function when the value selected changes\n\n\nYou can call a function when the selected value in a \nCombo\n object changes. The function you call can take either zero or one argument, if the function takes one argument it will automatically be passed a string containing the currently selected value from the \nCombo\n object.\n\n\nfrom guizero import App, Text, Combo\ndef you_chose(selected_value):\n    if selected_value == \"Tiny goblet\":\n        result.value = \"You chose...wisely\"\n    else:\n        result.value = \"You chose...poorly\"\n\napp = App()\ninstructions = Text(app, text=\"Choose a goblet\")\ncombo = Combo(app, options=[\"\", \"Huge golden goblet\", \"Jewel encrusted goblet\", \"Tiny goblet\"], command=you_chose)\nresult = Text(app)\napp.display()",
-            "title": "Combo"
-        },
-        {
-            "location": "/combo/#combo",
-            "text": "(Contains a  tkinter.OptionMenu  object)  __init__(self, master, options=[], selected=None, command=None, grid=None, align=None, visible=True, enabled=None)",
-            "title": "Combo"
-        },
-        {
-            "location": "/combo/#what-is-it",
-            "text": "The  Combo  object displays a drop down box allowing a single option to be selected from a list of options.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/combo/#how-do-i-make-one",
-            "text": "Create a  Combo  object like this:  from guizero import App, Combo\napp = App()\ncombo = Combo(app, options=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"])\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/combo/#starting-parameters",
-            "text": "When you create a  Combo  object you  must  specify a  master   and you can specify any of the optional parameters. Specify parameters in the brackets, like this:  combo = Combo(app, options=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"])     Parameter  Takes  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    options  List  []  No  A list of options to display    selected  string  None  No  The option to select by default    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    command  function name  None  -  The name of a function to call when a different option is selected. This function MUST take either zero or one argument, if the function takes one argument the current value of the Combo will be given.    grid  List [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    width  size  None  No  Set the width of the widget in characters or to  \"fill\"    height  size  None  No  Set the height of the widget in characters or to  \"fill\"",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/combo/#methods",
-            "text": "You can call the following methods on a  Combo  object.     Method  Takes  Returns  Description      append(option)  item (string)  -  Appends a new  option  to the end of the Combo.    after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    clear()  -  -  Removes all options from the Combo box    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it is \"greyed out\" and cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    insert(index, option)  index (int), item (string)  -  Insert a new  option  in the Combo at  index    remove(option)  item (string)  Boolean  Removes the first  option  from the Combo. Returns  True  if an item was removed.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    select_default()  -  -  Resets the combo box so that the first item is selected    show()  -  -  Displays the widget if it was previously hidden    update_command(command)  command (function name)  -  Updates the function to call when a different option is selected.    add_option(option)  option (string)  -  Adds a new item to the combo box with the value  option    get()  -  string  Replaced by the  value  property    set(text)  text (string)  -  Replaced by the  value  property     Methods in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Methods"
-        },
-        {
-            "location": "/combo/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    enabled  boolean  True  if the widget is enabled    font  string  The font of the text    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height of the widget in characters or to  \"fill\"    master  App or Box  The container to which this widget belongs    value  string  The text associated with the currently selected option    visible  boolean  If this widget is visible    width  size  Set the width of the widget in characters or to  \"fill\"    text_size  int  The size of the text    text_color  color  The colour of the text     Refer to a property as  <name of widget>.property . For example, if your  Combo  object is called  combo  you would write  combo.value .  You can  set  the property (for example  combo.value = \"Chicken\" ) or  get  the value of the property to use (for example  print(combo.value) ).",
-            "title": "Properties"
-        },
-        {
-            "location": "/combo/#examples",
-            "text": "Calling a function when the value selected changes  You can call a function when the selected value in a  Combo  object changes. The function you call can take either zero or one argument, if the function takes one argument it will automatically be passed a string containing the currently selected value from the  Combo  object.  from guizero import App, Text, Combo\ndef you_chose(selected_value):\n    if selected_value == \"Tiny goblet\":\n        result.value = \"You chose...wisely\"\n    else:\n        result.value = \"You chose...poorly\"\n\napp = App()\ninstructions = Text(app, text=\"Choose a goblet\")\ncombo = Combo(app, options=[\"\", \"Huge golden goblet\", \"Jewel encrusted goblet\", \"Tiny goblet\"], command=you_chose)\nresult = Text(app)\napp.display()",
-            "title": "Examples"
-        },
-        {
-            "location": "/drawing/",
-            "text": "Drawing\n\n\n(Contains a \ntkinter.canvas\n object)\n\n\n__init__(self, master, width=100, height=100, grid=None, align=None, visible=True, enabled=None):\n\n\nWhat is it?\n\n\nThe \nDrawing\n object allows shapes, images and text to be created.\n\n\n\n\nHow do I make one?\n\n\nCreate a \nDrawing\n object and draw a blue rectangle 50x50 pixels like this:\n\n\nfrom guizero import App, Drawing\napp = App()\ndrawing = Drawing(app)\ndrawing.rectangle(10, 10, 60, 60, color=\"blue\")\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nDrawing\n object you \nmust\n specify \nmaster\n and you can specify any of the optional parameters. Specify parameters in the brackets, like this: \ndrawing = Drawing(app, height=300, width=300)\n\n\n\n\n\n\n\n\nParameter\n\n\nTakes\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the height of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\ngrid\n\n\nList [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on a \nDrawing\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\nclear()\n\n\n-\n\n\n-\n\n\nClears the drawing\n\n\n\n\n\n\ndelete()\n\n\nid (int) -\n\n\n-\n\n\nDeletes an \"object\" (line, triangle, image, etc) from the drawing.\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it is \"greyed out\" and cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\nimage(self, x, y, image, width=None, height=None):\n\n\nx (int), y (int), image (str), width (int), height (int)\n\n\nId\n\n\nInserts an image into the drawing at the specified position and returns the id of the image created.\n\n\n\n\n\n\nline(x1, y1, x2, y2, color=\"black\", width=1)\n\n\nx1 (int), y1 (int), x2 (int), y2 (int), color (str), width (int)\n\n\nId\n\n\nDraws a line between 2 points and returns the id of the line created.\n\n\n\n\n\n\noval(x1, y1, x2, y2, color=\"black\", outline=False, outline_color=\"black\")\n\n\nx1 (int), y1 (int), x2 (int), y2 (int), color (str), outline (int), outline_color (str)\n\n\nId\n\n\nDraws an oval between 2 points and returns the id of the shape created.\n\n\n\n\n\n\npolygon(*coords, color=\"black\", outline=False, outline_color=\"black\")\n\n\ncoords (list int), color (str), outline (int), outline_color (str)\n\n\nId\n\n\nDraws a polygon between any number of coordinates passed as pairs of x, y and returns the id of the shape created.\n\n\n\n\n\n\nrectangle(x1, y1, x2, y2, color=\"black\", outline=False, outline_color=\"black\")\n\n\nx1 (int), y1 (int), x2 (int), y2 (int), color (str), outline (int), outline_color (str)\n\n\nId\n\n\nDraws a rectangle between 2 points and returns the id of the shape created.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\ntext(x, y, text, color=\"black\", font=None, size=None, max_width=None)\n\n\nx (int), y (int), text (str), color (str), font (str), size (str), max_width (int)\n\n\nId\n\n\nInserts text into the drawing at the specified position and returns the id of the shape created.\n\n\n\n\n\n\ntriangle(x1, y1, x2, y2, x3, y3, color=\"black\", outline=False, outline_color=\"black\")\n\n\nx1 (int), y1 (int), x2 (int), y2 (int), x3 (int), y3 (int), color (str), outline (int), outline_color (str)\n\n\nId\n\n\nDraws a triangle between 3 points and returns the id of the shape created.\n\n\n\n\n\n\nupdate_command(command)\n\n\ncommand (function name)\n\n\n-\n\n\nUpdates the function to call when a different option is selected.\n\n\n\n\n\n\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\n\n\nRefer to a property as \n<name of widget>.property\n. For example, if your \nDrawing\n object is called \ndrawing\n you would write \ndrawing.bg\n.\n\n\nYou can \nset\n the property (for example \ndrawing.bg = \"blue\"\n) or \nget\n the value of the property to use (for example \nprint(drawing.bg)\n).\n\n\nExamples\n\n\n Draw a robot face \n\n\nUse a rectangle for the face, ovals for the eyes, a triangle for the nose and lines for the mouth. \n\n\nfrom guizero import App, Drawing\n\na = App()\n\n# create drawing object\nd = Drawing(a, width=220, height=220)\nd.rectangle(10, 10, 210, 210, color=\"light blue\")\nd.oval(30, 30, 50, 50, color=\"white\", outline=True)\nd.oval(170, 30, 190, 50, color=\"white\", outline=True)\nd.triangle(110, 90, 120, 110, 100, 110, color=\"black\")\nd.line(50, 180, 50, 160, color=\"red\", width=5)\nd.line(50, 180, 170, 180, color=\"red\", width=5)\nd.line(170, 180, 170, 160, color=\"red\", width=5)\n\na.display()",
-            "title": "Drawing"
-        },
-        {
-            "location": "/drawing/#drawing",
-            "text": "(Contains a  tkinter.canvas  object)  __init__(self, master, width=100, height=100, grid=None, align=None, visible=True, enabled=None):",
-            "title": "Drawing"
-        },
-        {
-            "location": "/drawing/#what-is-it",
-            "text": "The  Drawing  object allows shapes, images and text to be created.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/drawing/#how-do-i-make-one",
-            "text": "Create a  Drawing  object and draw a blue rectangle 50x50 pixels like this:  from guizero import App, Drawing\napp = App()\ndrawing = Drawing(app)\ndrawing.rectangle(10, 10, 60, 60, color=\"blue\")\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/drawing/#starting-parameters",
-            "text": "When you create a  Drawing  object you  must  specify  master  and you can specify any of the optional parameters. Specify parameters in the brackets, like this:  drawing = Drawing(app, height=300, width=300)     Parameter  Takes  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    width  size  None  No  Set the width of the widget in characters or to  \"fill\"    height  size  None  No  Set the height of the widget in characters or to  \"fill\"    grid  List [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/drawing/#methods",
-            "text": "You can call the following methods on a  Drawing  object.     Method  Takes  Returns  Description      after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    clear()  -  -  Clears the drawing    delete()  id (int) -  -  Deletes an \"object\" (line, triangle, image, etc) from the drawing.    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it is \"greyed out\" and cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    image(self, x, y, image, width=None, height=None):  x (int), y (int), image (str), width (int), height (int)  Id  Inserts an image into the drawing at the specified position and returns the id of the image created.    line(x1, y1, x2, y2, color=\"black\", width=1)  x1 (int), y1 (int), x2 (int), y2 (int), color (str), width (int)  Id  Draws a line between 2 points and returns the id of the line created.    oval(x1, y1, x2, y2, color=\"black\", outline=False, outline_color=\"black\")  x1 (int), y1 (int), x2 (int), y2 (int), color (str), outline (int), outline_color (str)  Id  Draws an oval between 2 points and returns the id of the shape created.    polygon(*coords, color=\"black\", outline=False, outline_color=\"black\")  coords (list int), color (str), outline (int), outline_color (str)  Id  Draws a polygon between any number of coordinates passed as pairs of x, y and returns the id of the shape created.    rectangle(x1, y1, x2, y2, color=\"black\", outline=False, outline_color=\"black\")  x1 (int), y1 (int), x2 (int), y2 (int), color (str), outline (int), outline_color (str)  Id  Draws a rectangle between 2 points and returns the id of the shape created.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    show()  -  -  Displays the widget if it was previously hidden    text(x, y, text, color=\"black\", font=None, size=None, max_width=None)  x (int), y (int), text (str), color (str), font (str), size (str), max_width (int)  Id  Inserts text into the drawing at the specified position and returns the id of the shape created.    triangle(x1, y1, x2, y2, x3, y3, color=\"black\", outline=False, outline_color=\"black\")  x1 (int), y1 (int), x2 (int), y2 (int), x3 (int), y3 (int), color (str), outline (int), outline_color (str)  Id  Draws a triangle between 3 points and returns the id of the shape created.    update_command(command)  command (function name)  -  Updates the function to call when a different option is selected.",
-            "title": "Methods"
-        },
-        {
-            "location": "/drawing/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    enabled  boolean  True  if the widget is enabled    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height of the widget in characters or to  \"fill\"    master  App or Box  The container to which this widget belongs    visible  boolean  If this widget is visible    width  size  Set the width of the widget in characters or to  \"fill\"     Refer to a property as  <name of widget>.property . For example, if your  Drawing  object is called  drawing  you would write  drawing.bg .  You can  set  the property (for example  drawing.bg = \"blue\" ) or  get  the value of the property to use (for example  print(drawing.bg) ).",
-            "title": "Properties"
-        },
-        {
-            "location": "/drawing/#examples",
-            "text": "Draw a robot face   Use a rectangle for the face, ovals for the eyes, a triangle for the nose and lines for the mouth.   from guizero import App, Drawing\n\na = App()\n\n# create drawing object\nd = Drawing(a, width=220, height=220)\nd.rectangle(10, 10, 210, 210, color=\"light blue\")\nd.oval(30, 30, 50, 50, color=\"white\", outline=True)\nd.oval(170, 30, 190, 50, color=\"white\", outline=True)\nd.triangle(110, 90, 120, 110, 100, 110, color=\"black\")\nd.line(50, 180, 50, 160, color=\"red\", width=5)\nd.line(50, 180, 170, 180, color=\"red\", width=5)\nd.line(170, 180, 170, 160, color=\"red\", width=5)\n\na.display()",
-            "title": "Examples"
-        },
-        {
-            "location": "/listbox/",
-            "text": "ListBox\n\n\n(Contains a \ntkinter.Listbox\n object)\n\n\n__init__(self, master, items=None, selected=None, command=None, grid=None, align=None, visible=True, enabled=None, multiselect=False, scrollbar=False)\n\n\nWhat is it?\n\n\nThe \nListBox\n object displays a list of items from which either single or multiple items can be selected.\n\n\n\n\nHow do I make one?\n\n\nCreate a \nListBox\n object like this:\n\n\nfrom guizero import App, ListBox\napp = App()\nlistbox = ListBox(app, items=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"])\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nListBox\n object you \nmust\n specify \nmaster\n and you can specify any of the optional parameters. Specify parameters in the brackets, like this: \nlistbox = ListBox(app, items=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"])\n\n\nIf you want the \nListBox\n to allow multiple items to be selected you must set the \nmultiselect\n optional parameter to \nTrue\n: \nlistbox = ListBox(app, multiselect=True)\n\n\n\n\n\n\n\n\nParameter\n\n\nTakes\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nselected\n\n\nstring or List\n\n\nNone\n\n\nNo\n\n\nThe item or items to select by default\n\n\n\n\n\n\nitems\n\n\nList\n\n\n-\n\n\nYes\n\n\nA list of items to display\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\ncommand\n\n\nfunction name\n\n\nNone\n\n\n-\n\n\nThe name of a function to call when a different option is selected. This function MUST take either zero or one argument, if the function takes one argument the current value of the ListBox will be given.\n\n\n\n\n\n\ngrid\n\n\nList [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nmultiselect\n\n\nboolean\n\n\nFalse\n\n\nNo\n\n\nIf the widget should allow multiple items to be selected.\n\n\n\n\n\n\nscrollbar\n\n\nboolean\n\n\nFalse\n\n\nNo\n\n\nIf the widget should have a verticle scrollbar.\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the width of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the height of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on a \nListBox\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\nappend(item)\n\n\nitem (string)\n\n\n-\n\n\nAppends a new \nitem\n to the end of the ListBox.\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\nclear()\n\n\n-\n\n\n-\n\n\nClears all the items in a ListBox\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it is \"greyed out\" and cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\ninsert(index, item)\n\n\nindex (int), item (string)\n\n\n-\n\n\nInsert a new \nitem\n in the ListBox at \nindex\n\n\n\n\n\n\nremove(item)\n\n\nitem (string)\n\n\nBoolean\n\n\nRemoves the first \nitem\n from the ListBox. Returns \nTrue\n if an item was removed.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\nupdate_command(command)\n\n\ncommand (function name)\n\n\n-\n\n\nUpdates the function to call when a different option is selected.\n\n\n\n\n\n\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font of the text\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\nitems\n\n\nList\n\n\nReturns a list of items in the ListBox\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nvalue\n\n\nstring\n\n\nSets or returns the items selected in a ListBox. Returns \nNone\n if 0 items are selected. If the ListBox is a not \nmultiselect\n, \nvalue\n is the item selected, if the ListBox is a \nmultiselect\n, \nvalue\n is a list of items selected.\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text\n\n\n\n\n\n\n\n\nRefer to a property as \n<name of widget>.property\n. For example, if your \nListBox\n object is called \nlistbox\n you would write \nlistbox.value\n.\n\n\nYou can \nset\n the property (for example \nlistbox.value = \"Chicken\"\n) or \nget\n the value of the property to use (for example \nprint(listbox.value)\n).\n\n\nExamples\n\n\n Select a text color from a ListBox \n\n\nWhen an item in the ListBox is selected a function will be called to change the color of the text.\n\n\nfrom guizero import App, ListBox, Text\n\ndef change_color(value):\n    t.text_color = value\n\na = App()\n\nt = Text(a, text=\"Its a ListBox\", color=\"black\")\n\nlistbox = ListBox(\n    a, \n    items=[\"red\", \"green\", \"blue\", \"yellow\", \"purple\", \"turquoise\", \"pink\", \"orange\", \"black\", \"brown\", \"cyan\"], \n    selected=\"black\", \n    command=change_color,\n    scrollbar=True)\n\na.display()",
-            "title": "ListBox"
-        },
-        {
-            "location": "/listbox/#listbox",
-            "text": "(Contains a  tkinter.Listbox  object)  __init__(self, master, items=None, selected=None, command=None, grid=None, align=None, visible=True, enabled=None, multiselect=False, scrollbar=False)",
-            "title": "ListBox"
-        },
-        {
-            "location": "/listbox/#what-is-it",
-            "text": "The  ListBox  object displays a list of items from which either single or multiple items can be selected.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/listbox/#how-do-i-make-one",
-            "text": "Create a  ListBox  object like this:  from guizero import App, ListBox\napp = App()\nlistbox = ListBox(app, items=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"])\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/listbox/#starting-parameters",
-            "text": "When you create a  ListBox  object you  must  specify  master  and you can specify any of the optional parameters. Specify parameters in the brackets, like this:  listbox = ListBox(app, items=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"])  If you want the  ListBox  to allow multiple items to be selected you must set the  multiselect  optional parameter to  True :  listbox = ListBox(app, multiselect=True)     Parameter  Takes  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    selected  string or List  None  No  The item or items to select by default    items  List  -  Yes  A list of items to display    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    command  function name  None  -  The name of a function to call when a different option is selected. This function MUST take either zero or one argument, if the function takes one argument the current value of the ListBox will be given.    grid  List [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    multiselect  boolean  False  No  If the widget should allow multiple items to be selected.    scrollbar  boolean  False  No  If the widget should have a verticle scrollbar.    width  size  None  No  Set the width of the widget in pixels or to  \"fill\"    height  size  None  No  Set the height of the widget in pixels or to  \"fill\"",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/listbox/#methods",
-            "text": "You can call the following methods on a  ListBox  object.     Method  Takes  Returns  Description      after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    append(item)  item (string)  -  Appends a new  item  to the end of the ListBox.    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    clear()  -  -  Clears all the items in a ListBox    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it is \"greyed out\" and cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    insert(index, item)  index (int), item (string)  -  Insert a new  item  in the ListBox at  index    remove(item)  item (string)  Boolean  Removes the first  item  from the ListBox. Returns  True  if an item was removed.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    show()  -  -  Displays the widget if it was previously hidden    update_command(command)  command (function name)  -  Updates the function to call when a different option is selected.",
-            "title": "Methods"
-        },
-        {
-            "location": "/listbox/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    enabled  boolean  True  if the widget is enabled    font  string  The font of the text    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height of the widget in pixels or to  \"fill\"    items  List  Returns a list of items in the ListBox    master  App or Box  The container to which this widget belongs    value  string  Sets or returns the items selected in a ListBox. Returns  None  if 0 items are selected. If the ListBox is a not  multiselect ,  value  is the item selected, if the ListBox is a  multiselect ,  value  is a list of items selected.    visible  boolean  If this widget is visible    width  size  Set the width of the widget in pixels or to  \"fill\"    text_size  int  The size of the text    text_color  color  The colour of the text     Refer to a property as  <name of widget>.property . For example, if your  ListBox  object is called  listbox  you would write  listbox.value .  You can  set  the property (for example  listbox.value = \"Chicken\" ) or  get  the value of the property to use (for example  print(listbox.value) ).",
-            "title": "Properties"
-        },
-        {
-            "location": "/listbox/#examples",
-            "text": "Select a text color from a ListBox   When an item in the ListBox is selected a function will be called to change the color of the text.  from guizero import App, ListBox, Text\n\ndef change_color(value):\n    t.text_color = value\n\na = App()\n\nt = Text(a, text=\"Its a ListBox\", color=\"black\")\n\nlistbox = ListBox(\n    a, \n    items=[\"red\", \"green\", \"blue\", \"yellow\", \"purple\", \"turquoise\", \"pink\", \"orange\", \"black\", \"brown\", \"cyan\"], \n    selected=\"black\", \n    command=change_color,\n    scrollbar=True)\n\na.display()",
-            "title": "Examples"
-        },
-        {
-            "location": "/menubar/",
-            "text": "MenuBar\n\n\n(Contains a \ntkinter.Menu\n object)\n\n\n__init__(self, master, toplevel, options)\n\n\nWhat is it?\n\n\nThe \nMenuBar\n object displays a menu at the top of the screen, with each menu option leading to a submenu.\n\n\n\n\nHow do I make one?\n\n\nCreate a \nMenuBar\n object like this:\n\n\nfrom guizero import App, MenuBar\ndef file_function():\n    print(\"File option\")\n\ndef edit_function():\n    print(\"Edit option\")\n\napp = App()\nmenubar = MenuBar(app,\n                  toplevel=[\"File\", \"Edit\"],\n                  options=[\n                      [ [\"File option 1\", file_function], [\"File option 2\", file_function] ],\n                      [ [\"Edit option 1\", edit_function], [\"Edit option 2\", edit_function] ]\n                  ])\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nMenuBar\n object you \nmust\n specify all of the parameters.\n\n\n\n\n\n\n\n\nParameter\n\n\nTakes\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\ntoplevel\n\n\nlist\n\n\n-\n\n\nYes\n\n\nA list of top level menu items\n\n\n\n\n\n\noptions\n\n\n3D list\n\n\n-\n\n\nYes\n\n\nA list of submenus, with each submenu being a list of options and each option being a text/command pair. See notes above for more details.\n\n\n\n\n\n\n\n\nThe \ntoplevel\n parameter should be a list of options you wish to display on the menu. In the example, the \ntoplevel\n options are File and Edit:\n\n\n\n\nThe options parameter should be a 3D List containing lists of submenu items, which are themselves lists. The elements in the list correspond to the elements in the \ntoplevel\n list, so the first list of submenu items provided in \noptions\n will be the submenu for the first menu heading provided in \ntoplevel\n and so on.\n\n\nThe menu item sub-sublists within \noptions\n should contain pairs consisting of the text to display on the menu and the function to call when that option is selected. In this example, the text \"File option 1\" is displayed and the function \nfile_function\n is called if this option is clicked on.\n\n\n[\"File option 1\", file_function]\n\n\n\n\nThe MenuBar is never displayed on a grid so there are no grid or alignment parameters.\n\n\nMethods\n\n\nYou can call the following methods on an \nMenuBar\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget (e.g. focusing a \nTextBox\n so that the user can type inside it)\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp\n\n\nThe \nApp\n object to which this MenuBar belongs",
-            "title": "MenuBar"
-        },
-        {
-            "location": "/menubar/#menubar",
-            "text": "(Contains a  tkinter.Menu  object)  __init__(self, master, toplevel, options)",
-            "title": "MenuBar"
-        },
-        {
-            "location": "/menubar/#what-is-it",
-            "text": "The  MenuBar  object displays a menu at the top of the screen, with each menu option leading to a submenu.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/menubar/#how-do-i-make-one",
-            "text": "Create a  MenuBar  object like this:  from guizero import App, MenuBar\ndef file_function():\n    print(\"File option\")\n\ndef edit_function():\n    print(\"Edit option\")\n\napp = App()\nmenubar = MenuBar(app,\n                  toplevel=[\"File\", \"Edit\"],\n                  options=[\n                      [ [\"File option 1\", file_function], [\"File option 2\", file_function] ],\n                      [ [\"Edit option 1\", edit_function], [\"Edit option 2\", edit_function] ]\n                  ])\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/menubar/#starting-parameters",
-            "text": "When you create a  MenuBar  object you  must  specify all of the parameters.     Parameter  Takes  Default  Compulsory  Description      master  App  -  Yes  The container to which this widget belongs    toplevel  list  -  Yes  A list of top level menu items    options  3D list  -  Yes  A list of submenus, with each submenu being a list of options and each option being a text/command pair. See notes above for more details.     The  toplevel  parameter should be a list of options you wish to display on the menu. In the example, the  toplevel  options are File and Edit:   The options parameter should be a 3D List containing lists of submenu items, which are themselves lists. The elements in the list correspond to the elements in the  toplevel  list, so the first list of submenu items provided in  options  will be the submenu for the first menu heading provided in  toplevel  and so on.  The menu item sub-sublists within  options  should contain pairs consisting of the text to display on the menu and the function to call when that option is selected. In this example, the text \"File option 1\" is displayed and the function  file_function  is called if this option is clicked on.  [\"File option 1\", file_function]  The MenuBar is never displayed on a grid so there are no grid or alignment parameters.",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/menubar/#methods",
-            "text": "You can call the following methods on an  MenuBar  object.     Method  Takes  Returns  Description      after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    destroy()  -  -  Destroys the widget    focus()  -  -  Gives focus to the widget (e.g. focusing a  TextBox  so that the user can type inside it)    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.",
-            "title": "Methods"
-        },
-        {
-            "location": "/menubar/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      master  App  The  App  object to which this MenuBar belongs",
-            "title": "Properties"
-        },
-        {
-            "location": "/picture/",
-            "text": "Picture\n\n\n(Contains a \ntkinter.Label\n object)\n\n\n__init__(self, master, image=None, grid=None, align=None, visible=True, enabled=None)\n\n\nWhat is it?\n\n\nThe \nPicture\n object displays an image.\n\n\n\n\nHow do I make one?\n\n\nCreate a \nPicture\n object like this:\n\n\nfrom guizero import App, Picture\napp = App()\npicture = Picture(app, image=\"test.gif\")\napp.display()\n\n\n\n\nYou must specify the correct path to the image. The image in the example is in the same directory as the program. If the image is in a different directory, specify a relative path, for example if the picture is in a subfolder called \nimages\n you would write:\n\n\npicture = Picture(app, image=\"images/test.gif\")\n\n\n\n\nImage support\n\n\nDepending on your operating system and whether you installed the guizero \nadditional image features\n will determine what \nimage types you can use\n with \nPicture\n.\n\n\nBy default GIF and PNG are supported, except macOS which only supports GIF.\n\n\nStarting parameters\n\n\nWhen you create a \nPicture\n object you \nmust\n specify \nmaster\n and you can specify any of the optional parameters. Specify parameters in the brackets, like this: \npicture = Picture(app, image=\"test.gif\")\n\n\n\n\n\n\n\n\nParameter\n\n\nTakes\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nimage\n\n\nstring\n\n\nNone\n\n\n-\n\n\nThe file path, tkinter.PhotoImage or PIL.Image you wish to display\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\ngrid\n\n\nList [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the width of the widget in pixels\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the height of the widget in pixels\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on a \nPicture\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it is \"greyed out\" and cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget (e.g. focusing a \nTextBox\n so that the user can type inside it)\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\nset(image)\n\n\nimage (string)\n\n\n-\n\n\nReplaced by the \nvalue\n property\n\n\n\n\n\n\n\n\nMethods in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in pixels\n\n\n\n\n\n\nimage\n\n\nstring\n\n\nThe file path, tkinter.PhotoImage or PIL.Image you wish to display\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nvalue\n\n\nstring\n\n\nThe file path, tkinter.PhotoImage or PIL.Image you wish to display\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in pixels\n\n\n\n\n\n\n\n\nRefer to a property as \n<name of widget>.property\n. For example, if your \nPicture\n object is called \npicture\n you would write \npicture.value\n.\n\n\nYou can \nset\n the property (for example \npicture.value = \"star.gif\"\n) or \nget\n the value of the property to use (for example \nprint(picture.value)\n).",
-            "title": "Picture"
-        },
-        {
-            "location": "/picture/#picture",
-            "text": "(Contains a  tkinter.Label  object)  __init__(self, master, image=None, grid=None, align=None, visible=True, enabled=None)",
-            "title": "Picture"
-        },
-        {
-            "location": "/picture/#what-is-it",
-            "text": "The  Picture  object displays an image.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/picture/#how-do-i-make-one",
-            "text": "Create a  Picture  object like this:  from guizero import App, Picture\napp = App()\npicture = Picture(app, image=\"test.gif\")\napp.display()  You must specify the correct path to the image. The image in the example is in the same directory as the program. If the image is in a different directory, specify a relative path, for example if the picture is in a subfolder called  images  you would write:  picture = Picture(app, image=\"images/test.gif\")",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/picture/#image-support",
-            "text": "Depending on your operating system and whether you installed the guizero  additional image features  will determine what  image types you can use  with  Picture .  By default GIF and PNG are supported, except macOS which only supports GIF.",
-            "title": "Image support"
-        },
-        {
-            "location": "/picture/#starting-parameters",
-            "text": "When you create a  Picture  object you  must  specify  master  and you can specify any of the optional parameters. Specify parameters in the brackets, like this:  picture = Picture(app, image=\"test.gif\")     Parameter  Takes  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    image  string  None  -  The file path, tkinter.PhotoImage or PIL.Image you wish to display    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    grid  List [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    width  size  None  No  Set the width of the widget in pixels    height  size  None  No  Set the height of the widget in pixels",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/picture/#methods",
-            "text": "You can call the following methods on a  Picture  object.     Method  Takes  Returns  Description      after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it is \"greyed out\" and cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget (e.g. focusing a  TextBox  so that the user can type inside it)    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    show()  -  -  Displays the widget if it was previously hidden    set(image)  image (string)  -  Replaced by the  value  property     Methods in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Methods"
-        },
-        {
-            "location": "/picture/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    enabled  boolean  True  if the widget is enabled    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height of the widget in pixels    image  string  The file path, tkinter.PhotoImage or PIL.Image you wish to display    master  App or Box  The container to which this widget belongs    value  string  The file path, tkinter.PhotoImage or PIL.Image you wish to display    visible  boolean  If this widget is visible    width  size  Set the width of the widget in pixels     Refer to a property as  <name of widget>.property . For example, if your  Picture  object is called  picture  you would write  picture.value .  You can  set  the property (for example  picture.value = \"star.gif\" ) or  get  the value of the property to use (for example  print(picture.value) ).",
-            "title": "Properties"
-        },
-        {
-            "location": "/pushbutton/",
-            "text": "PushButton\n\n\n(Contains a \ntkinter.Button\n object)\n\n\n__init__(self, master, command=None, args=None, text=\"Button\", image=None, pady=10, padx=10, grid=None, align=None, visible=True, enabled=None)\n\n\nWhat is it?\n\n\nThe \nPushButton\n object displays a button with text or an image, which calls a function when pressed.\n\n\n\n\nHow do I make one?\n\n\nCreate a \nPushButton\n object like this:\n\n\nfrom guizero import App, PushButton\ndef do_nothing():\n  print(\"Button was pressed\")\n\napp = App()\nbutton = PushButton(app, command=do_nothing)\napp.display()\n\n\n\n\nCreate a picture \nPushButton\n with an image like this:\n\n\nfrom guizero import App, PushButton\ndef do_nothing():\n  print(\"A picture button was pressed\")\n\napp = App()\nbutton = PushButton(app, image=\"button.gif\", command=do_nothing)\napp.display()\n\n\n\n\nDepending on your operating system and whether you installed the guizero \nadditional image features\n will determine what \nimage types you can use\n for \nPushButton\n.  By default GIF and PNG are supported, except macOS which only supports GIF.\n\n\nStarting parameters\n\n\nWhen you create a \nPushButton\n object you \nmust\n specify \nmaster\n and you can specify any of the optional parameters. Specify parameters in the brackets, like this: \nbutton = PushButton(app)\n\n\n\n\n\n\n\n\nParameter\n\n\nTakes\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\ncommand\n\n\nfunction name\n\n\nNone\n\n\n-\n\n\nThe name of a function to call when the button is pressed.\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\nargs\n\n\nlist\n\n\nNone\n\n\n-\n\n\nIf you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list\n\n\n\n\n\n\ngrid\n\n\nList [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\nimage\n\n\nstring\n\n\nNone\n\n\n-\n\n\nThe file path, tkinter.PhotoImage or PIL.Image you wish to display. If both an image and text are specified, the image will override the text.\n\n\n\n\n\n\npadx\n\n\nint\n\n\n10\n\n\n-\n\n\nHow much horizontal padding to add between the text/icon and the edge of the button.\n\n\n\n\n\n\npady\n\n\nint\n\n\n10\n\n\n-\n\n\nHow much vertical padding to add between the text/icon and the edge of the button.\n\n\n\n\n\n\ntext\n\n\nstring\n\n\n\"Button\"\n\n\n-\n\n\nThe text to display on the button\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the width of the widget in characters or pixels if its an image button or to \n\"fill\"\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the height of the widget in characters or pixels if its an image button or to \n\"fill\"\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on a \nPushButton\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it is \"greyed out\" and cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\nimage(image_source)\n\n\nimage_source (string)\n\n\n-\n\n\nThe file path, tkinter.PhotoImage or PIL.Image you wish to display.\n\n\n\n\n\n\npadding(padx, pady)\n\n\npadx (int), pady(int)\n\n\n-\n\n\nSets the amount of x (horizontal) and y (vertical) padding between the text/icon and the edge of the button\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\ntoggle()\n\n\n-\n\n\n-\n\n\nChanges the state of the button to the opposite of its current state - if it is currently enabled, disable it and vice versa.\n\n\n\n\n\n\nupdate_command(command, args =None)\n\n\ncommand (function name), args (\nOptional\n List of arguments to be passed to command)\n\n\n-\n\n\nUpdates the function to call when the button is pressed .\n\n\n\n\n\n\nchange_command(newcommand, args)\n\n\nnewcommand (function name), args (list)\n\n\n-\n\n\nReplaced by update_command function\n\n\n\n\n\n\nicon(icon)\n\n\nicon (string)\n\n\n-\n\n\nThe file path, tkinter.PhotoImage or PIL.Image you wish to display\n\n\n\n\n\n\nset_text(text)\n\n\ntext (string)\n\n\n-\n\n\nReplaced by the \ntext\n property\n\n\n\n\n\n\ntoggle_state()\n\n\n-\n\n\n-\n\n\nRenamed to \ntoggle()\n\n\n\n\n\n\n\n\nMethods in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font of the text on the button\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in characters or pixels if its an image button or to \n\"fill\"\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\ntext\n\n\nstring\n\n\nThe text on the button\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text on the button\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text on the button\n\n\n\n\n\n\nvalue\n\n\nint\n\n\nReturns 1 when the button is pressed, 0 if the button is released\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in characters or pixels if its an image button or to \n\"fill\"\n\n\n\n\n\n\n\n\nRefer to a property as \n<name of widget>.property\n. For example, if your \nPushButton\n object is called \nbutton\n you would write \nbutton.value\n.\n\n\nYou can \nset\n the property (for example \nbutton.bg = \"red\"\n) or \nget\n the value of the property to use (for example \nprint(button.bg)\n).",
-            "title": "PushButton"
-        },
-        {
-            "location": "/pushbutton/#pushbutton",
-            "text": "(Contains a  tkinter.Button  object)  __init__(self, master, command=None, args=None, text=\"Button\", image=None, pady=10, padx=10, grid=None, align=None, visible=True, enabled=None)",
-            "title": "PushButton"
-        },
-        {
-            "location": "/pushbutton/#what-is-it",
-            "text": "The  PushButton  object displays a button with text or an image, which calls a function when pressed.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/pushbutton/#how-do-i-make-one",
-            "text": "Create a  PushButton  object like this:  from guizero import App, PushButton\ndef do_nothing():\n  print(\"Button was pressed\")\n\napp = App()\nbutton = PushButton(app, command=do_nothing)\napp.display()  Create a picture  PushButton  with an image like this:  from guizero import App, PushButton\ndef do_nothing():\n  print(\"A picture button was pressed\")\n\napp = App()\nbutton = PushButton(app, image=\"button.gif\", command=do_nothing)\napp.display()  Depending on your operating system and whether you installed the guizero  additional image features  will determine what  image types you can use  for  PushButton .  By default GIF and PNG are supported, except macOS which only supports GIF.",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/pushbutton/#starting-parameters",
-            "text": "When you create a  PushButton  object you  must  specify  master  and you can specify any of the optional parameters. Specify parameters in the brackets, like this:  button = PushButton(app)     Parameter  Takes  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    command  function name  None  -  The name of a function to call when the button is pressed.    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    args  list  None  -  If you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list    grid  List [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    image  string  None  -  The file path, tkinter.PhotoImage or PIL.Image you wish to display. If both an image and text are specified, the image will override the text.    padx  int  10  -  How much horizontal padding to add between the text/icon and the edge of the button.    pady  int  10  -  How much vertical padding to add between the text/icon and the edge of the button.    text  string  \"Button\"  -  The text to display on the button    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    width  size  None  No  Set the width of the widget in characters or pixels if its an image button or to  \"fill\"    height  size  None  No  Set the height of the widget in characters or pixels if its an image button or to  \"fill\"",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/pushbutton/#methods",
-            "text": "You can call the following methods on a  PushButton  object.     Method  Takes  Returns  Description      after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it is \"greyed out\" and cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    image(image_source)  image_source (string)  -  The file path, tkinter.PhotoImage or PIL.Image you wish to display.    padding(padx, pady)  padx (int), pady(int)  -  Sets the amount of x (horizontal) and y (vertical) padding between the text/icon and the edge of the button    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    show()  -  -  Displays the widget if it was previously hidden    toggle()  -  -  Changes the state of the button to the opposite of its current state - if it is currently enabled, disable it and vice versa.    update_command(command, args =None)  command (function name), args ( Optional  List of arguments to be passed to command)  -  Updates the function to call when the button is pressed .    change_command(newcommand, args)  newcommand (function name), args (list)  -  Replaced by update_command function    icon(icon)  icon (string)  -  The file path, tkinter.PhotoImage or PIL.Image you wish to display    set_text(text)  text (string)  -  Replaced by the  text  property    toggle_state()  -  -  Renamed to  toggle()     Methods in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Methods"
-        },
-        {
-            "location": "/pushbutton/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    enabled  boolean  True  if the widget is enabled    font  string  The font of the text on the button    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height of the widget in characters or pixels if its an image button or to  \"fill\"    master  App or Box  The container to which this widget belongs    text  string  The text on the button    text_color  color  The colour of the text on the button    text_size  int  The size of the text on the button    value  int  Returns 1 when the button is pressed, 0 if the button is released    visible  boolean  If this widget is visible    width  size  Set the width of the widget in characters or pixels if its an image button or to  \"fill\"     Refer to a property as  <name of widget>.property . For example, if your  PushButton  object is called  button  you would write  button.value .  You can  set  the property (for example  button.bg = \"red\" ) or  get  the value of the property to use (for example  print(button.bg) ).",
-            "title": "Properties"
-        },
-        {
-            "location": "/slider/",
-            "text": "Slider\n\n\n(Contains a \ntkinter.Scale\n object)\n\n\n__init__(self, master, start=0, end=100, horizontal=True, command=None, grid=None, align=None)\n\n\nWhat is it?\n\n\nThe \nSlider\n object displays a bar and selector which can be used to specify a value in a range.\n\n\nThe above code looks like this on Windows:\n\n\n\nHow do I make one?\n\n\nCreate a \nSlider\n object like this:\n\n\nfrom guizero import App, Slider\napp = App()\nslider = Slider(app)\napp.display()\n\n\n\n\nStarting paramters\n\n\nWhen you create a \nSlider\n object, you \nmust\n specify a \nmaster\n and you can specify any of the the optional parameters. Specify parameters in the brackets, like this: \nslider = Slider(app, horizontal=False)\n\n\n\n\n\n\n\n\nParameter\n\n\nTakes\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\ncommand\n\n\nfunction name\n\n\nNone\n\n\n-\n\n\nThe name of a function to call when the slider value is changed\n\n\n\n\n\n\nend\n\n\nint\n\n\n100\n\n\n-\n\n\nThe largest value selectable on the slider\n\n\n\n\n\n\ngrid\n\n\nList [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\nhorizontal\n\n\nBoolean\n\n\nTrue\n\n\n-\n\n\nWhether you wish to display your slider horizontally or vertically (defaults to horizontal)\n\n\n\n\n\n\nstart\n\n\nint\n\n\n0\n\n\n-\n\n\nThe smallest value selectable on the slider\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the width of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the height of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on a \nSlider\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nthe function specified in \ncommand\n\n\n\n\n\n\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it is \"greyed out\" and cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget (e.g. focusing a \nTextBox\n so that the user can type inside it)\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\nupdate_command(command)\n\n\ncommand (function name)\n\n\n-\n\n\nUpdates the function to call when the slider value is changed\n\n\n\n\n\n\nadd_command(command)\n\n\ncommand (function name)\n\n\n-\n\n\nSets the function called when the slider value is changed to\n\n\n\n\n\n\n\n\nMethods in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font of the text\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text\n\n\n\n\n\n\nvalue\n\n\nstring\n\n\nThe current value of the slider\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in pixels or to \n\"fill\"\n\n\n\n\n\n\n\n\nExamples\n\n\nCalling a function when the slider value changes\n\n\nYou can specify a function to call when the slider value changes. Your function \nMUST\n have a minimum of one parameter as it will automatically receive a string containing the value of the slider (called \nslider_value\n in the example) when it is called.\n\n\nThis code has a slider and a text box, and the text box updates automatically to display the current value of the slider.\n\n\n\n\nfrom guizero import App, Slider, TextBox\ndef slider_changed(slider_value):\n    textbox.value = slider_value\n\napp = App()\nslider = Slider(app, command=slider_changed)\ntextbox = TextBox(app)\napp.display()",
-            "title": "Slider"
-        },
-        {
-            "location": "/slider/#slider",
-            "text": "(Contains a  tkinter.Scale  object)  __init__(self, master, start=0, end=100, horizontal=True, command=None, grid=None, align=None)",
-            "title": "Slider"
-        },
-        {
-            "location": "/slider/#what-is-it",
-            "text": "The  Slider  object displays a bar and selector which can be used to specify a value in a range.  The above code looks like this on Windows:",
-            "title": "What is it?"
-        },
-        {
-            "location": "/slider/#how-do-i-make-one",
-            "text": "Create a  Slider  object like this:  from guizero import App, Slider\napp = App()\nslider = Slider(app)\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/slider/#starting-paramters",
-            "text": "When you create a  Slider  object, you  must  specify a  master  and you can specify any of the the optional parameters. Specify parameters in the brackets, like this:  slider = Slider(app, horizontal=False)     Parameter  Takes  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    command  function name  None  -  The name of a function to call when the slider value is changed    end  int  100  -  The largest value selectable on the slider    grid  List [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    horizontal  Boolean  True  -  Whether you wish to display your slider horizontally or vertically (defaults to horizontal)    start  int  0  -  The smallest value selectable on the slider    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    width  size  None  No  Set the width of the widget in pixels or to  \"fill\"    height  size  None  No  Set the height of the widget in pixels or to  \"fill\"",
-            "title": "Starting paramters"
-        },
-        {
-            "location": "/slider/#methods",
-            "text": "You can call the following methods on a  Slider  object.     Method  Takes  Returns  Description      the function specified in  command       after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it is \"greyed out\" and cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget (e.g. focusing a  TextBox  so that the user can type inside it)    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    show()  -  -  Displays the widget if it was previously hidden    update_command(command)  command (function name)  -  Updates the function to call when the slider value is changed    add_command(command)  command (function name)  -  Sets the function called when the slider value is changed to     Methods in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Methods"
-        },
-        {
-            "location": "/slider/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    enabled  boolean  True  if the widget is enabled    font  string  The font of the text    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height of the widget in pixels or to  \"fill\"    master  App or Box  The container to which this widget belongs    text_size  int  The size of the text    text_color  color  The colour of the text    value  string  The current value of the slider    visible  boolean  If this widget is visible    width  size  Set the width of the widget in pixels or to  \"fill\"",
-            "title": "Properties"
-        },
-        {
-            "location": "/slider/#examples",
-            "text": "Calling a function when the slider value changes  You can specify a function to call when the slider value changes. Your function  MUST  have a minimum of one parameter as it will automatically receive a string containing the value of the slider (called  slider_value  in the example) when it is called.  This code has a slider and a text box, and the text box updates automatically to display the current value of the slider.   from guizero import App, Slider, TextBox\ndef slider_changed(slider_value):\n    textbox.value = slider_value\n\napp = App()\nslider = Slider(app, command=slider_changed)\ntextbox = TextBox(app)\napp.display()",
-            "title": "Examples"
-        },
-        {
-            "location": "/text/",
-            "text": "Text\n\n\n(Contains a \ntkinter.Label\n object)\n\n\n__init__(self, master, text=\"\", size=12, color=\"black\", bg=None, font=\"Helvetica\", grid=None, align=None, visible=True, enabled=None)\n\n\nWhat is it?\n\n\nThe \nText\n object displays non editable text in your app, useful for titles, labels and instructions.\n\n\n\n\nHow do I make one?\n\n\nCreate a \nText\n object like this:\n\n\nfrom guizero import App, Text\napp = App()\ntext = Text(app, text=\"Hello World\")\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nText\n object, you \nmust\n specify a \nmaster\n and you can specify any of the the optional parameters. Specify parameters in the brackets, like this: \ntext = Text(app, text=\"hi\")\n\n\n\n\n\n\n\n\nParameter\n\n\nData type\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\ncolor\n\n\ncolor\n\n\nblack\n\n\n-\n\n\nThe colour of the text. Accepts some colour strings (e.g. \nred\n) and colours specified in hex format (e.g. \n#0099ff\n)\n\n\n\n\n\n\nfont\n\n\nstring\n\n\n\"Helvetica\"\n\n\n-\n\n\nThe font face that the text will be displayed in. Availability of fonts depends on which fonts are installed locally.\n\n\n\n\n\n\ngrid\n\n\nList [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\n12\n\n\n-\n\n\nThe font size of the text\n\n\n\n\n\n\ntext\n\n\nstring\n\n\n\"\"\n\n\n-\n\n\nThe text you want to display\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nNone\n\n\nNo\n\n\nSet the height of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on a \nText\n object..\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\nappend(text)\n\n\ntext (string)\n\n\n-\n\n\nAdds the provided \ntext\n to the end of the current text within the object\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\nclear()\n\n\n-\n\n\n-\n\n\nClears the text\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it is \"greyed out\" and cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\ncolor(color)\n\n\ncolor (string)\n\n\n-\n\n\nReplaced by \ntext_color\n property\n\n\n\n\n\n\nfont_face(font)\n\n\nfont (string)\n\n\n-\n\n\nReplaced by \nfont\n property\n\n\n\n\n\n\nfont_size(size)\n\n\nsize (int)\n\n\n-\n\n\nReplaced by \nsize\n property\n\n\n\n\n\n\nget()\n\n\n-\n\n\nstring\n\n\nReplaced by \nvalue\n property\n\n\n\n\n\n\nset(text)\n\n\ntext (string)\n\n\n-\n\n\nReplaced by \nvalue\n property\n\n\n\n\n\n\n\n\nMethods in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font of the text\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text\n\n\n\n\n\n\nvalue\n\n\nstring\n\n\nThe text\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in characters or to \n\"fill\"",
-            "title": "Text"
-        },
-        {
-            "location": "/text/#text",
-            "text": "(Contains a  tkinter.Label  object)  __init__(self, master, text=\"\", size=12, color=\"black\", bg=None, font=\"Helvetica\", grid=None, align=None, visible=True, enabled=None)",
-            "title": "Text"
-        },
-        {
-            "location": "/text/#what-is-it",
-            "text": "The  Text  object displays non editable text in your app, useful for titles, labels and instructions.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/text/#how-do-i-make-one",
-            "text": "Create a  Text  object like this:  from guizero import App, Text\napp = App()\ntext = Text(app, text=\"Hello World\")\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/text/#starting-parameters",
-            "text": "When you create a  Text  object, you  must  specify a  master  and you can specify any of the the optional parameters. Specify parameters in the brackets, like this:  text = Text(app, text=\"hi\")     Parameter  Data type  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    color  color  black  -  The colour of the text. Accepts some colour strings (e.g.  red ) and colours specified in hex format (e.g.  #0099ff )    font  string  \"Helvetica\"  -  The font face that the text will be displayed in. Availability of fonts depends on which fonts are installed locally.    grid  List [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    text_size  int  12  -  The font size of the text    text  string  \"\"  -  The text you want to display    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    width  size  None  No  Set the width of the widget in characters or to  \"fill\"    height  size  None  No  Set the height of the widget in characters or to  \"fill\"",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/text/#methods",
-            "text": "You can call the following methods on a  Text  object..     Method  Takes  Returns  Description      after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    append(text)  text (string)  -  Adds the provided  text  to the end of the current text within the object    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    clear()  -  -  Clears the text    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it is \"greyed out\" and cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    show()  -  -  Displays the widget if it was previously hidden    color(color)  color (string)  -  Replaced by  text_color  property    font_face(font)  font (string)  -  Replaced by  font  property    font_size(size)  size (int)  -  Replaced by  size  property    get()  -  string  Replaced by  value  property    set(text)  text (string)  -  Replaced by  value  property     Methods in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Methods"
-        },
-        {
-            "location": "/text/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    enabled  boolean  True  if the widget is enabled    font  string  The font of the text    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height of the widget in characters or to  \"fill\"    master  App or Box  The container to which this widget belongs    text_size  int  The size of the text    text_color  color  The colour of the text    value  string  The text    visible  boolean  If this widget is visible    width  size  Set the width of the widget in characters or to  \"fill\"",
-            "title": "Properties"
-        },
-        {
-            "location": "/textbox/",
-            "text": "TextBox\n\n\n(Contains a \ntkinter.Entry\n object)\n\n\n__init__(self, master, text=\"\", width=10, height=1, grid=None, align=None, visible=True, enabled=None, multiline=False, scrollbar=False, command=None)\n\n\nWhat is it\n\n\nThe \nTextBox\n object displays a text box which the user can type in.\n\n\n\n\nHow do I make one?\n\n\nCreate a \nTextBox\n object like this:\n\n\nfrom guizero import App, TextBox\napp = App()\ninput_box = TextBox(app)\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nTextBox\n object you \nmust\n specify \nmaster\n and you can specify any of the optional parameters. Specify parameters in the brackets, like this: \ntextbox = TextBox(app, text=\"Please enter some text\")\n\n\n\n\n\n\n\n\nParameter\n\n\nData type\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\ngrid\n\n\nList [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\ntext\n\n\nstring\n\n\n\"\"\n\n\n-\n\n\nAny text you wish to be pre-filled in the text box\n\n\n\n\n\n\nwidth\n\n\nint\n\n\n10\n\n\n-\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\nheight\n\n\nint\n\n\n1\n\n\n-\n\n\nSet the height of the widget in characters or to \n\"fill\"\n, only effective if \nmultiline\n is \nTrue\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nmultiline\n\n\nboolean\n\n\nFalse\n\n\nNo\n\n\nCreate a multi-line text box.\n\n\n\n\n\n\nscrollbar\n\n\nboolean\n\n\nFalse\n\n\nNo\n\n\nAdd a vertical scrollbar to a multi-line text box\n\n\n\n\n\n\ncommand\n\n\nfunction name\n\n\nNone\n\n\n-\n\n\nThe name of a function to call when the text is changed. This function MUST take either zero or one argument, if the function takes one argument the key which was added to the textbox will be returned.\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on your TextBox object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\nappend(text)\n\n\ntext (string)\n\n\n-\n\n\nAdds the provided \ntext\n to the end of the current text within the text box\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\nclear()\n\n\n-\n\n\n-\n\n\nClears the textbox\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it is \"greyed out\" and cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget (e.g. focusing a \nTextBox\n so that the user can type inside it)\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nresize(width, height)\n\n\nwidth (int), height (int)\n\n\n-\n\n\nSets the width and height of the widget\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget if it was previously hidden\n\n\n\n\n\n\nupdate_command(command)\n\n\ncommand (function name)\n\n\n-\n\n\nUpdates the function to call when the text is changed.\n\n\n\n\n\n\nget()\n\n\n-\n\n\nstring\n\n\nReplaced by \nvalue\n property\n\n\n\n\n\n\nset(text)\n\n\ntext (string)\n\n\n-\n\n\nReplaced by \nvalue\n property\n\n\n\n\n\n\n\n\nMethods in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font of the text\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height of the widget in characters or to \n\"fill\"\n, only effective if \nmultiline\n is \nTrue\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nvalue\n\n\nstring\n\n\nThe text in the TextBox\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width of the widget in characters or to \n\"fill\"\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text\n\n\n\n\n\n\n\n\nExamples\n\n\nCreating a TextBox with default text\n\n\nYou can set the default text in a TextBox when it is created using the \ntext\n parameter:\n\n\nfrom guizero import App, TextBox\napp = App()\ninput_box = TextBox(app, text=\"Type here\")\napp.display()\n\n\n\n\nCreating a multi-line TextBox\n\n\nYou can create a text box which is capable of capturing multiple lines of text by setting the \nmultiline\n parameter to \nTrue\n and giving the textbox a \nheight\n:\n\n\nfrom guizero import App, TextBox\napp = App()\ninput_box = TextBox(app, text=\"Type lines here\", height=10, multiline=True)\napp.display()\n\n\n\n\nMulti-line text boxes can also be given a scrollbar by setting the \nscrollbar\n parameter to \nTrue\n:\n\n\ninput_box = TextBox(app, text=\"Type lines here\", height=10, multiline=True, scrollbar=True)",
-            "title": "TextBox"
-        },
-        {
-            "location": "/textbox/#textbox",
-            "text": "(Contains a  tkinter.Entry  object)  __init__(self, master, text=\"\", width=10, height=1, grid=None, align=None, visible=True, enabled=None, multiline=False, scrollbar=False, command=None)",
-            "title": "TextBox"
-        },
-        {
-            "location": "/textbox/#what-is-it",
-            "text": "The  TextBox  object displays a text box which the user can type in.",
-            "title": "What is it"
-        },
-        {
-            "location": "/textbox/#how-do-i-make-one",
-            "text": "Create a  TextBox  object like this:  from guizero import App, TextBox\napp = App()\ninput_box = TextBox(app)\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/textbox/#starting-parameters",
-            "text": "When you create a  TextBox  object you  must  specify  master  and you can specify any of the optional parameters. Specify parameters in the brackets, like this:  textbox = TextBox(app, text=\"Please enter some text\")     Parameter  Data type  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    grid  List [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    text  string  \"\"  -  Any text you wish to be pre-filled in the text box    width  int  10  -  Set the width of the widget in characters or to  \"fill\"    height  int  1  -  Set the height of the widget in characters or to  \"fill\" , only effective if  multiline  is  True    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    multiline  boolean  False  No  Create a multi-line text box.    scrollbar  boolean  False  No  Add a vertical scrollbar to a multi-line text box    command  function name  None  -  The name of a function to call when the text is changed. This function MUST take either zero or one argument, if the function takes one argument the key which was added to the textbox will be returned.",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/textbox/#methods",
-            "text": "You can call the following methods on your TextBox object.     Method  Takes  Returns  Description      after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    append(text)  text (string)  -  Adds the provided  text  to the end of the current text within the text box    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    clear()  -  -  Clears the textbox    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it is \"greyed out\" and cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget (e.g. focusing a  TextBox  so that the user can type inside it)    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    resize(width, height)  width (int), height (int)  -  Sets the width and height of the widget    show()  -  -  Displays the widget if it was previously hidden    update_command(command)  command (function name)  -  Updates the function to call when the text is changed.    get()  -  string  Replaced by  value  property    set(text)  text (string)  -  Replaced by  value  property     Methods in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Methods"
-        },
-        {
-            "location": "/textbox/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    enabled  boolean  True  if the widget is enabled    font  string  The font of the text    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height of the widget in characters or to  \"fill\" , only effective if  multiline  is  True    master  App or Box  The container to which this widget belongs    value  string  The text in the TextBox    visible  boolean  If this widget is visible    width  size  Set the width of the widget in characters or to  \"fill\"    text_size  int  The size of the text    text_color  color  The colour of the text",
-            "title": "Properties"
-        },
-        {
-            "location": "/textbox/#examples",
-            "text": "Creating a TextBox with default text  You can set the default text in a TextBox when it is created using the  text  parameter:  from guizero import App, TextBox\napp = App()\ninput_box = TextBox(app, text=\"Type here\")\napp.display()  Creating a multi-line TextBox  You can create a text box which is capable of capturing multiple lines of text by setting the  multiline  parameter to  True  and giving the textbox a  height :  from guizero import App, TextBox\napp = App()\ninput_box = TextBox(app, text=\"Type lines here\", height=10, multiline=True)\napp.display()  Multi-line text boxes can also be given a scrollbar by setting the  scrollbar  parameter to  True :  input_box = TextBox(app, text=\"Type lines here\", height=10, multiline=True, scrollbar=True)",
-            "title": "Examples"
-        },
-        {
-            "location": "/waffle/",
-            "text": "Waffle\n\n\n(Contains a \ntkinter.Frame\n object)\n\n\n__init__(self, master, height=3, width=3, dim=20, pad=5, color=\"white\", dotty=False, grid=None, align=None, command=None, visible=True, enabled=None, bg=None)\n\n\nWhat is it\n\n\nThe \nWaffle\n object display an n*n grid of squares with custom dimensions and padding\n\n\n\n\nHow do I make one?\n\n\nCreate a \nWaffle\n object like this:\n\n\nfrom guizero import App, Waffle\napp = App()\nwaffle = Waffle(app)\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nWaffle\n object you \nmust\n specify \nmaster\n and you can specify any of the optional parameters. Specify parameters in the brackets, like this: \nwaffle = Waffle(app, height=25)\n\n\n\n\n\n\n\n\nParameter\n\n\nTakes\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp, Window or Box\n\n\n-\n\n\nYes\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nNone\n\n\n-\n\n\nAlignment of this widget within its container. Possible values: \n\"top\"\n, \n\"bottom\"\n, \n\"left\"\n, \n\"right\"\n.\n\n\n\n\n\n\ncolor\n\n\ncolor\n\n\n\"white\"\n\n\n-\n\n\nThe default colour of pixels on the waffle\n\n\n\n\n\n\ncommand\n\n\nfunction name\n\n\nNone\n\n\n-\n\n\nThe name of a function to call when the waffle is clicked. This function MUST take either zero or two arguments, if the function takes two arguments the \nx\n and \ny\n co-ordinates of the pixel which was clicked will be given.\n\n\n\n\n\n\ndim\n\n\nint\n\n\n20\n\n\n-\n\n\nHow large one of the pixels on the waffle is\n\n\n\n\n\n\ndotty\n\n\nboolean\n\n\nFalse\n\n\n-\n\n\nWhether the pixels display as dots/circles (True) or squares (False)\n\n\n\n\n\n\ngrid\n\n\nList [int, int]\n\n\nNone\n\n\n-\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid layout.\n\n\n\n\n\n\nheight\n\n\nint\n\n\n3\n\n\n-\n\n\nSet the height in waffle pixels\n\n\n\n\n\n\npad\n\n\nint\n\n\n5\n\n\n-\n\n\nHow much space is between the pixels on the waffle\n\n\n\n\n\n\nwidth\n\n\nint\n\n\n3\n\n\n-\n\n\nSet the width in waffle pixels\n\n\n\n\n\n\nremember\n\n\nboolean\n\n\nTrue\n\n\n-\n\n\nNo longer needed - all Waffles will now have a memory.\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the widget should be visible.\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nNone\n\n\nNo\n\n\nIf the widget should be enabled. If \nNone\n (the default) the enabled property will be inherited from the master\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nNone\n\n\nNo\n\n\nThe background colour of the waffle. Takes a \ncolor\n value.\n\n\n\n\n\n\n\n\nParameters in \nitalics\n will still work but are \ndeprecated\n - this means you should stop using them because they may not work in future versions of guizero\n\n\nMethods\n\n\nYou can call the following methods on your Waffle object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the widget\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables the widget so that it cannot be interacted with\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables the widget\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the widget (e.g. focusing a \nTextBox\n so that the user can type inside it)\n\n\n\n\n\n\nget_all()\n\n\n-\n\n\nList\n\n\nReturns the pixel colours in the grid as a 2D list.\n\n\n\n\n\n\nget_pixel(x, y)\n\n\nx (int), y (int)\n\n\nstring\n\n\nReturns the colour of the pixel at the specified coordinates. 0,0 is the top left of the grid.\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the widget from view. This method will unpack the widget from the layout manager.\n\n\n\n\n\n\npixel(x, y)\n\n\n(int), y (int)\n\n\nWafflePixel\n\n\nReturns the pixel at the specified coordinates. 0,0 is the top left of the grid. \nWaffle.pixel(x,y)\n is the equivalent of \nWaffle[x,y]\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nset_all(color)\n\n\ncolor (\ncolor\n)\n\n\n-\n\n\nSets all pixels to the specified colour.\n\n\n\n\n\n\nset_pixel(x, y, color)\n\n\nx (int), y (int), color (\ncolor\n)\n\n\n-\n\n\nSets the pixel at the specified coordinates to the specified colour. 0,0 is the top left of the grid.\n\n\n\n\n\n\nshow()\n\n\n-\n\n\n-\n\n\nDisplays the widget\n\n\n\n\n\n\nupdate_command(command)\n\n\ncommand (function name)\n\n\n-\n\n\nUpdates the function to call when the Waffle is clicked\n\n\n\n\n\n\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nalign\n\n\nstring\n\n\nThe alignment of this widget within its container\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the widget\n\n\n\n\n\n\ncolor\n\n\ncolor\n\n\nThe default colour of pixels on the waffle\n\n\n\n\n\n\ndotty\n\n\nbool\n\n\nIf \nTrue\n the waffle will display circles\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the widget is enabled\n\n\n\n\n\n\ngrid\n\n\nList\n\n\n[x,y]\n coordinates of this widget. This parameter is only required if the \nmaster\n object has a grid\n\n\n\n\n\n\nheight\n\n\nsize\n\n\nSet the height in waffle pixels\n\n\n\n\n\n\nmaster\n\n\nApp or Box\n\n\nThe container to which this widget belongs\n\n\n\n\n\n\npad\n\n\nint\n\n\nThe size of the padding between pixels\n\n\n\n\n\n\npixel_size\n\n\nint\n\n\nThe size of the one pixel\n\n\n\n\n\n\nwidth\n\n\nsize\n\n\nSet the width in waffle pixels\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf this widget is visible\n\n\n\n\n\n\n\n\nExample\n\n\nSet a pixel colour\n\n\nA Waffle can remember the colour of each pixel within it.\n\n\nfrom guizero import App, Waffle\n\napp = App()\n\nmy_waffle = Waffle(app)\nmy_waffle[2,1].color = \"red\"\n\n# Your waffle will remember what colour each pixel is\nprint(my_waffle[2,1].color)\n\n# Even the ones auto-set at the start (which are white by default)\nprint(my_waffle[1,1].color)\n\napp.display()\n\n\n\n\nWafflePixel\n\n\nA WafflePixel object is returned by \nWaffle.pixel(x,y)\n and \nWaffle[x,y]\n.\n\n\nfrom guizero import App, Waffle\n\napp = App()\n\nmy_waffle = Waffle(app)\nmy_waffle.pixel(x,y).color = \"red\"\nmy_waffle[x,y].dotty = True\n\napp.display()\n\n\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nx\n\n\nint\n\n\nReturns the x position of the pixel on the widget\n\n\n\n\n\n\nx\n\n\nint\n\n\nReturns the y position of the pixel on the widget\n\n\n\n\n\n\ncanvas_x\n\n\nint\n\n\nReturns the x position of the pixel on the canvas\n\n\n\n\n\n\ncanvas_y\n\n\nint\n\n\nReturns the y position of the pixel on the canvas\n\n\n\n\n\n\ncolor\n\n\ncolor\n\n\nSets or returns the color of the pixel\n\n\n\n\n\n\ndotty\n\n\nbool\n\n\nSet to \nTrue\n to make the pixel a circle\n\n\n\n\n\n\nsize\n\n\nint\n\n\nReturns the size of the pixel in \ndisplay\n pixels",
-            "title": "Waffle"
-        },
-        {
-            "location": "/waffle/#waffle",
-            "text": "(Contains a  tkinter.Frame  object)  __init__(self, master, height=3, width=3, dim=20, pad=5, color=\"white\", dotty=False, grid=None, align=None, command=None, visible=True, enabled=None, bg=None)",
-            "title": "Waffle"
-        },
-        {
-            "location": "/waffle/#what-is-it",
-            "text": "The  Waffle  object display an n*n grid of squares with custom dimensions and padding",
-            "title": "What is it"
-        },
-        {
-            "location": "/waffle/#how-do-i-make-one",
-            "text": "Create a  Waffle  object like this:  from guizero import App, Waffle\napp = App()\nwaffle = Waffle(app)\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/waffle/#starting-parameters",
-            "text": "When you create a  Waffle  object you  must  specify  master  and you can specify any of the optional parameters. Specify parameters in the brackets, like this:  waffle = Waffle(app, height=25)     Parameter  Takes  Default  Compulsory  Description      master  App, Window or Box  -  Yes  The container to which this widget belongs    align  string  None  -  Alignment of this widget within its container. Possible values:  \"top\" ,  \"bottom\" ,  \"left\" ,  \"right\" .    color  color  \"white\"  -  The default colour of pixels on the waffle    command  function name  None  -  The name of a function to call when the waffle is clicked. This function MUST take either zero or two arguments, if the function takes two arguments the  x  and  y  co-ordinates of the pixel which was clicked will be given.    dim  int  20  -  How large one of the pixels on the waffle is    dotty  boolean  False  -  Whether the pixels display as dots/circles (True) or squares (False)    grid  List [int, int]  None  -  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid layout.    height  int  3  -  Set the height in waffle pixels    pad  int  5  -  How much space is between the pixels on the waffle    width  int  3  -  Set the width in waffle pixels    remember  boolean  True  -  No longer needed - all Waffles will now have a memory.    visible  boolean  True  No  If the widget should be visible.    enabled  boolean  None  No  If the widget should be enabled. If  None  (the default) the enabled property will be inherited from the master    bg  color  None  No  The background colour of the waffle. Takes a  color  value.     Parameters in  italics  will still work but are  deprecated  - this means you should stop using them because they may not work in future versions of guizero",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/waffle/#methods",
-            "text": "You can call the following methods on your Waffle object.     Method  Takes  Returns  Description      after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    destroy()  -  -  Destroys the widget    disable()  -  -  Disables the widget so that it cannot be interacted with    enable()  -  -  Enables the widget    focus()  -  -  Gives focus to the widget (e.g. focusing a  TextBox  so that the user can type inside it)    get_all()  -  List  Returns the pixel colours in the grid as a 2D list.    get_pixel(x, y)  x (int), y (int)  string  Returns the colour of the pixel at the specified coordinates. 0,0 is the top left of the grid.    hide()  -  -  Hides the widget from view. This method will unpack the widget from the layout manager.    pixel(x, y)  (int), y (int)  WafflePixel  Returns the pixel at the specified coordinates. 0,0 is the top left of the grid.  Waffle.pixel(x,y)  is the equivalent of  Waffle[x,y]    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    set_all(color)  color ( color )  -  Sets all pixels to the specified colour.    set_pixel(x, y, color)  x (int), y (int), color ( color )  -  Sets the pixel at the specified coordinates to the specified colour. 0,0 is the top left of the grid.    show()  -  -  Displays the widget    update_command(command)  command (function name)  -  Updates the function to call when the Waffle is clicked",
-            "title": "Methods"
-        },
-        {
-            "location": "/waffle/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description      align  string  The alignment of this widget within its container    bg  color  The background colour of the widget    color  color  The default colour of pixels on the waffle    dotty  bool  If  True  the waffle will display circles    enabled  boolean  True  if the widget is enabled    grid  List  [x,y]  coordinates of this widget. This parameter is only required if the  master  object has a grid    height  size  Set the height in waffle pixels    master  App or Box  The container to which this widget belongs    pad  int  The size of the padding between pixels    pixel_size  int  The size of the one pixel    width  size  Set the width in waffle pixels    visible  boolean  If this widget is visible",
-            "title": "Properties"
-        },
-        {
-            "location": "/waffle/#example",
-            "text": "Set a pixel colour  A Waffle can remember the colour of each pixel within it.  from guizero import App, Waffle\n\napp = App()\n\nmy_waffle = Waffle(app)\nmy_waffle[2,1].color = \"red\"\n\n# Your waffle will remember what colour each pixel is\nprint(my_waffle[2,1].color)\n\n# Even the ones auto-set at the start (which are white by default)\nprint(my_waffle[1,1].color)\n\napp.display()",
-            "title": "Example"
-        },
-        {
-            "location": "/waffle/#wafflepixel",
-            "text": "A WafflePixel object is returned by  Waffle.pixel(x,y)  and  Waffle[x,y] .  from guizero import App, Waffle\n\napp = App()\n\nmy_waffle = Waffle(app)\nmy_waffle.pixel(x,y).color = \"red\"\nmy_waffle[x,y].dotty = True\n\napp.display()",
-            "title": "WafflePixel"
-        },
-        {
-            "location": "/waffle/#properties_1",
-            "text": "You can set and get the following properties:     Method  Data type  Description      x  int  Returns the x position of the pixel on the widget    x  int  Returns the y position of the pixel on the widget    canvas_x  int  Returns the x position of the pixel on the canvas    canvas_y  int  Returns the y position of the pixel on the canvas    color  color  Sets or returns the color of the pixel    dotty  bool  Set to  True  to make the pixel a circle    size  int  Returns the size of the pixel in  display  pixels",
-            "title": "Properties"
-        },
-        {
-            "location": "/window/",
-            "text": "Window\n\n\n(Contains a \ntkinter.TopLevel\n object)\n\n\n__init__(self, master, title=\"guizero\", width=500, height=500, layout=\"auto\", bg=None, visible=True):\n\n\nWhat is it?\n\n\nA \nWindow\n object is how you create new windows in guizero.\n\n\n\n\nHow do I make one?\n\n\nCreate an \nWindow\n object like this:\n\n\nfrom guizero import App, Window\napp = App()\nwindow = Window(app)\napp.display()\n\n\n\n\nStarting parameters\n\n\nWhen you create a \nWindow\n object you \nmust\n specify a \nmaster\n and you can specify any of the the optional parameters. Specify parameters in the brackets like this: \nwindow = Window(app, bg=\"red\", height=200)\n\n\n\n\n\n\n\n\nParameter\n\n\nData type\n\n\nDefault\n\n\nCompulsory\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nmaster\n\n\nApp\n\n\n-\n\n\nYes\n\n\nThe app to which the window belongs\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nNone\n\n\nNo\n\n\nThe background colour of the window. Takes a \ncolor\n value.\n\n\n\n\n\n\nheight\n\n\nint\n\n\n500\n\n\nNo\n\n\nThe height of the window in pixels.\n\n\n\n\n\n\nlayout\n\n\nstring\n\n\n\"auto\"\n\n\nNo\n\n\nWhether widgets pack themselves (\n\"auto\"\n) or you specify their position on a grid (\n\"grid\"\n)\n\n\n\n\n\n\ntitle\n\n\nstring\n\n\n\"guizero\"\n\n\nNo\n\n\nThe title displayed in the bar at the top of the window.\n\n\n\n\n\n\nwidth\n\n\nint\n\n\n500\n\n\nNo\n\n\nThe width of the window in pixels.\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nTrue\n\n\nNo\n\n\nIf the window should be visible.\n\n\n\n\n\n\n\n\nMethods\n\n\nYou can call the following methods on a \nWindow\n object.\n\n\n\n\n\n\n\n\nMethod\n\n\nTakes\n\n\nReturns\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\nadd_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None)\n\n\ntk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int)\n\n\nWidget\n\n\nAdds a tk widget into a guizero container. Note - this is an advanced feature see \nUsing tk\n for more information.\n\n\n\n\n\n\nafter(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nSchedules a \nsingle\n call to \ncommand\n after \ntime\n milliseconds. (To repeatedly call the same command, use \nrepeat()\n)\n\n\n\n\n\n\ncancel(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCancels a scheduled call to \ncommand\n\n\n\n\n\n\ndisable()\n\n\n-\n\n\n-\n\n\nDisables all the widgets in the window so that they cannot be interacted with\n\n\n\n\n\n\ndestroy()\n\n\n-\n\n\n-\n\n\nDestroys the windows\n\n\n\n\n\n\nenable()\n\n\n-\n\n\n-\n\n\nEnables all the widgets in the window\n\n\n\n\n\n\nexit_full_screen()\n\n\n-\n\n\n-\n\n\nExit full screen display\n\n\n\n\n\n\nfocus()\n\n\n-\n\n\n-\n\n\nGives focus to the window\n\n\n\n\n\n\nhide()\n\n\n-\n\n\n-\n\n\nHides the window from view.\n\n\n\n\n\n\non_close(command)\n\n\ncommand (function name)\n\n\n-\n\n\nCalls the given function when the user tries to close the window.\n\n\n\n\n\n\nrepeat(time, command, args=None)\n\n\ntime (int), command (function name), args (list of arguments)\n\n\n-\n\n\nRepeats \ncommand\n every \ntime\n milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.\n\n\n\n\n\n\nset_full_screen(keybind)\n\n\nString\n\n\n-\n\n\nSet the application to display full screen. Option to specify a key to exit full screen (default is 'Esc'.)\n\n\n\n\n\n\nshow(wait = False)\n\n\n-\n\n\n-\n\n\nDisplays the window if it was previously hidden\n\n\n\n\n\n\nupdate()\n\n\n-\n\n\n-\n\n\nForce the window to update itself, useful if changes aren't reflected in the UI.\n\n\n\n\n\n\n\n\nProperties\n\n\nYou can set and get the following properties:\n\n\n\n\n\n\n\n\nMethod\n\n\nData type\n\n\nDescription\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nbg\n\n\ncolor\n\n\nThe background colour of the window\n\n\n\n\n\n\n\n\n\n\nenabled\n\n\nboolean\n\n\nTrue\n if the window is enabled\n\n\n\n\n\n\n\n\n\n\nfont\n\n\nstring\n\n\nThe font that widgets should use\n\n\n\n\n\n\n\n\n\n\nfull_screen\n\n\nboolean\n\n\nFalse\n\n\nNo\n\n\nWhether the App is full screen\n\n\n\n\n\n\nheight\n\n\nint\n\n\nThe height of the window\n\n\n\n\n\n\n\n\n\n\nlayout\n\n\nstring\n\n\nThe layout being used by the Window (\n\"auto\"\n) or (\n\"grid\"\n)\n\n\n\n\n\n\n\n\n\n\ntitle\n\n\nstring\n\n\nThe title of the window\n\n\n\n\n\n\n\n\n\n\ntext_size\n\n\nint\n\n\nThe size of the text widgets should use\n\n\n\n\n\n\n\n\n\n\ntext_color\n\n\ncolor\n\n\nThe colour of the text widgets should use\n\n\n\n\n\n\n\n\n\n\nvisible\n\n\nboolean\n\n\nIf the window is visible\n\n\n\n\n\n\n\n\n\n\nwidth\n\n\nint\n\n\nThe width of the window\n\n\n\n\n\n\n\n\n\n\n\n\nRefer to a property as \n<name of widget>.property\n. For example, if your \nWindow\n object is called \nwindow\n you would write \nwindow.title\n.\n\n\nYou can \nset\n the property (for example \nwindow.title = \"Hello world\"\n) or \nget\n the value of the property to use (for example \nprint(window.title)\n).\n\n\nExamples\n\n\nCreating a Window object\n\n\nCreate an \nWindow\n object by calling the \nWindow()\n constructor. You should give the object a name so you can refer to it later - in this case we have called it \nwindow\n. It is best to keep the name you give to your \nWindow\n object quite short, as you will have to use it to tell other widgets where they should be stored.\n\n\nfrom guizero import App, Window\napp = App(title=\"My app\", height=300, width=200)\nwindow = Window(title = \"2nd Window\", height=300, width=200)\napp.display()\n\n\n\n\nShowing and hiding a Window\n\n\nWindow\n objects can be shown and hidden using the \nshow()\n and \nhide()\n methods:\n\n\nfrom guizero import App, Window, PushButton\n\ndef open_window():\n    window_2.show()\n\napp = App(title=\"My app\", height=300, width=200)\nwindow = Window(app, title = \"2nd Window\", height=300, width=200)\nwindow.hide()\n\nopen_button(app, text=\"open 2nd window\", command=open_window)\n\napp.display()\n\n\n\n\nIf you want a \nWindow\n to become the main window and stop all other windows responding until it is closed you can set the optional \nwait\n parameter to \nTrue\n when using \nshow\n:\n\n\ndef open_window():\n    window_2.show(wait = True)",
-            "title": "Window"
-        },
-        {
-            "location": "/window/#window",
-            "text": "(Contains a  tkinter.TopLevel  object)  __init__(self, master, title=\"guizero\", width=500, height=500, layout=\"auto\", bg=None, visible=True):",
-            "title": "Window"
-        },
-        {
-            "location": "/window/#what-is-it",
-            "text": "A  Window  object is how you create new windows in guizero.",
-            "title": "What is it?"
-        },
-        {
-            "location": "/window/#how-do-i-make-one",
-            "text": "Create an  Window  object like this:  from guizero import App, Window\napp = App()\nwindow = Window(app)\napp.display()",
-            "title": "How do I make one?"
-        },
-        {
-            "location": "/window/#starting-parameters",
-            "text": "When you create a  Window  object you  must  specify a  master  and you can specify any of the the optional parameters. Specify parameters in the brackets like this:  window = Window(app, bg=\"red\", height=200)     Parameter  Data type  Default  Compulsory  Description      master  App  -  Yes  The app to which the window belongs    bg  color  None  No  The background colour of the window. Takes a  color  value.    height  int  500  No  The height of the window in pixels.    layout  string  \"auto\"  No  Whether widgets pack themselves ( \"auto\" ) or you specify their position on a grid ( \"grid\" )    title  string  \"guizero\"  No  The title displayed in the bar at the top of the window.    width  int  500  No  The width of the window in pixels.    visible  boolean  True  No  If the window should be visible.",
-            "title": "Starting parameters"
-        },
-        {
-            "location": "/window/#methods",
-            "text": "You can call the following methods on a  Window  object.     Method  Takes  Returns  Description      add_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None)  tk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int)  Widget  Adds a tk widget into a guizero container. Note - this is an advanced feature see  Using tk  for more information.    after(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Schedules a  single  call to  command  after  time  milliseconds. (To repeatedly call the same command, use  repeat() )    cancel(command)  command (function name)  -  Cancels a scheduled call to  command    disable()  -  -  Disables all the widgets in the window so that they cannot be interacted with    destroy()  -  -  Destroys the windows    enable()  -  -  Enables all the widgets in the window    exit_full_screen()  -  -  Exit full screen display    focus()  -  -  Gives focus to the window    hide()  -  -  Hides the window from view.    on_close(command)  command (function name)  -  Calls the given function when the user tries to close the window.    repeat(time, command, args=None)  time (int), command (function name), args (list of arguments)  -  Repeats  command  every  time  milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.    set_full_screen(keybind)  String  -  Set the application to display full screen. Option to specify a key to exit full screen (default is 'Esc'.)    show(wait = False)  -  -  Displays the window if it was previously hidden    update()  -  -  Force the window to update itself, useful if changes aren't reflected in the UI.",
-            "title": "Methods"
-        },
-        {
-            "location": "/window/#properties",
-            "text": "You can set and get the following properties:     Method  Data type  Description        bg  color  The background colour of the window      enabled  boolean  True  if the window is enabled      font  string  The font that widgets should use      full_screen  boolean  False  No  Whether the App is full screen    height  int  The height of the window      layout  string  The layout being used by the Window ( \"auto\" ) or ( \"grid\" )      title  string  The title of the window      text_size  int  The size of the text widgets should use      text_color  color  The colour of the text widgets should use      visible  boolean  If the window is visible      width  int  The width of the window       Refer to a property as  <name of widget>.property . For example, if your  Window  object is called  window  you would write  window.title .  You can  set  the property (for example  window.title = \"Hello world\" ) or  get  the value of the property to use (for example  print(window.title) ).",
-            "title": "Properties"
-        },
-        {
-            "location": "/window/#examples",
-            "text": "Creating a Window object  Create an  Window  object by calling the  Window()  constructor. You should give the object a name so you can refer to it later - in this case we have called it  window . It is best to keep the name you give to your  Window  object quite short, as you will have to use it to tell other widgets where they should be stored.  from guizero import App, Window\napp = App(title=\"My app\", height=300, width=200)\nwindow = Window(title = \"2nd Window\", height=300, width=200)\napp.display()  Showing and hiding a Window  Window  objects can be shown and hidden using the  show()  and  hide()  methods:  from guizero import App, Window, PushButton\n\ndef open_window():\n    window_2.show()\n\napp = App(title=\"My app\", height=300, width=200)\nwindow = Window(app, title = \"2nd Window\", height=300, width=200)\nwindow.hide()\n\nopen_button(app, text=\"open 2nd window\", command=open_window)\n\napp.display()  If you want a  Window  to become the main window and stop all other windows responding until it is closed you can set the optional  wait  parameter to  True  when using  show :  def open_window():\n    window_2.show(wait = True)",
-            "title": "Examples"
-        },
-        {
-            "location": "/contributing/",
-            "text": "Contributing\n\n\nContibutions are very welcome; be that changes, bug fixing, issue resolution or support.\n\n\nIssues\n\n\nAll issues should be raise on \ngithub.com/lawsie/guizero/issues\n\n\nCode\n\n\nWhen providing code changes please:\n\n\n\n\nuse the \ndev\n branch as the base for all changes\n\n\ncreate a single pull requests for each fix / addition\n\n\nfollow the existing coding style\n\n\nprovide documentation for all changes as markdown in \n/docs-src\n\n\nprovide tests for all changes in \n/test",
-            "title": "Notes"
-        },
-        {
-            "location": "/contributing/#contributing",
-            "text": "Contibutions are very welcome; be that changes, bug fixing, issue resolution or support.",
-            "title": "Contributing"
-        },
-        {
-            "location": "/contributing/#issues",
-            "text": "All issues should be raise on  github.com/lawsie/guizero/issues",
-            "title": "Issues"
-        },
-        {
-            "location": "/contributing/#code",
-            "text": "When providing code changes please:   use the  dev  branch as the base for all changes  create a single pull requests for each fix / addition  follow the existing coding style  provide documentation for all changes as markdown in  /docs-src  provide tests for all changes in  /test",
-            "title": "Code"
-        },
-        {
-            "location": "/development/",
-            "text": "Development\n\n\nNotes on how to develop guizero (on Windows).\n\n\nSetup\n\n\nUpgrade pip:\n\n\npython.exe -m pip install pip --upgrade\n\n\n\n\nInstall / upgrade pre-requisites:\n\n\npip install mkdocs wheel twine virtualenv pytest pillow --upgrade\n\n\n\n\nPython library\n\n\nCreate a virtual environment (not essential, but a good idea!):\n\n\nvirtualenv guizero-[versionno]\ncd guizero-[versionno]\n\n\n\n\nActivate your virtual environment:\n\n\nScripts\\activate\n\n\n\n\nCheckout and install guizero for development:\n\n\ngit clone https://github.com/lawsie/guizero\ncd guizero\ngit checkout dev\npython setup.py develop\n\n\n\n\nWhen you have finished your development, deactivate your virtual environment:\n\n\nScripts\\deactivate\n\n\n\n\nTests\n\n\nTo run the automated tests:\n\n\ncd guizero\\test\npytest -v \n\n\n\n\nIf running the tests inside a virtual environment you will need to install pytest in that virtual enviroment.\n\n\npip install pytest\n\n\n\n\nNote - tkinter can error when running the tests usually when the interpreter doesn't start properly, it doesnt seem to like being initialised and destroyed hundreds of times, I suspect a file locking issue as you dont see the problem on Linux. So sometimes you might get a test fail with an error like \nThis probably means that tk wasn't installed properly.\n. Just re-run the last failed errors! \npytest --lf -v\n\n\nDocuments\n\n\nTest documents by serving up MkDocs:\n\n\ncd guizero\\docs-src\nmkdocs serve\n\n\n\n\nOpen \nhttp://127.0.0.1:8000/",
-            "title": "Developing"
-        },
-        {
-            "location": "/development/#development",
-            "text": "Notes on how to develop guizero (on Windows).",
-            "title": "Development"
-        },
-        {
-            "location": "/development/#setup",
-            "text": "Upgrade pip:  python.exe -m pip install pip --upgrade  Install / upgrade pre-requisites:  pip install mkdocs wheel twine virtualenv pytest pillow --upgrade",
-            "title": "Setup"
-        },
-        {
-            "location": "/development/#python-library",
-            "text": "Create a virtual environment (not essential, but a good idea!):  virtualenv guizero-[versionno]\ncd guizero-[versionno]  Activate your virtual environment:  Scripts\\activate  Checkout and install guizero for development:  git clone https://github.com/lawsie/guizero\ncd guizero\ngit checkout dev\npython setup.py develop  When you have finished your development, deactivate your virtual environment:  Scripts\\deactivate",
-            "title": "Python library"
-        },
-        {
-            "location": "/development/#tests",
-            "text": "To run the automated tests:  cd guizero\\test\npytest -v   If running the tests inside a virtual environment you will need to install pytest in that virtual enviroment.  pip install pytest  Note - tkinter can error when running the tests usually when the interpreter doesn't start properly, it doesnt seem to like being initialised and destroyed hundreds of times, I suspect a file locking issue as you dont see the problem on Linux. So sometimes you might get a test fail with an error like  This probably means that tk wasn't installed properly. . Just re-run the last failed errors!  pytest --lf -v",
-            "title": "Tests"
-        },
-        {
-            "location": "/development/#documents",
-            "text": "Test documents by serving up MkDocs:  cd guizero\\docs-src\nmkdocs serve  Open  http://127.0.0.1:8000/",
-            "title": "Documents"
-        },
-        {
-            "location": "/deployment/",
-            "text": "Deploy\n\n\nNotes on how to deploy guizero (on Windows).\n\n\nPrepare\n\n\n\n\nUpdate version number in \nguizero\\__init__.py\n\n\nUpdate version number in \ndocs-src\\docs\\about.md\n\n\nUpdate \nchangelog.md\n in docs\n\n\n\n\nPython library\n\n\nInstall locally:\n\n\ncd guizero\npython setup.py install\n\n\n\n\nBuild for deployment:\n\n\ncd guizero\npython setup.py sdist\npython setup.py bdist_wheel\n\n\n\n\nUpload to pypi:\n\n\ncd guizero\ntwine upload dist/* --skip-existing\n\n\n\n\nDocuments\n\n\nBuild:\n\n\ncd guizero/docs-src\nmkdocs build\n\n\n\n\nCopy to \ndocs\n:\n\n\ncd guizero\nxcopy docs-src\\site\\* docs /E\n\n\n\n\nPromote and tag release on github\n\n\nPush all changes to \nmaster\n.\n\n\nCreate a new release on github named \n0.0.0\n.",
-            "title": "Deploying"
-        },
-        {
-            "location": "/deployment/#deploy",
-            "text": "Notes on how to deploy guizero (on Windows).",
-            "title": "Deploy"
-        },
-        {
-            "location": "/deployment/#prepare",
-            "text": "Update version number in  guizero\\__init__.py  Update version number in  docs-src\\docs\\about.md  Update  changelog.md  in docs",
-            "title": "Prepare"
-        },
-        {
-            "location": "/deployment/#python-library",
-            "text": "Install locally:  cd guizero\npython setup.py install  Build for deployment:  cd guizero\npython setup.py sdist\npython setup.py bdist_wheel  Upload to pypi:  cd guizero\ntwine upload dist/* --skip-existing",
-            "title": "Python library"
-        },
-        {
-            "location": "/deployment/#documents",
-            "text": "Build:  cd guizero/docs-src\nmkdocs build  Copy to  docs :  cd guizero\nxcopy docs-src\\site\\* docs /E",
-            "title": "Documents"
-        },
-        {
-            "location": "/deployment/#promote-and-tag-release-on-github",
-            "text": "Push all changes to  master .  Create a new release on github named  0.0.0 .",
-            "title": "Promote and tag release on github"
-        },
-        {
-            "location": "/changelog/",
-            "text": "guizero\n\n\n0.6.3 - 2019-04-18\n\n\n\n\nListBox scrollbar bug fix (again)\n\n\nRemoved pillow requires dependency\n\n\nAdded pillow as an extra dependency \npip3 install guizero[images]\n\n\nInstallation instructions update\n\n\ncontributors \nmartinohanlon\n, \nlawsie\n \n\n\n\n\n0.6.2 - 2019-04-05\n\n\n\n\nAbility to \nadd tk widgets\n into a guizero app with \n.add_tk_widget()\n\n\nListBox scrollbar bug fix\n\n\nMenuBar background colour bug fix\n\n\nsetup.py\n changes to allow dunders to be accessed from guizero module\n\n\ncontributors \nmartinohanlon\n, \nlawsie\n \n\n\n\n\n0.6.1 - 2019-03-08\n\n\n\n\nNew \nDrawing widget\n for creating \"drawings\"\n\n\nAdded full screen support for \nApp\n and \nWindow\n\n\nDoc updates\n\n\nMinor bug fixes\n\n\ncontributors \nmartinohanlon\n, \nlawsie\n \n\n\n\n\n0.6.0 - 2019-02-08\n\n\n\n\nRefactoring of layout functions\n\n\nEnabled \nalign\n for the \nauto\n layout\n\n\nwidth\n and \nheight\n can now be set to \n\"fill\"\n\n\nModified \nsetup.py\n to restrict install to Python 3 only\n\n\nMinor bug fixes\n\n\ncontributors \nmartinohanlon\n, \nbennuttal\n, \nyeyeto2788\n, \nknowledgejunkie\n, \nlawsie\n\n\n\n\n0.5.4 - 2018-10-16\n\n\n\n\nFixed \nBox\n to size properly\n\n\nAdded \nborder\n to \nBox\n\n\nAdded \nwidth\n and \nheight\n to widget constructor\n\n\nAdded \nresize\n method to all widgets\n\n\nMinor bug fixes\n\n\ncontributors \nmartinohanlon\n\n\n\n\n0.5.3 - 2018-07-18\n\n\n\n\nVarious bug fixes\n\n\nwrapping multiline \nTextBox\n data\n\n\nButtonGroup\n, \nComboBox\n now allow 0 options at init\n\n\nMinimum pillow version is now 4.3.0\n\n\nupdate\n method added to \nAdd\n and \nWindow\n\n\ncontributors \nmartinohanlon\n, \nscotty3785\n, \nMrYsLab\n, \nbsimmo\n\n\n\n\n0.5.2 - 2018-06-01\n\n\n\n\nRefactoring of \nButtonGroup\n, including API breaking change - if no hidden values are specified, \nButtonGroup.value\n now returns the text value not a generate string number \n#178\n\n\nA widgets properties \nbg\n, \ntext_color\n, \ntext_size\n, \nfont\n, \nwidth\n, \nheight\n can be restored by to their default by setting them to \nNone\n \n#181\n\n\nSlider is now sized properly when orientated vertically \n#186\n\n\nCombo\n and \nButtonGroup\n now support \nappend\n, \ninsert\n, \nremove\n, \nclear\n and depreciated \nadd_option\n \n#180\n\n\nRefactoring of class hierarchy \n\n\nVarious bug fixes\n\n\ncontributors \nmartinohanlon\n\n\n\n\n0.5.1 - 2018-05-14\n\n\n\n\nApp\n, \nWindow\n, \nBox\n now support the following properties and will cascade them to widgets within them:\n\n\nbg\n\n\ntext_color\n\n\ntext_size\n\n\nfont\n\n\nenabled\n\n\n\n\n\n\nIntroduced \nListBox\n\n\nBug fixes relating to \nbg\n and \ntext_color\n causing widgets to change colour when selected\n\n\nMinor bug fixes with \nCheckBox\n, \nWaffle\n and \nCombo\n\n\nDocumentation fixes and updates\n\n\ncontributors to this release \nmartinohanlon\n, \nlawsie\n, \nHarlekuin\n\n\n\n\n0.5.0 - 2018-04-10\n\n\n\n\nv0.5.0 includes significant refactoring of the guizero code base and introduces many new features\n\n\nNew image functionality introduced when PIL is installed:\n\n\nimages can be passed as \nTk.PhotoImage\n or \nPIL.Image\n objects as well as file paths\n\n\nmore images types are supported\n\n\nanimated images (gifs) are supported\n\n\nimages are scaled when the size is changed\n\n\n\n\n\n\nButtonGroup\n - \nselected\n is now optional, \nenabled\n properties now supported, \nvalue_text\n fixed\n\n\nFixed multiple \nApp\n bug\n\n\nCreated \nWindow\n class to support multi-window applications\n\n\nAdded \nmultiline\n and \nscrollbar\n functionality to \nTextBox\n\n\nRefactored guizero to introduce a class hierarchy making guizero wide code changes easier to implement\n\n\nAdded the following events to all widgets, this should be considered experimental in this release:\n\n\nwhen_clicked\n\n\nwhen_left_button_pressed\n\n\nwhen_left_button_released\n\n\nwhen_right_button_pressed\n\n\nwhen_right_button_released\n\n\nwhen_key_pressed\n\n\nwhen_key_released\n\n\nwhen_mouse_enters\n\n\nwhen_mouse_leaves\n\n\nwhen_mouse_dragged\n\n\n\n\n\n\nVarious minor bug fixes\n\n\nAutomated tests have been introduced\n\n\ncontributors to this release \nmartinohanlon\n, \nscotty3785\n, \nIDF31\n, \ndrussell1974\n  - ta very much :)\n\n\n\n\n0.4.5 - 2018-03-04\n\n\n\n\ncolors can now be specified as either \n\"red\"\n, \n\"#ffffff\"\n, or \n(red, green, blue)\n \n\n\nchange \nPicture\n \nimage\n startup parameter to be optional\n\n\nupdated \nPicture\n and \nPushButton\n errors and docs to show that PNG and GIF images can be used in Windows & Linux\n\n\nrefactored \nWaffle\n resolving bugs that setting properties didnt change its appearance\n\n\nchanged waffle so you can reference a pixel using \nwaffle[x,y]\n\n\nadded \ntext_color\n, \ntext_size\n and \nfont\n properties to \nSlider\n\n\nadded \nwidth\n and \nheight\n properties to:\n\n\nBox\n\n\nButtonGroup\n\n\nCheckBox\n\n\nCombo\n\n\nPicture\n\n\nSlider\n\n\nText\n\n\n\n\n\n\nadded \nwidth\n property to:\n\n\nTextBox\n\n\n\n\n\n\ncontributors to this release \nCoal0\n, \nmartinohanlon\n, \nscotty3785\n - :)\n\n\n\n\n0.4.4 - 2018-02-12\n\n\n\n\nmade \nPushButton\n \ncommand\n optional\n\n\nCombo\n command functions can now have 0 arguments\n\n\nWaffle\n command functions can now have 0 arguments\n\n\nrefactored command functions and added \nupdate_command\n to: \n\n\nButtonGroup\n\n\nCheckBox\n\n\nCombo\n\n\nPushButton\n\n\nSlider\n\n\nWaffle\n\n\n\n\n\n\nrefactored \ntext_color\n, \ntext_size\n and \nfont\n properties and added them to:\n\n\nButtonGroup\n\n\nCombo\n\n\nCheckBox\n\n\nPushButton\n\n\nText\n\n\nTextBox\n\n\n\n\n\n\nrefactored \nbg\n (background) and added to:\n\n\nBox\n\n\nButtonGroup\n\n\nCheckBox\n\n\nCombo\n\n\nPicture\n\n\nPushButton\n\n\nSlider\n\n\nText\n\n\nTextBox\n\n\n\n\n\n\ncontributors to this release \nm4ddav3\n, \nCoal0\n, \nlawsie\n, \nmartinohanlon\n - :)\n\n\n\n\n0.4.3 - 2018-01-10\n\n\nMinor features, bug fixes and internal refactoring\n\n\n\n\nadded \nxspan\n, \nyspan\n to grid layout (Credit: \npenguintutor\n)\n\n\nfixed \nshow()\n for widgets in a grid layout\n\n\nadded \nmaster\n, \ngrid\n, \nalign\n and \nvisible\n properties to widgets\n\n\nadded \nlayout\n property to containers\n\n\nfixed \nWaffle\n \nheight\n (Credit: \nscotty3785\n)\n\n\nminor doc updates\n\n\n0.4.2 was never released due to some pypi / wheel problems\n\n\n\n\n0.4.1 - 2017-12-28\n\n\nBug fixes and deployment test\n\n\n\n\nPushButton bug fixes\n\n\nadded \nenabled\n property to widgets which support \nEnable\n / \nDisable\n\n\ndocumentation tidy up\n\n\nadded build notes to documentation\n\n\n\n\n0.4 - 2017-12-19\n\n\nThank you to everyone who has taken time to contribute code, suggest helpful improvements and report their use of the library. I am extremely grateful to the following people who have contributed pull requests since the last version:\n\nbcroston\n, \nbennuttall\n, \nCoal0\n,  \nmartinohanlon\n and  \nscotty3785\n\n\nI am also very pleased to announce that \nmartinohanlon\n has very kindly agreed to maintain guizero whilst I am on maternity leave, beginning December 2017.\n\n\nGeneral changes:\n\n\n\n\nAll classes rewritten with internal Tk objects rather than extending the Tk object, meaning you can access all Tk functionality as \nObject.tk.tkmethod()\n (Credit for idea: \nbennuttall\n)\n\n\nImproved use of library with tab complete editors (e.g. ipython) \u2013 only the guizero properties and methods are listed so the list is shorter and more friendly. (Credit for idea: \nbennuttall\n)\n\n\n[Bug fix] Grid layout now lays items out properly. Previously the x and y axes were flipped. (Whoops!) \nThis fix will cause apps with a grid layout to look different, but now behave correctly. You may need to update old code as a result of this change.\n\n\nAll classes now inherit from mixins, adding 9 new common methods usable on most widgets - \nafter()\n, \ncancel()\n, \ndestroy()\n, \ndisable()\n, \nenable()\n, \nfocus()\n, \nhide()\n, \nshow()\n, \nrepeat()\n,  (Credit: \nCoal0\n and \nmartinohanlon\n)\n\n\nThe new \nrepeat()\n method allows you to easily specify a repeated callback to a function, making it extremely easy to perform repetitive actions such as updating the GUI based on readings from a sensor.\n\n\nDocumentation and examples have been improved and updated\n\n\n\n\nApp:\n\n\n\n\nNew constructor argument \nbg\n replaces deprecated \nbgcolor\n argument. If both are specified, \nbg\n overrides \nbgcolor\n.\n\n\nset_title()\n and \nbgcolor()\n methods are now deprecated and have been replaced by \ntitle\n and \nbg\n properties\n\n\nNew additional properties \nwidth\n and \nheight\n\n\n\n\nButtonGroup:\n\n\n\n\nget()\n and \nset()\n methods are now deprecated and have been replaced by the \nvalue\n property\n\n\nNew \nvalue_text\n property to get the text associated with the selected option\n\n\n\n\nCheckBox:\n\n\n\n\nget_text()\n, \nget_value()\n and \nchange_text()\n methods are now deprecated and have been replaced by the \nvalue\n and \ntext\n properties\n\n\nNew \ntoggle()\n method added\n\n\n\n\nCombo:\n\n\n\n\nget()\n and \nset()\n methods are now deprecated and have been replaced by the \nvalue\n property\n\n\n[Bug fix] \nset_default()\n now correctly resets the combo back to its originally specified value, whether this was the first option or a specified option\n\n\n\n\nPicture:\n\n\n\n\nset()\n method is now deprecated and has been replaced by the \nvalue\n property\n\n\n\n\nPushButton:\n\n\n\n\nset_text()\n method is now deprecated and has been replaced by the \ntext\n property\n\n\nNew properties for \ntext_color\n, \nbg\n, \nfont\n, \ntext_size\n, \nheight\n and \nwidth\n \u2013 make your buttons look pretty!\n\n\nFind out whether a button is pressed (1) or released (0) with the new \nvalue\n property\n\n\nNew \nicon()\n method to set the icon of a button after it is created\n\n\ntoggle_state()\n method deprecated and renamed to \ntoggle()\n for consistency\n\n\n\n\nSlider:\n\n\n\n\nNew \nvalue\n property for getting and setting the value of the slider\n\n\n\n\nText:\n\n\n\n\nNew constructor arguments \ntext_color\n and \nbg\n\n\ncolor\n constructor argument now deprecated and replaced by \ntext_color\n. If both are specified, \ntext_color\n overrides \ncolor\n.\n\n\nget()\n, \nset()\n, \ncolor()\n, \nfont_face()\n and \nfont_size()\n methods are now deprecated, replaced by properties \nvalue\n, \ntext_color\n, \nbg\n, \nfont\n and \nsize\n\n\n\n\nTextBox:\n\n\n\n\nget()\n and \nset()\n methods now deprecated and replaced by \nvalue\n property\n\n\n\n\nWaffle:\n\n\n\n\nAll waffles will now have a memory. The \nremember\n constructor argument remains for backwards compatibility only \nand will be removed in a future release\n.\n\n\nYou can now click on a Waffle, and specify a command to run when the Waffle is clicked on. The function given as the command should take two arguments as it will be passed the x, y coordinates of the pixel that was clicked. (Credit: \nscotty3785\n)\n\n\nChanged internal implementation of the Waffle so it should now be able to redraw more efficiently. (Credit: \nscotty3785\n)",
-            "title": "Change log"
-        },
-        {
-            "location": "/changelog/#guizero",
-            "text": "",
-            "title": "guizero"
-        },
-        {
-            "location": "/changelog/#063-2019-04-18",
-            "text": "ListBox scrollbar bug fix (again)  Removed pillow requires dependency  Added pillow as an extra dependency  pip3 install guizero[images]  Installation instructions update  contributors  martinohanlon ,  lawsie",
-            "title": "0.6.3 - 2019-04-18"
-        },
-        {
-            "location": "/changelog/#062-2019-04-05",
-            "text": "Ability to  add tk widgets  into a guizero app with  .add_tk_widget()  ListBox scrollbar bug fix  MenuBar background colour bug fix  setup.py  changes to allow dunders to be accessed from guizero module  contributors  martinohanlon ,  lawsie",
-            "title": "0.6.2 - 2019-04-05"
-        },
-        {
-            "location": "/changelog/#061-2019-03-08",
-            "text": "New  Drawing widget  for creating \"drawings\"  Added full screen support for  App  and  Window  Doc updates  Minor bug fixes  contributors  martinohanlon ,  lawsie",
-            "title": "0.6.1 - 2019-03-08"
-        },
-        {
-            "location": "/changelog/#060-2019-02-08",
-            "text": "Refactoring of layout functions  Enabled  align  for the  auto  layout  width  and  height  can now be set to  \"fill\"  Modified  setup.py  to restrict install to Python 3 only  Minor bug fixes  contributors  martinohanlon ,  bennuttal ,  yeyeto2788 ,  knowledgejunkie ,  lawsie",
-            "title": "0.6.0 - 2019-02-08"
-        },
-        {
-            "location": "/changelog/#054-2018-10-16",
-            "text": "Fixed  Box  to size properly  Added  border  to  Box  Added  width  and  height  to widget constructor  Added  resize  method to all widgets  Minor bug fixes  contributors  martinohanlon",
-            "title": "0.5.4 - 2018-10-16"
-        },
-        {
-            "location": "/changelog/#053-2018-07-18",
-            "text": "Various bug fixes  wrapping multiline  TextBox  data  ButtonGroup ,  ComboBox  now allow 0 options at init  Minimum pillow version is now 4.3.0  update  method added to  Add  and  Window  contributors  martinohanlon ,  scotty3785 ,  MrYsLab ,  bsimmo",
-            "title": "0.5.3 - 2018-07-18"
-        },
-        {
-            "location": "/changelog/#052-2018-06-01",
-            "text": "Refactoring of  ButtonGroup , including API breaking change - if no hidden values are specified,  ButtonGroup.value  now returns the text value not a generate string number  #178  A widgets properties  bg ,  text_color ,  text_size ,  font ,  width ,  height  can be restored by to their default by setting them to  None   #181  Slider is now sized properly when orientated vertically  #186  Combo  and  ButtonGroup  now support  append ,  insert ,  remove ,  clear  and depreciated  add_option   #180  Refactoring of class hierarchy   Various bug fixes  contributors  martinohanlon",
-            "title": "0.5.2 - 2018-06-01"
-        },
-        {
-            "location": "/changelog/#051-2018-05-14",
-            "text": "App ,  Window ,  Box  now support the following properties and will cascade them to widgets within them:  bg  text_color  text_size  font  enabled    Introduced  ListBox  Bug fixes relating to  bg  and  text_color  causing widgets to change colour when selected  Minor bug fixes with  CheckBox ,  Waffle  and  Combo  Documentation fixes and updates  contributors to this release  martinohanlon ,  lawsie ,  Harlekuin",
-            "title": "0.5.1 - 2018-05-14"
-        },
-        {
-            "location": "/changelog/#050-2018-04-10",
-            "text": "v0.5.0 includes significant refactoring of the guizero code base and introduces many new features  New image functionality introduced when PIL is installed:  images can be passed as  Tk.PhotoImage  or  PIL.Image  objects as well as file paths  more images types are supported  animated images (gifs) are supported  images are scaled when the size is changed    ButtonGroup  -  selected  is now optional,  enabled  properties now supported,  value_text  fixed  Fixed multiple  App  bug  Created  Window  class to support multi-window applications  Added  multiline  and  scrollbar  functionality to  TextBox  Refactored guizero to introduce a class hierarchy making guizero wide code changes easier to implement  Added the following events to all widgets, this should be considered experimental in this release:  when_clicked  when_left_button_pressed  when_left_button_released  when_right_button_pressed  when_right_button_released  when_key_pressed  when_key_released  when_mouse_enters  when_mouse_leaves  when_mouse_dragged    Various minor bug fixes  Automated tests have been introduced  contributors to this release  martinohanlon ,  scotty3785 ,  IDF31 ,  drussell1974   - ta very much :)",
-            "title": "0.5.0 - 2018-04-10"
-        },
-        {
-            "location": "/changelog/#045-2018-03-04",
-            "text": "colors can now be specified as either  \"red\" ,  \"#ffffff\" , or  (red, green, blue)    change  Picture   image  startup parameter to be optional  updated  Picture  and  PushButton  errors and docs to show that PNG and GIF images can be used in Windows & Linux  refactored  Waffle  resolving bugs that setting properties didnt change its appearance  changed waffle so you can reference a pixel using  waffle[x,y]  added  text_color ,  text_size  and  font  properties to  Slider  added  width  and  height  properties to:  Box  ButtonGroup  CheckBox  Combo  Picture  Slider  Text    added  width  property to:  TextBox    contributors to this release  Coal0 ,  martinohanlon ,  scotty3785  - :)",
-            "title": "0.4.5 - 2018-03-04"
-        },
-        {
-            "location": "/changelog/#044-2018-02-12",
-            "text": "made  PushButton   command  optional  Combo  command functions can now have 0 arguments  Waffle  command functions can now have 0 arguments  refactored command functions and added  update_command  to:   ButtonGroup  CheckBox  Combo  PushButton  Slider  Waffle    refactored  text_color ,  text_size  and  font  properties and added them to:  ButtonGroup  Combo  CheckBox  PushButton  Text  TextBox    refactored  bg  (background) and added to:  Box  ButtonGroup  CheckBox  Combo  Picture  PushButton  Slider  Text  TextBox    contributors to this release  m4ddav3 ,  Coal0 ,  lawsie ,  martinohanlon  - :)",
-            "title": "0.4.4 - 2018-02-12"
-        },
-        {
-            "location": "/changelog/#043-2018-01-10",
-            "text": "Minor features, bug fixes and internal refactoring   added  xspan ,  yspan  to grid layout (Credit:  penguintutor )  fixed  show()  for widgets in a grid layout  added  master ,  grid ,  align  and  visible  properties to widgets  added  layout  property to containers  fixed  Waffle   height  (Credit:  scotty3785 )  minor doc updates  0.4.2 was never released due to some pypi / wheel problems",
-            "title": "0.4.3 - 2018-01-10"
-        },
-        {
-            "location": "/changelog/#041-2017-12-28",
-            "text": "Bug fixes and deployment test   PushButton bug fixes  added  enabled  property to widgets which support  Enable  /  Disable  documentation tidy up  added build notes to documentation",
-            "title": "0.4.1 - 2017-12-28"
-        },
-        {
-            "location": "/changelog/#04-2017-12-19",
-            "text": "Thank you to everyone who has taken time to contribute code, suggest helpful improvements and report their use of the library. I am extremely grateful to the following people who have contributed pull requests since the last version: bcroston ,  bennuttall ,  Coal0 ,   martinohanlon  and   scotty3785  I am also very pleased to announce that  martinohanlon  has very kindly agreed to maintain guizero whilst I am on maternity leave, beginning December 2017.  General changes:   All classes rewritten with internal Tk objects rather than extending the Tk object, meaning you can access all Tk functionality as  Object.tk.tkmethod()  (Credit for idea:  bennuttall )  Improved use of library with tab complete editors (e.g. ipython) \u2013 only the guizero properties and methods are listed so the list is shorter and more friendly. (Credit for idea:  bennuttall )  [Bug fix] Grid layout now lays items out properly. Previously the x and y axes were flipped. (Whoops!)  This fix will cause apps with a grid layout to look different, but now behave correctly. You may need to update old code as a result of this change.  All classes now inherit from mixins, adding 9 new common methods usable on most widgets -  after() ,  cancel() ,  destroy() ,  disable() ,  enable() ,  focus() ,  hide() ,  show() ,  repeat() ,  (Credit:  Coal0  and  martinohanlon )  The new  repeat()  method allows you to easily specify a repeated callback to a function, making it extremely easy to perform repetitive actions such as updating the GUI based on readings from a sensor.  Documentation and examples have been improved and updated   App:   New constructor argument  bg  replaces deprecated  bgcolor  argument. If both are specified,  bg  overrides  bgcolor .  set_title()  and  bgcolor()  methods are now deprecated and have been replaced by  title  and  bg  properties  New additional properties  width  and  height   ButtonGroup:   get()  and  set()  methods are now deprecated and have been replaced by the  value  property  New  value_text  property to get the text associated with the selected option   CheckBox:   get_text() ,  get_value()  and  change_text()  methods are now deprecated and have been replaced by the  value  and  text  properties  New  toggle()  method added   Combo:   get()  and  set()  methods are now deprecated and have been replaced by the  value  property  [Bug fix]  set_default()  now correctly resets the combo back to its originally specified value, whether this was the first option or a specified option   Picture:   set()  method is now deprecated and has been replaced by the  value  property   PushButton:   set_text()  method is now deprecated and has been replaced by the  text  property  New properties for  text_color ,  bg ,  font ,  text_size ,  height  and  width  \u2013 make your buttons look pretty!  Find out whether a button is pressed (1) or released (0) with the new  value  property  New  icon()  method to set the icon of a button after it is created  toggle_state()  method deprecated and renamed to  toggle()  for consistency   Slider:   New  value  property for getting and setting the value of the slider   Text:   New constructor arguments  text_color  and  bg  color  constructor argument now deprecated and replaced by  text_color . If both are specified,  text_color  overrides  color .  get() ,  set() ,  color() ,  font_face()  and  font_size()  methods are now deprecated, replaced by properties  value ,  text_color ,  bg ,  font  and  size   TextBox:   get()  and  set()  methods now deprecated and replaced by  value  property   Waffle:   All waffles will now have a memory. The  remember  constructor argument remains for backwards compatibility only  and will be removed in a future release .  You can now click on a Waffle, and specify a command to run when the Waffle is clicked on. The function given as the command should take two arguments as it will be passed the x, y coordinates of the pixel that was clicked. (Credit:  scotty3785 )  Changed internal implementation of the Waffle so it should now be able to redraw more efficiently. (Credit:  scotty3785 )",
-            "title": "0.4 - 2017-12-19"
-        }
-    ]
-}
\ No newline at end of file
+{"config":{"lang":["en"],"prebuild_index":false,"separator":"[\\s\\-]+"},"docs":[{"location":"","text":"Installation guizero is designed to allow new learners to quickly and easily create GUIs for their programs. If you can download and unzip a file, you can install guizero - no special permissions or administrator rights are required . If you have administrator rights and are connected to the internet, you can use pip to install guizero . Easy install Go to the guizero repository on GitHub. Click the green \"Clone or download\" button and then \"Download ZIP\" Open the zip file Open the guizero-master folder, then copy the guizero folder and paste it into your home directory Windows macOS That's it! When you write your guizero code, make sure you save it into your home directory. Install using pip You can use the command prompt and pip to install guizero for: Windows macOS Raspberry Pi Linux pip can also be used to install additional features and upgrade guizero . Windows Open a command prompt by clicking Start > Windows System > Command Prompt , or by typing 'command' into the start menu's search bar. Type this command and press enter: pip3 install guizero If you experience problems, have a look at this guide to Using pip on Windows . macOS Open a terminal window by clicking Applications > Utilities > Terminal , or by typing 'terminal' into the desktop's search bar. Type this command and press enter: pip3 install guizero Raspberry Pi Open a terminal window by clicking Menu > Accessories > Terminal . Type this command and press enter: sudo pip3 install guizero Linux Open a terminal Install tkinter using your distribution's package manager, e.g. sudo apt install python3-tk Install guizero using pip by typing pip3 install guizero or sudo pip3 install guizero if you dont have superuser rights Additional features install To use the additional image features of guizero such as: JPG image support scaling images animated gifs ... you will need to install guizero with the pip command: Windows / macOS pip3 install guizero[images] Linux / Raspberry Pi sudo pip3 install guizero[images] Upgrading Upgrade guizero using the pip command Windows / macOS pip3 install guizero --upgrade Linux / Raspberry Pi sudo pip3 install guizero --upgrade","title":"Installation"},{"location":"#installation","text":"guizero is designed to allow new learners to quickly and easily create GUIs for their programs. If you can download and unzip a file, you can install guizero - no special permissions or administrator rights are required . If you have administrator rights and are connected to the internet, you can use pip to install guizero .","title":"Installation"},{"location":"#easy-install","text":"Go to the guizero repository on GitHub. Click the green \"Clone or download\" button and then \"Download ZIP\" Open the zip file Open the guizero-master folder, then copy the guizero folder and paste it into your home directory Windows macOS That's it! When you write your guizero code, make sure you save it into your home directory.","title":"Easy install"},{"location":"#install-using-pip","text":"You can use the command prompt and pip to install guizero for: Windows macOS Raspberry Pi Linux pip can also be used to install additional features and upgrade guizero .","title":"Install using pip"},{"location":"#windows","text":"Open a command prompt by clicking Start > Windows System > Command Prompt , or by typing 'command' into the start menu's search bar. Type this command and press enter: pip3 install guizero If you experience problems, have a look at this guide to Using pip on Windows .","title":"Windows"},{"location":"#macos","text":"Open a terminal window by clicking Applications > Utilities > Terminal , or by typing 'terminal' into the desktop's search bar. Type this command and press enter: pip3 install guizero","title":"macOS"},{"location":"#raspberry-pi","text":"Open a terminal window by clicking Menu > Accessories > Terminal . Type this command and press enter: sudo pip3 install guizero","title":"Raspberry Pi"},{"location":"#linux","text":"Open a terminal Install tkinter using your distribution's package manager, e.g. sudo apt install python3-tk Install guizero using pip by typing pip3 install guizero or sudo pip3 install guizero if you dont have superuser rights","title":"Linux"},{"location":"#additional-features-install","text":"To use the additional image features of guizero such as: JPG image support scaling images animated gifs ... you will need to install guizero with the pip command: Windows / macOS pip3 install guizero[images] Linux / Raspberry Pi sudo pip3 install guizero[images]","title":"Additional features install"},{"location":"#upgrading","text":"Upgrade guizero using the pip command Windows / macOS pip3 install guizero --upgrade Linux / Raspberry Pi sudo pip3 install guizero --upgrade","title":"Upgrading"},{"location":"about/","text":"About What is guizero? guizero is a Python 3 library for creating simple GUIs. It is designed to allow new learners to quickly and easily create GUIs for their programs. from guizero import App, Text, PushButton app = App(title=\"guizero\") intro = Text(app, text=\"Have a go with guizero and see what you can create.\") ok = PushButton(app, text=\"Ok\") app.display() Aims The aim of guizero is to make the process of creating simple GUIs quick, accessible and understandable for new learners. Works with standard Python Tkinter GUI library (and no need to install other libraries) Abstracts away details new learners find difficult to understand (such as Tkinter StringVar() objects) Accessible widget naming system to help new learners to build up a mental model Flexible enough to be used for projects up to A-Level standard, yet accessible to primary school children Comprehensive and accessible documentation with examples Generates helpful additional error messages Version guizero is currently version 0.6.4 There may be bugs and features may change and be updated.","title":"About"},{"location":"about/#about","text":"","title":"About"},{"location":"about/#what-is-guizero","text":"guizero is a Python 3 library for creating simple GUIs. It is designed to allow new learners to quickly and easily create GUIs for their programs. from guizero import App, Text, PushButton app = App(title=\"guizero\") intro = Text(app, text=\"Have a go with guizero and see what you can create.\") ok = PushButton(app, text=\"Ok\") app.display()","title":"What is guizero?"},{"location":"about/#aims","text":"The aim of guizero is to make the process of creating simple GUIs quick, accessible and understandable for new learners. Works with standard Python Tkinter GUI library (and no need to install other libraries) Abstracts away details new learners find difficult to understand (such as Tkinter StringVar() objects) Accessible widget naming system to help new learners to build up a mental model Flexible enough to be used for projects up to A-Level standard, yet accessible to primary school children Comprehensive and accessible documentation with examples Generates helpful additional error messages","title":"Aims"},{"location":"about/#version","text":"guizero is currently version 0.6.4 There may be bugs and features may change and be updated.","title":"Version"},{"location":"alerts/","text":"Alerts Alerts are pop-up windows which can be used to interupt the user by asking question or providing information. Using alerts To use the alerts you will need to import each one individually at the start of your program. For example: from guizero import warn, info Purpose These functions pop up a box on the screen that displays a message. The functions available are: warn(title, text) - popup box with a warning icon info(title, text) - popup box with an information icon error(title, text) - popup box with an error icon yesno(title, text) - popup box with yes and no options. Pressing Yes returns True and pressing No returns False . All pop up boxes use the native display, so they will look different depending on your operating system. Examples Warning box This will pop up a warning box with the title \"Uh oh!\" and the message \"You are almost out of biscuits!\" . from guizero import App, warn app = App(title=\"Biscuit monitor\") warn(\"Uh oh!\", \"You are almost out of biscuits!\") app.display() On Windows, the box looks like this: The info and error boxes work in exactly the same way but will display different icons. Yes/No box When this function is called it returns a boolean value. If Yes was pressed, return True If No was pressed, return False You can store this value in a variable and test it: from guizero import App, yesno, info, error app = App(title=\"Snowman\") build_a_snowman = yesno(\"A question...\", \"Do you want to build a snowman?\") if build_a_snowman == True: info(\"Snowman\", \"It doesn't have to be a snowman\") else: error(\"Snowman\", \"Okay bye...\") app.display() This code will first display the yes/no box If Yes is pressed, an information box will be displayed: If No is pressed, an error box will be displayed Example: Using an alert as a callback You can also use these functions in a callback (when you have to provide a function for another widget to call). Here is an example with a PushButton which pops up an info box when it is pressed. from guizero import App, PushButton, info app = App() button = PushButton(app, command=info, args=[\"Info\", \"You pressed the button\"]) app.display() The arguments provided to the PushButton are: Where the button should be created (within the app ) The name of the function to call when pressed ( info ) A list of the arguments to the function you are calling (values for the title and message arguments for the info function) Example: Do you really want to close? You can use a yesno box to check whether someone really wants to exit your app. If they click yes, the app is closed, if not, nothing happens and they can continue with what they were doing. from guizero import App, Text, yesno # Ask the user if they really want to close the window def do_this_on_close(): if yesno(\"Close\", \"Do you want to quit?\"): app.destroy() app = App() title = Text(app, text=\"blank app\") # When the user tries to close the window, run the function do_this_on_close() app.on_close(do_this_on_close) app.display()","title":"Alerts"},{"location":"alerts/#alerts","text":"Alerts are pop-up windows which can be used to interupt the user by asking question or providing information.","title":"Alerts"},{"location":"alerts/#using-alerts","text":"To use the alerts you will need to import each one individually at the start of your program. For example: from guizero import warn, info","title":"Using alerts"},{"location":"alerts/#purpose","text":"These functions pop up a box on the screen that displays a message. The functions available are: warn(title, text) - popup box with a warning icon info(title, text) - popup box with an information icon error(title, text) - popup box with an error icon yesno(title, text) - popup box with yes and no options. Pressing Yes returns True and pressing No returns False . All pop up boxes use the native display, so they will look different depending on your operating system.","title":"Purpose"},{"location":"alerts/#examples","text":"Warning box This will pop up a warning box with the title \"Uh oh!\" and the message \"You are almost out of biscuits!\" . from guizero import App, warn app = App(title=\"Biscuit monitor\") warn(\"Uh oh!\", \"You are almost out of biscuits!\") app.display() On Windows, the box looks like this: The info and error boxes work in exactly the same way but will display different icons. Yes/No box When this function is called it returns a boolean value. If Yes was pressed, return True If No was pressed, return False You can store this value in a variable and test it: from guizero import App, yesno, info, error app = App(title=\"Snowman\") build_a_snowman = yesno(\"A question...\", \"Do you want to build a snowman?\") if build_a_snowman == True: info(\"Snowman\", \"It doesn't have to be a snowman\") else: error(\"Snowman\", \"Okay bye...\") app.display() This code will first display the yes/no box If Yes is pressed, an information box will be displayed: If No is pressed, an error box will be displayed Example: Using an alert as a callback You can also use these functions in a callback (when you have to provide a function for another widget to call). Here is an example with a PushButton which pops up an info box when it is pressed. from guizero import App, PushButton, info app = App() button = PushButton(app, command=info, args=[\"Info\", \"You pressed the button\"]) app.display() The arguments provided to the PushButton are: Where the button should be created (within the app ) The name of the function to call when pressed ( info ) A list of the arguments to the function you are calling (values for the title and message arguments for the info function) Example: Do you really want to close? You can use a yesno box to check whether someone really wants to exit your app. If they click yes, the app is closed, if not, nothing happens and they can continue with what they were doing. from guizero import App, Text, yesno # Ask the user if they really want to close the window def do_this_on_close(): if yesno(\"Close\", \"Do you want to quit?\"): app.destroy() app = App() title = Text(app, text=\"blank app\") # When the user tries to close the window, run the function do_this_on_close() app.on_close(do_this_on_close) app.display()","title":"Examples"},{"location":"allwidgets/","text":"Common methods These methods can be called upon any guizero widget. Method Takes Description after(time, command, args=None) time (int), command (function name), args (list of arguments) Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) repeat(time, command, args=None) time (int), command (function name), args (list of arguments) Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. cancel(command) command (function name) Cancels a scheduled call to command destroy() - Destroys the widget disable() - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - Enables the widget focus() - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) hide() - Hides the widget from view. This method will unpack the widget from the layout manager. show() - Displays the widget","title":"Allwidgets"},{"location":"allwidgets/#common-methods","text":"These methods can be called upon any guizero widget. Method Takes Description after(time, command, args=None) time (int), command (function name), args (list of arguments) Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) repeat(time, command, args=None) time (int), command (function name), args (list of arguments) Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. cancel(command) command (function name) Cancels a scheduled call to command destroy() - Destroys the widget disable() - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - Enables the widget focus() - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) hide() - Hides the widget from view. This method will unpack the widget from the layout manager. show() - Displays the widget","title":"Common methods"},{"location":"app/","text":"App (Contains a tkinter.Tk object) __init__( self, title=\"guizero\", width=500, height=500, layout=\"auto\", bgcolor=None, bg=None, visible=True) What is it? The App object is the basis of all GUIs created using guizero. It is the main window which contains all of the other widgets. How do I make one? Create an App object like this: from guizero import App app = App() app.display() Starting parameters When you create an App object you can specify any of the following parameters, all of which are optional. Specify parameters in the brackets like this: app = App(bg=\"red\", height=200) Parameter Data type Default Compulsory Description bg color None No The background colour of the app window and widgets inside it. Takes a color value. height int 500 No The height of the window in pixels. layout string \"auto\" No Whether widgets pack themselves ( \"auto\" ) or you specify their position on a grid ( \"grid\" ) title string \"guizero\" No The title displayed in the bar at the top of the window. width int 500 No The width of the window in pixels. visible boolean True No If the App should be visible. bgcolor string None No Replaced by bg parameter Parameters in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Methods You can call the following methods on an App object. Method Takes Returns Description add_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None) tk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int) Widget Adds a tk widget into a guizero container. Note - this is an advanced feature see Using tk for more information. after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables all the widgets in the app so that they cannot be interacted with display() - - Displays the app on the screen. You MUST call this method at the end of your program to display the app on the screen. enable() - - Enables all the widgets in the app exit_full_screen() - - Exit full screen display focus() - - Gives focus to the widget hide() - - Hides the app window from view. on_close(command) command (function name) - Calls the given function when the user tries to close the window. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. show() - - Displays the app window if it was previously hidden update() - - Force the application to update itself, useful if changes aren't reflected in the UI. set_full_screen(keybind) String - Set the application to display full screen. Option to specify a key to exit full screen (default is 'Esc'.) set_title(title) title (string) - Replaced by title property bgcolor bgcolor (string) - Replaced by bg property Parameters in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Properties You can set and get the following properties: Method Data type Description bg color The background colour of the window enabled boolean True if the app is enabled height int The height of the window font string The font that widgets should use full_screen boolean False No Whether the App is full screen layout string The layout being used by the App ( \"auto\" ) or ( \"grid\" ) title string The title of the window text_size int The size of the text widgets should use text_color color The colour of the text widgets should use visible boolean If the app is visible width int The width of the window Refer to a property as <name of widget>.property . For example, if your App object is called app you would write app.title . You can set the property (for example app.title = \"Hello world\" ) or get the value of the property to use (for example print(app.title) ). Examples Creating an App object Create an App object by calling the App() constructor. You should give the object a name so you can refer to it later - in this case we have called it app . It is best to keep the name you give to your App object quite short, as you will have to use it to tell other widgets where they should be stored. At the end of the program you MUST tell the app object to begin the display loop. from guizero import App app = App(title=\"My app\", height=300, width=200) app.display() Changing the title You can change the title of the app object once it has been created like this: from guizero import App app = App(title=\"My app\", height=300, width=200) app.title = \"A different title\" app.display() This will display the app with the updated title:","title":"App"},{"location":"app/#app","text":"(Contains a tkinter.Tk object) __init__( self, title=\"guizero\", width=500, height=500, layout=\"auto\", bgcolor=None, bg=None, visible=True)","title":"App"},{"location":"app/#what-is-it","text":"The App object is the basis of all GUIs created using guizero. It is the main window which contains all of the other widgets.","title":"What is it?"},{"location":"app/#how-do-i-make-one","text":"Create an App object like this: from guizero import App app = App() app.display()","title":"How do I make one?"},{"location":"app/#starting-parameters","text":"When you create an App object you can specify any of the following parameters, all of which are optional. Specify parameters in the brackets like this: app = App(bg=\"red\", height=200) Parameter Data type Default Compulsory Description bg color None No The background colour of the app window and widgets inside it. Takes a color value. height int 500 No The height of the window in pixels. layout string \"auto\" No Whether widgets pack themselves ( \"auto\" ) or you specify their position on a grid ( \"grid\" ) title string \"guizero\" No The title displayed in the bar at the top of the window. width int 500 No The width of the window in pixels. visible boolean True No If the App should be visible. bgcolor string None No Replaced by bg parameter Parameters in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Starting parameters"},{"location":"app/#methods","text":"You can call the following methods on an App object. Method Takes Returns Description add_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None) tk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int) Widget Adds a tk widget into a guizero container. Note - this is an advanced feature see Using tk for more information. after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables all the widgets in the app so that they cannot be interacted with display() - - Displays the app on the screen. You MUST call this method at the end of your program to display the app on the screen. enable() - - Enables all the widgets in the app exit_full_screen() - - Exit full screen display focus() - - Gives focus to the widget hide() - - Hides the app window from view. on_close(command) command (function name) - Calls the given function when the user tries to close the window. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. show() - - Displays the app window if it was previously hidden update() - - Force the application to update itself, useful if changes aren't reflected in the UI. set_full_screen(keybind) String - Set the application to display full screen. Option to specify a key to exit full screen (default is 'Esc'.) set_title(title) title (string) - Replaced by title property bgcolor bgcolor (string) - Replaced by bg property Parameters in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Methods"},{"location":"app/#properties","text":"You can set and get the following properties: Method Data type Description bg color The background colour of the window enabled boolean True if the app is enabled height int The height of the window font string The font that widgets should use full_screen boolean False No Whether the App is full screen layout string The layout being used by the App ( \"auto\" ) or ( \"grid\" ) title string The title of the window text_size int The size of the text widgets should use text_color color The colour of the text widgets should use visible boolean If the app is visible width int The width of the window Refer to a property as <name of widget>.property . For example, if your App object is called app you would write app.title . You can set the property (for example app.title = \"Hello world\" ) or get the value of the property to use (for example print(app.title) ).","title":"Properties"},{"location":"app/#examples","text":"Creating an App object Create an App object by calling the App() constructor. You should give the object a name so you can refer to it later - in this case we have called it app . It is best to keep the name you give to your App object quite short, as you will have to use it to tell other widgets where they should be stored. At the end of the program you MUST tell the app object to begin the display loop. from guizero import App app = App(title=\"My app\", height=300, width=200) app.display() Changing the title You can change the title of the app object once it has been created like this: from guizero import App app = App(title=\"My app\", height=300, width=200) app.title = \"A different title\" app.display() This will display the app with the updated title:","title":"Examples"},{"location":"blocking/","text":"Loops and sleeping You may be used to writing programs which contain loops or make use of the sleep() command, but find when you try to use these with guizero they cause your GUI to freeze. This is because guizero (in common with almost all GUIs) operates an event driven model of programming which may be different to the one you are familiar with. Your first guizero program might look a bit like this: from guizero import App app = App(\"Hello world\") app.display() The line of code app.display() doesn't just display the app - it enters an infinite event loop which is watching and waiting for events to happen on the GUI. Events include things like the user clicking on a button, moving a slider, typing in a text box etc. No code written after this line will ever execute because the event loop is infinite. Example Suppose you want a counter on your GUI to start counting up by 1 every second. You might be tempted to write a program like this: from guizero import App, Text from time import sleep app = App(\"Hello world\") text = Text(app, text=\"1\") while True: text.value = int(text.value) + 1 sleep(1) app.display() If you run this program, you'll see that this does not have the desired effect - your program crashes! This is because you have blocked the updating of your GUI in two ways: The sleep() command - whilst your program is sleeping, the GUI will not update and you will not be able to click on anything. The while loop - once you enter this loop, your GUI will never update ever again and will probably crash. Solution This behaviour is not a bug within guizero or tkinter. You must write GUI based programs in a different way to the one you may be used to. If you want to repeatedly perform an action you would do it like this: Write a function which performs the desired action (in this example counter() ) Set a callback to that function. You can either schedule the same callback to occur repeatedly after a given number of milliseconds (in this example 1000 ), or you can schedule it only once. from guizero import App, Text # Action you would like to perform def counter(): text.value = int(text.value) + 1 app = App(\"Hello world\") text = Text(app, text=\"1\") text.repeat(1000, counter) # Schedule call to counter() every 1000ms app.display()","title":"Loops and sleeping"},{"location":"blocking/#loops-and-sleeping","text":"You may be used to writing programs which contain loops or make use of the sleep() command, but find when you try to use these with guizero they cause your GUI to freeze. This is because guizero (in common with almost all GUIs) operates an event driven model of programming which may be different to the one you are familiar with. Your first guizero program might look a bit like this: from guizero import App app = App(\"Hello world\") app.display() The line of code app.display() doesn't just display the app - it enters an infinite event loop which is watching and waiting for events to happen on the GUI. Events include things like the user clicking on a button, moving a slider, typing in a text box etc. No code written after this line will ever execute because the event loop is infinite.","title":"Loops and sleeping"},{"location":"blocking/#example","text":"Suppose you want a counter on your GUI to start counting up by 1 every second. You might be tempted to write a program like this: from guizero import App, Text from time import sleep app = App(\"Hello world\") text = Text(app, text=\"1\") while True: text.value = int(text.value) + 1 sleep(1) app.display() If you run this program, you'll see that this does not have the desired effect - your program crashes! This is because you have blocked the updating of your GUI in two ways: The sleep() command - whilst your program is sleeping, the GUI will not update and you will not be able to click on anything. The while loop - once you enter this loop, your GUI will never update ever again and will probably crash.","title":"Example"},{"location":"blocking/#solution","text":"This behaviour is not a bug within guizero or tkinter. You must write GUI based programs in a different way to the one you may be used to. If you want to repeatedly perform an action you would do it like this: Write a function which performs the desired action (in this example counter() ) Set a callback to that function. You can either schedule the same callback to occur repeatedly after a given number of milliseconds (in this example 1000 ), or you can schedule it only once. from guizero import App, Text # Action you would like to perform def counter(): text.value = int(text.value) + 1 app = App(\"Hello world\") text = Text(app, text=\"1\") text.repeat(1000, counter) # Schedule call to counter() every 1000ms app.display()","title":"Solution"},{"location":"box/","text":"Box (Contains a tkinter.Frame object) __init__( self, master, layout=\"auto\", grid=None, align=None, visible=True, enabled=None, width=None, height=None, border=None) What is it? The Box object is an invisible container which can contain other widgets. It is the only object other than App which can act as the master for other objects and can have its own layout manager. You can use the Box object to group other objects within your GUI. How do I make one? Create a Box object like this: from guizero import App, Box app = App() box = Box(app) app.display() Starting parameters When you create a Box object you must specify a master, and you can specify any of the optional parameters. Specify parameters in the brackets like this: box = Box(app, layout=\"grid\") Parameter Data type Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . grid List None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. layout string \"auto\" - Whether widgets inside this box pack themselves ( \"auto\" ) or you specify their position on a grid ( \"grid\" ) visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in pixels or to \"fill\" height size None No Set the height of the widget in pixels or to \"fill\" border int None No Sets the border thickness. 0 or False is no border. True or value > 1 sets a border. Methods You can call the following methods on a Box object. Method Takes Returns Description add_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None) tk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int) Widget Adds a tk widget into a guizero container. Note - this is an advanced feature see Using tk for more information. after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command disable() - - Disables all the widgets in the box so that they cannot be interacted with destroy() - - Destroys the widget enable() - - Enables all the widgets in the box focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget set_border(thickness, color) thickness (int), color ( color ) - Sets the border thickness and color. Setting thickness to 0 will result in no border. show() - - Displays the widget if it was previously hidden Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container border int The border thickness, setting to 0 or False (the default) there is no border. bg color The background colour of the widget enabled boolean True if the box is enabled grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid font string The font that widgets should use height size Set the height of the widget in pixels or to \"fill\" layout string The layout being used by the Box ( \"auto\" ) or ( \"grid\" ) master App The App object to which this box belongs text_size int The size of the text widgets should use text_color color The colour of the text widgets should use visible boolean If this widget is visible width size Set the width of the widget in pixels or to \"fill\" Examples Putting widgets in a Box A Box object is invisible, but it can contain other widgets. In this example, there are two Text objects. One has box as its master, the other has app as its master. from guizero import App, Box, Text app = App(title=\"My app\", height=300, width=400) box = Box(app) text1 = Text(box, text=\"Hello from the box\", size=14, text_color=\"red\", font=\"Arial\") text2 = Text(app, text=\"Hello from the app\", size=14, text_color=\"blue\", font=\"Courier New\") app.display() Grouping objects within a Box It is useful to put objects in a box to group them together. For example here we have given the app a grid layout, then placed some text at [0,0] and the Box object at [1,0]. This means that the text will appear on the left, and the contents of the Box will appear on the right. The Box object itself has a grid layout and contains six buttons which are positioned on a separate grid layout belonging to the box. from guizero import App, Text, Box, PushButton def do_nothing(): return 0 app = App(title=\"My app\", height=300, width=300, layout=\"grid\") text = Text(app, text=\"Some text here\", grid=[0,0]) box = Box(app, layout=\"grid\", grid=[1,0]) button1 = PushButton(box, command=do_nothing, text=\"1\", grid=[0,0]) button2 = PushButton(box, command=do_nothing, text=\"2\", grid=[1,0]) button3 = PushButton(box, command=do_nothing, text=\"3\", grid=[2,0]) button4 = PushButton(box, command=do_nothing, text=\"4\", grid=[0,1]) button5 = PushButton(box, command=do_nothing, text=\"5\", grid=[1,1]) button6 = PushButton(box, command=do_nothing, text=\"6\", grid=[2,1]) app.display()","title":"Box"},{"location":"box/#box","text":"(Contains a tkinter.Frame object) __init__( self, master, layout=\"auto\", grid=None, align=None, visible=True, enabled=None, width=None, height=None, border=None)","title":"Box"},{"location":"box/#what-is-it","text":"The Box object is an invisible container which can contain other widgets. It is the only object other than App which can act as the master for other objects and can have its own layout manager. You can use the Box object to group other objects within your GUI.","title":"What is it?"},{"location":"box/#how-do-i-make-one","text":"Create a Box object like this: from guizero import App, Box app = App() box = Box(app) app.display()","title":"How do I make one?"},{"location":"box/#starting-parameters","text":"When you create a Box object you must specify a master, and you can specify any of the optional parameters. Specify parameters in the brackets like this: box = Box(app, layout=\"grid\") Parameter Data type Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . grid List None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. layout string \"auto\" - Whether widgets inside this box pack themselves ( \"auto\" ) or you specify their position on a grid ( \"grid\" ) visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in pixels or to \"fill\" height size None No Set the height of the widget in pixels or to \"fill\" border int None No Sets the border thickness. 0 or False is no border. True or value > 1 sets a border.","title":"Starting parameters"},{"location":"box/#methods","text":"You can call the following methods on a Box object. Method Takes Returns Description add_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None) tk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int) Widget Adds a tk widget into a guizero container. Note - this is an advanced feature see Using tk for more information. after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command disable() - - Disables all the widgets in the box so that they cannot be interacted with destroy() - - Destroys the widget enable() - - Enables all the widgets in the box focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget set_border(thickness, color) thickness (int), color ( color ) - Sets the border thickness and color. Setting thickness to 0 will result in no border. show() - - Displays the widget if it was previously hidden","title":"Methods"},{"location":"box/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container border int The border thickness, setting to 0 or False (the default) there is no border. bg color The background colour of the widget enabled boolean True if the box is enabled grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid font string The font that widgets should use height size Set the height of the widget in pixels or to \"fill\" layout string The layout being used by the Box ( \"auto\" ) or ( \"grid\" ) master App The App object to which this box belongs text_size int The size of the text widgets should use text_color color The colour of the text widgets should use visible boolean If this widget is visible width size Set the width of the widget in pixels or to \"fill\"","title":"Properties"},{"location":"box/#examples","text":"Putting widgets in a Box A Box object is invisible, but it can contain other widgets. In this example, there are two Text objects. One has box as its master, the other has app as its master. from guizero import App, Box, Text app = App(title=\"My app\", height=300, width=400) box = Box(app) text1 = Text(box, text=\"Hello from the box\", size=14, text_color=\"red\", font=\"Arial\") text2 = Text(app, text=\"Hello from the app\", size=14, text_color=\"blue\", font=\"Courier New\") app.display() Grouping objects within a Box It is useful to put objects in a box to group them together. For example here we have given the app a grid layout, then placed some text at [0,0] and the Box object at [1,0]. This means that the text will appear on the left, and the contents of the Box will appear on the right. The Box object itself has a grid layout and contains six buttons which are positioned on a separate grid layout belonging to the box. from guizero import App, Text, Box, PushButton def do_nothing(): return 0 app = App(title=\"My app\", height=300, width=300, layout=\"grid\") text = Text(app, text=\"Some text here\", grid=[0,0]) box = Box(app, layout=\"grid\", grid=[1,0]) button1 = PushButton(box, command=do_nothing, text=\"1\", grid=[0,0]) button2 = PushButton(box, command=do_nothing, text=\"2\", grid=[1,0]) button3 = PushButton(box, command=do_nothing, text=\"3\", grid=[2,0]) button4 = PushButton(box, command=do_nothing, text=\"4\", grid=[0,1]) button5 = PushButton(box, command=do_nothing, text=\"5\", grid=[1,1]) button6 = PushButton(box, command=do_nothing, text=\"6\", grid=[2,1]) app.display()","title":"Examples"},{"location":"buttongroup/","text":"ButtonGroup (Contains a tkinter.Frame object) __init__( self, master, options=[], selected=None, horizontal=False, command=None, grid=None, align=None, args=None, visible=True, enabled=None, width=None, height=None) What is it? The ButtonGroup object displays a group of radio buttons, allowing the user to choose a single option. How do I make one? Create a ButtonGroup object like this: from guizero import App, ButtonGroup app = App() choice = ButtonGroup(app, options=[\"cheese\", \"ham\", \"salad\"], selected=\"cheese\") app.display() Starting parameters When you create a ButtonGroup object you must specify a master and you can specify any of the optional parameters. Specify parameters in the brackets like this: choice = ButtonGroup(app, options=[\"cheese\", \"ham\", \"salad\"], selected=1) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs options list or 2D List - No Either a list or a 2D list of [text, value] pairs. If a 2D list is specified, the first item in the pair will be displayed on the interface, and the second item will be a hidden value associated with this option. selected string - - The option that should be selected, if a value isn't provided the first option will be selected. align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . command function name None - The name of a function to call when the selected option changes. args list None - If you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list grid list [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. horizontal boolean False - Whether the buttons stack vertically or horizontally. (Defaults to vertical) visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in characters or to \"fill\" height size None No Set the height of the widget in characters or to \"fill\" Methods You can call the following methods on an ButtonGroup object. Method Takes Returns Description append(option) item (string) - Appends a new option to the end of the ButtonGroup. after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget get_group_as_list() - list Returns a list containing all of the text/hidden value pairs from the ButtonGroup (useful for debugging) hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. insert(index, option) index (int), option (string) - Insert a new option in the ButtonGroup at index remove(option) item (string) Boolean Removes the first option from the ButtonGroup. Returns True if an item was removed. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden update_command(command, args =None) command (function name), args ( Optional List of arguments to be passed to command) - Updates the function to call when the selected option changes get() - string Replaced by value property set(value) value (string) - Replaced by value property Parameters in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" master App or Box The container to which this widget belongs value string The hidden value associated with the currently selected option value_text string The text associated with the currently selected option visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\" text_size int The size of the text text_color color The colour of the text Refer to a property as <name of widget>.property . For example, if your ButtonGroup object is called choice you would write choice.value . You can set the property (for example choice.value = \"2\" ) or get the value of the property to use (for example print(choice.value) ). Examples Creating a ButtonGroup with a 2D list If you want to create a ButtonGroup object with your own hidden values you can specify a 2D list of options: from guizero import App, ButtonGroup, Text def update_text(): what_is_selected.value = activities.value app = App() activities = ButtonGroup(app, options=[ [\"Roller Skating\", \"skate\"], [\"White water rafting\", \"WWR\"], [\"Mountain climbing\", \"climb\"] ], selected=\"skate\", command=update_text) what_is_selected = Text(app, text=\"skate\") app.display()","title":"ButtonGroup"},{"location":"buttongroup/#buttongroup","text":"(Contains a tkinter.Frame object) __init__( self, master, options=[], selected=None, horizontal=False, command=None, grid=None, align=None, args=None, visible=True, enabled=None, width=None, height=None)","title":"ButtonGroup"},{"location":"buttongroup/#what-is-it","text":"The ButtonGroup object displays a group of radio buttons, allowing the user to choose a single option.","title":"What is it?"},{"location":"buttongroup/#how-do-i-make-one","text":"Create a ButtonGroup object like this: from guizero import App, ButtonGroup app = App() choice = ButtonGroup(app, options=[\"cheese\", \"ham\", \"salad\"], selected=\"cheese\") app.display()","title":"How do I make one?"},{"location":"buttongroup/#starting-parameters","text":"When you create a ButtonGroup object you must specify a master and you can specify any of the optional parameters. Specify parameters in the brackets like this: choice = ButtonGroup(app, options=[\"cheese\", \"ham\", \"salad\"], selected=1) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs options list or 2D List - No Either a list or a 2D list of [text, value] pairs. If a 2D list is specified, the first item in the pair will be displayed on the interface, and the second item will be a hidden value associated with this option. selected string - - The option that should be selected, if a value isn't provided the first option will be selected. align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . command function name None - The name of a function to call when the selected option changes. args list None - If you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list grid list [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. horizontal boolean False - Whether the buttons stack vertically or horizontally. (Defaults to vertical) visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in characters or to \"fill\" height size None No Set the height of the widget in characters or to \"fill\"","title":"Starting parameters"},{"location":"buttongroup/#methods","text":"You can call the following methods on an ButtonGroup object. Method Takes Returns Description append(option) item (string) - Appends a new option to the end of the ButtonGroup. after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget get_group_as_list() - list Returns a list containing all of the text/hidden value pairs from the ButtonGroup (useful for debugging) hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. insert(index, option) index (int), option (string) - Insert a new option in the ButtonGroup at index remove(option) item (string) Boolean Removes the first option from the ButtonGroup. Returns True if an item was removed. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden update_command(command, args =None) command (function name), args ( Optional List of arguments to be passed to command) - Updates the function to call when the selected option changes get() - string Replaced by value property set(value) value (string) - Replaced by value property Parameters in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Methods"},{"location":"buttongroup/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" master App or Box The container to which this widget belongs value string The hidden value associated with the currently selected option value_text string The text associated with the currently selected option visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\" text_size int The size of the text text_color color The colour of the text Refer to a property as <name of widget>.property . For example, if your ButtonGroup object is called choice you would write choice.value . You can set the property (for example choice.value = \"2\" ) or get the value of the property to use (for example print(choice.value) ).","title":"Properties"},{"location":"buttongroup/#examples","text":"Creating a ButtonGroup with a 2D list If you want to create a ButtonGroup object with your own hidden values you can specify a 2D list of options: from guizero import App, ButtonGroup, Text def update_text(): what_is_selected.value = activities.value app = App() activities = ButtonGroup(app, options=[ [\"Roller Skating\", \"skate\"], [\"White water rafting\", \"WWR\"], [\"Mountain climbing\", \"climb\"] ], selected=\"skate\", command=update_text) what_is_selected = Text(app, text=\"skate\") app.display()","title":"Examples"},{"location":"changelog/","text":"guizero 0.6.4 - 2019-05-08 Fixed TextBox command to be on key release Fix Text not inheriting properties Added add_tk_warning when inserting a tk widget into the wrong container Update docs contributors martinohanlon , hyle01 0.6.3 - 2019-04-18 ListBox scrollbar bug fix (again) Removed pillow requires dependency Added pillow as an extra dependency pip3 install guizero[images] Installation instructions update contributors martinohanlon , lawsie 0.6.2 - 2019-04-05 Ability to add tk widgets into a guizero app with .add_tk_widget() ListBox scrollbar bug fix MenuBar background colour bug fix setup.py changes to allow dunders to be accessed from guizero module contributors martinohanlon , lawsie 0.6.1 - 2019-03-08 New Drawing widget for creating \"drawings\" Added full screen support for App and Window Doc updates Minor bug fixes contributors martinohanlon , lawsie 0.6.0 - 2019-02-08 Refactoring of layout functions Enabled align for the auto layout width and height can now be set to \"fill\" Modified setup.py to restrict install to Python 3 only Minor bug fixes contributors martinohanlon , bennuttal , yeyeto2788 , knowledgejunkie , lawsie 0.5.4 - 2018-10-16 Fixed Box to size properly Added border to Box Added width and height to widget constructor Added resize method to all widgets Minor bug fixes contributors martinohanlon 0.5.3 - 2018-07-18 Various bug fixes wrapping multiline TextBox data ButtonGroup , ComboBox now allow 0 options at init Minimum pillow version is now 4.3.0 update method added to Add and Window contributors martinohanlon , scotty3785 , MrYsLab , bsimmo 0.5.2 - 2018-06-01 Refactoring of ButtonGroup , including API breaking change - if no hidden values are specified, ButtonGroup.value now returns the text value not a generate string number #178 A widgets properties bg , text_color , text_size , font , width , height can be restored by to their default by setting them to None #181 Slider is now sized properly when orientated vertically #186 Combo and ButtonGroup now support append , insert , remove , clear and depreciated add_option #180 Refactoring of class hierarchy Various bug fixes contributors martinohanlon 0.5.1 - 2018-05-14 App , Window , Box now support the following properties and will cascade them to widgets within them: bg text_color text_size font enabled Introduced ListBox Bug fixes relating to bg and text_color causing widgets to change colour when selected Minor bug fixes with CheckBox , Waffle and Combo Documentation fixes and updates contributors to this release martinohanlon , lawsie , Harlekuin 0.5.0 - 2018-04-10 v0.5.0 includes significant refactoring of the guizero code base and introduces many new features New image functionality introduced when PIL is installed: images can be passed as Tk.PhotoImage or PIL.Image objects as well as file paths more images types are supported animated images (gifs) are supported images are scaled when the size is changed ButtonGroup - selected is now optional, enabled properties now supported, value_text fixed Fixed multiple App bug Created Window class to support multi-window applications Added multiline and scrollbar functionality to TextBox Refactored guizero to introduce a class hierarchy making guizero wide code changes easier to implement Added the following events to all widgets, this should be considered experimental in this release: when_clicked when_left_button_pressed when_left_button_released when_right_button_pressed when_right_button_released when_key_pressed when_key_released when_mouse_enters when_mouse_leaves when_mouse_dragged Various minor bug fixes Automated tests have been introduced contributors to this release martinohanlon , scotty3785 , IDF31 , drussell1974 - ta very much :) 0.4.5 - 2018-03-04 colors can now be specified as either \"red\" , \"#ffffff\" , or (red, green, blue) change Picture image startup parameter to be optional updated Picture and PushButton errors and docs to show that PNG and GIF images can be used in Windows & Linux refactored Waffle resolving bugs that setting properties didnt change its appearance changed waffle so you can reference a pixel using waffle[x,y] added text_color , text_size and font properties to Slider added width and height properties to: Box ButtonGroup CheckBox Combo Picture Slider Text added width property to: TextBox contributors to this release Coal0 , martinohanlon , scotty3785 - :) 0.4.4 - 2018-02-12 made PushButton command optional Combo command functions can now have 0 arguments Waffle command functions can now have 0 arguments refactored command functions and added update_command to: ButtonGroup CheckBox Combo PushButton Slider Waffle refactored text_color , text_size and font properties and added them to: ButtonGroup Combo CheckBox PushButton Text TextBox refactored bg (background) and added to: Box ButtonGroup CheckBox Combo Picture PushButton Slider Text TextBox contributors to this release m4ddav3 , Coal0 , lawsie , martinohanlon - :) 0.4.3 - 2018-01-10 Minor features, bug fixes and internal refactoring added xspan , yspan to grid layout (Credit: penguintutor ) fixed show() for widgets in a grid layout added master , grid , align and visible properties to widgets added layout property to containers fixed Waffle height (Credit: scotty3785 ) minor doc updates 0.4.2 was never released due to some pypi / wheel problems 0.4.1 - 2017-12-28 Bug fixes and deployment test PushButton bug fixes added enabled property to widgets which support Enable / Disable documentation tidy up added build notes to documentation 0.4 - 2017-12-19 Thank you to everyone who has taken time to contribute code, suggest helpful improvements and report their use of the library. I am extremely grateful to the following people who have contributed pull requests since the last version: bcroston , bennuttall , Coal0 , martinohanlon and scotty3785 I am also very pleased to announce that martinohanlon has very kindly agreed to maintain guizero whilst I am on maternity leave, beginning December 2017. General changes: All classes rewritten with internal Tk objects rather than extending the Tk object, meaning you can access all Tk functionality as Object.tk.tkmethod() (Credit for idea: bennuttall ) Improved use of library with tab complete editors (e.g. ipython) \u2013 only the guizero properties and methods are listed so the list is shorter and more friendly. (Credit for idea: bennuttall ) [Bug fix] Grid layout now lays items out properly. Previously the x and y axes were flipped. (Whoops!) This fix will cause apps with a grid layout to look different, but now behave correctly. You may need to update old code as a result of this change. All classes now inherit from mixins, adding 9 new common methods usable on most widgets - after() , cancel() , destroy() , disable() , enable() , focus() , hide() , show() , repeat() , (Credit: Coal0 and martinohanlon ) The new repeat() method allows you to easily specify a repeated callback to a function, making it extremely easy to perform repetitive actions such as updating the GUI based on readings from a sensor. Documentation and examples have been improved and updated App: New constructor argument bg replaces deprecated bgcolor argument. If both are specified, bg overrides bgcolor . set_title() and bgcolor() methods are now deprecated and have been replaced by title and bg properties New additional properties width and height ButtonGroup: get() and set() methods are now deprecated and have been replaced by the value property New value_text property to get the text associated with the selected option CheckBox: get_text() , get_value() and change_text() methods are now deprecated and have been replaced by the value and text properties New toggle() method added Combo: get() and set() methods are now deprecated and have been replaced by the value property [Bug fix] set_default() now correctly resets the combo back to its originally specified value, whether this was the first option or a specified option Picture: set() method is now deprecated and has been replaced by the value property PushButton: set_text() method is now deprecated and has been replaced by the text property New properties for text_color , bg , font , text_size , height and width \u2013 make your buttons look pretty! Find out whether a button is pressed (1) or released (0) with the new value property New icon() method to set the icon of a button after it is created toggle_state() method deprecated and renamed to toggle() for consistency Slider: New value property for getting and setting the value of the slider Text: New constructor arguments text_color and bg color constructor argument now deprecated and replaced by text_color . If both are specified, text_color overrides color . get() , set() , color() , font_face() and font_size() methods are now deprecated, replaced by properties value , text_color , bg , font and size TextBox: get() and set() methods now deprecated and replaced by value property Waffle: All waffles will now have a memory. The remember constructor argument remains for backwards compatibility only and will be removed in a future release . You can now click on a Waffle, and specify a command to run when the Waffle is clicked on. The function given as the command should take two arguments as it will be passed the x, y coordinates of the pixel that was clicked. (Credit: scotty3785 ) Changed internal implementation of the Waffle so it should now be able to redraw more efficiently. (Credit: scotty3785 )","title":"Change log"},{"location":"changelog/#guizero","text":"","title":"guizero"},{"location":"changelog/#064-2019-05-08","text":"Fixed TextBox command to be on key release Fix Text not inheriting properties Added add_tk_warning when inserting a tk widget into the wrong container Update docs contributors martinohanlon , hyle01","title":"0.6.4 - 2019-05-08"},{"location":"changelog/#063-2019-04-18","text":"ListBox scrollbar bug fix (again) Removed pillow requires dependency Added pillow as an extra dependency pip3 install guizero[images] Installation instructions update contributors martinohanlon , lawsie","title":"0.6.3 - 2019-04-18"},{"location":"changelog/#062-2019-04-05","text":"Ability to add tk widgets into a guizero app with .add_tk_widget() ListBox scrollbar bug fix MenuBar background colour bug fix setup.py changes to allow dunders to be accessed from guizero module contributors martinohanlon , lawsie","title":"0.6.2 - 2019-04-05"},{"location":"changelog/#061-2019-03-08","text":"New Drawing widget for creating \"drawings\" Added full screen support for App and Window Doc updates Minor bug fixes contributors martinohanlon , lawsie","title":"0.6.1 - 2019-03-08"},{"location":"changelog/#060-2019-02-08","text":"Refactoring of layout functions Enabled align for the auto layout width and height can now be set to \"fill\" Modified setup.py to restrict install to Python 3 only Minor bug fixes contributors martinohanlon , bennuttal , yeyeto2788 , knowledgejunkie , lawsie","title":"0.6.0 - 2019-02-08"},{"location":"changelog/#054-2018-10-16","text":"Fixed Box to size properly Added border to Box Added width and height to widget constructor Added resize method to all widgets Minor bug fixes contributors martinohanlon","title":"0.5.4 - 2018-10-16"},{"location":"changelog/#053-2018-07-18","text":"Various bug fixes wrapping multiline TextBox data ButtonGroup , ComboBox now allow 0 options at init Minimum pillow version is now 4.3.0 update method added to Add and Window contributors martinohanlon , scotty3785 , MrYsLab , bsimmo","title":"0.5.3 - 2018-07-18"},{"location":"changelog/#052-2018-06-01","text":"Refactoring of ButtonGroup , including API breaking change - if no hidden values are specified, ButtonGroup.value now returns the text value not a generate string number #178 A widgets properties bg , text_color , text_size , font , width , height can be restored by to their default by setting them to None #181 Slider is now sized properly when orientated vertically #186 Combo and ButtonGroup now support append , insert , remove , clear and depreciated add_option #180 Refactoring of class hierarchy Various bug fixes contributors martinohanlon","title":"0.5.2 - 2018-06-01"},{"location":"changelog/#051-2018-05-14","text":"App , Window , Box now support the following properties and will cascade them to widgets within them: bg text_color text_size font enabled Introduced ListBox Bug fixes relating to bg and text_color causing widgets to change colour when selected Minor bug fixes with CheckBox , Waffle and Combo Documentation fixes and updates contributors to this release martinohanlon , lawsie , Harlekuin","title":"0.5.1 - 2018-05-14"},{"location":"changelog/#050-2018-04-10","text":"v0.5.0 includes significant refactoring of the guizero code base and introduces many new features New image functionality introduced when PIL is installed: images can be passed as Tk.PhotoImage or PIL.Image objects as well as file paths more images types are supported animated images (gifs) are supported images are scaled when the size is changed ButtonGroup - selected is now optional, enabled properties now supported, value_text fixed Fixed multiple App bug Created Window class to support multi-window applications Added multiline and scrollbar functionality to TextBox Refactored guizero to introduce a class hierarchy making guizero wide code changes easier to implement Added the following events to all widgets, this should be considered experimental in this release: when_clicked when_left_button_pressed when_left_button_released when_right_button_pressed when_right_button_released when_key_pressed when_key_released when_mouse_enters when_mouse_leaves when_mouse_dragged Various minor bug fixes Automated tests have been introduced contributors to this release martinohanlon , scotty3785 , IDF31 , drussell1974 - ta very much :)","title":"0.5.0 - 2018-04-10"},{"location":"changelog/#045-2018-03-04","text":"colors can now be specified as either \"red\" , \"#ffffff\" , or (red, green, blue) change Picture image startup parameter to be optional updated Picture and PushButton errors and docs to show that PNG and GIF images can be used in Windows & Linux refactored Waffle resolving bugs that setting properties didnt change its appearance changed waffle so you can reference a pixel using waffle[x,y] added text_color , text_size and font properties to Slider added width and height properties to: Box ButtonGroup CheckBox Combo Picture Slider Text added width property to: TextBox contributors to this release Coal0 , martinohanlon , scotty3785 - :)","title":"0.4.5 - 2018-03-04"},{"location":"changelog/#044-2018-02-12","text":"made PushButton command optional Combo command functions can now have 0 arguments Waffle command functions can now have 0 arguments refactored command functions and added update_command to: ButtonGroup CheckBox Combo PushButton Slider Waffle refactored text_color , text_size and font properties and added them to: ButtonGroup Combo CheckBox PushButton Text TextBox refactored bg (background) and added to: Box ButtonGroup CheckBox Combo Picture PushButton Slider Text TextBox contributors to this release m4ddav3 , Coal0 , lawsie , martinohanlon - :)","title":"0.4.4 - 2018-02-12"},{"location":"changelog/#043-2018-01-10","text":"Minor features, bug fixes and internal refactoring added xspan , yspan to grid layout (Credit: penguintutor ) fixed show() for widgets in a grid layout added master , grid , align and visible properties to widgets added layout property to containers fixed Waffle height (Credit: scotty3785 ) minor doc updates 0.4.2 was never released due to some pypi / wheel problems","title":"0.4.3 - 2018-01-10"},{"location":"changelog/#041-2017-12-28","text":"Bug fixes and deployment test PushButton bug fixes added enabled property to widgets which support Enable / Disable documentation tidy up added build notes to documentation","title":"0.4.1 - 2017-12-28"},{"location":"changelog/#04-2017-12-19","text":"Thank you to everyone who has taken time to contribute code, suggest helpful improvements and report their use of the library. I am extremely grateful to the following people who have contributed pull requests since the last version: bcroston , bennuttall , Coal0 , martinohanlon and scotty3785 I am also very pleased to announce that martinohanlon has very kindly agreed to maintain guizero whilst I am on maternity leave, beginning December 2017. General changes: All classes rewritten with internal Tk objects rather than extending the Tk object, meaning you can access all Tk functionality as Object.tk.tkmethod() (Credit for idea: bennuttall ) Improved use of library with tab complete editors (e.g. ipython) \u2013 only the guizero properties and methods are listed so the list is shorter and more friendly. (Credit for idea: bennuttall ) [Bug fix] Grid layout now lays items out properly. Previously the x and y axes were flipped. (Whoops!) This fix will cause apps with a grid layout to look different, but now behave correctly. You may need to update old code as a result of this change. All classes now inherit from mixins, adding 9 new common methods usable on most widgets - after() , cancel() , destroy() , disable() , enable() , focus() , hide() , show() , repeat() , (Credit: Coal0 and martinohanlon ) The new repeat() method allows you to easily specify a repeated callback to a function, making it extremely easy to perform repetitive actions such as updating the GUI based on readings from a sensor. Documentation and examples have been improved and updated App: New constructor argument bg replaces deprecated bgcolor argument. If both are specified, bg overrides bgcolor . set_title() and bgcolor() methods are now deprecated and have been replaced by title and bg properties New additional properties width and height ButtonGroup: get() and set() methods are now deprecated and have been replaced by the value property New value_text property to get the text associated with the selected option CheckBox: get_text() , get_value() and change_text() methods are now deprecated and have been replaced by the value and text properties New toggle() method added Combo: get() and set() methods are now deprecated and have been replaced by the value property [Bug fix] set_default() now correctly resets the combo back to its originally specified value, whether this was the first option or a specified option Picture: set() method is now deprecated and has been replaced by the value property PushButton: set_text() method is now deprecated and has been replaced by the text property New properties for text_color , bg , font , text_size , height and width \u2013 make your buttons look pretty! Find out whether a button is pressed (1) or released (0) with the new value property New icon() method to set the icon of a button after it is created toggle_state() method deprecated and renamed to toggle() for consistency Slider: New value property for getting and setting the value of the slider Text: New constructor arguments text_color and bg color constructor argument now deprecated and replaced by text_color . If both are specified, text_color overrides color . get() , set() , color() , font_face() and font_size() methods are now deprecated, replaced by properties value , text_color , bg , font and size TextBox: get() and set() methods now deprecated and replaced by value property Waffle: All waffles will now have a memory. The remember constructor argument remains for backwards compatibility only and will be removed in a future release . You can now click on a Waffle, and specify a command to run when the Waffle is clicked on. The function given as the command should take two arguments as it will be passed the x, y coordinates of the pixel that was clicked. (Credit: scotty3785 ) Changed internal implementation of the Waffle so it should now be able to redraw more efficiently. (Credit: scotty3785 )","title":"0.4 - 2017-12-19"},{"location":"checkbox/","text":"CheckBox (Contains a tkinter.Checkbutton object) __init__( self, master, text=\"\", command=None, grid=None, align=None, args=None, visible=True, enabled=None, width=None, height=None) What is it? The CheckBox object displays a check box to allow an option to be ticked or unticked How do I make one? Create a CheckBox object like this: from guizero import App, CheckBox app = App() checkbox = CheckBox(app, text=\"Add extra glitter\") app.display() Starting parameters When you create a CheckBox object you must specify master and text and you can specify any of the optional parameters. Specify parameters in the brackets, like this: checkbox = CheckBox(app, text=\"Add extra glitter\") Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs text string \"\" No The text to display next to the check box align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . command function name None - The name of a function to call when this checkbox is ticked/unticked args list None - If you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in characters or to \"fill\" height size None No Set the height of the widget in characters or to \"fill\" Methods You can call the following methods on a CheckBox object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden toggle() - - Switches the CheckBox to the opposite of its current value. i.e. if it is ticked, untick it and vice versa update_command(command, args =None) command (function name), args ( Optional List of arguments to be passed to command) - Updates the function to call when the checkbox is ticked/unticked change_text(newtext) newtext (string) - Replaced by the text property get_text() - string Replaced by the text property get_value() - int Replaced by the value property Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" master App or Box The container to which this widget belongs text string The text associated with the checkbox value int 1 if the CheckBox is ticked or 0 if it is not ticked visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\" text_size int The size of the text text_color color The colour of the text Refer to a property as <name of widget>.property . For example, if your CheckBox object is called checkbox you would write checkbox.value . You can set the property (for example checkbox.value = 1 ) or get the value of the property to use (for example print(checkbox.value) ). Examples Creating multiple CheckBoxes Create multiple CheckBoxes like this. from guizero import App, CheckBox app = App() glitter = CheckBox(app, text=\"Add glitter\") sparkles = CheckBox(app, text=\"Add sparkles\") app.display() Calling a function when a CheckBox value changes You can call a function when the value of a CheckBox changes (becomes checked or unchecked). In this particular example all three CheckBoxes call the same function, but it is possible for each CheckBox object to call a different function. from guizero import App, Text, CheckBox, TextBox def calculate_extras(): total = 0 if syrup.value == 1: total += 20 if sprinkles.value == 1: total += 10 if cream.value == 1: total += 50 cost.value = total app = App() questions = Text(app, text=\"What would you like with your coffee?\") syrup = CheckBox(app, text=\"Caramel syrup (20p)\", command=calculate_extras) sprinkles = CheckBox(app, text=\"Chocolate sprinkles (10p)\", command=calculate_extras) cream = CheckBox(app, text=\"Whipped cream (50p)\", command=calculate_extras) cost_of_extras = Text(app, text=\"Cost of extras:\") cost = TextBox(app, text=\"0\") app.display()","title":"CheckBox"},{"location":"checkbox/#checkbox","text":"(Contains a tkinter.Checkbutton object) __init__( self, master, text=\"\", command=None, grid=None, align=None, args=None, visible=True, enabled=None, width=None, height=None)","title":"CheckBox"},{"location":"checkbox/#what-is-it","text":"The CheckBox object displays a check box to allow an option to be ticked or unticked","title":"What is it?"},{"location":"checkbox/#how-do-i-make-one","text":"Create a CheckBox object like this: from guizero import App, CheckBox app = App() checkbox = CheckBox(app, text=\"Add extra glitter\") app.display()","title":"How do I make one?"},{"location":"checkbox/#starting-parameters","text":"When you create a CheckBox object you must specify master and text and you can specify any of the optional parameters. Specify parameters in the brackets, like this: checkbox = CheckBox(app, text=\"Add extra glitter\") Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs text string \"\" No The text to display next to the check box align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . command function name None - The name of a function to call when this checkbox is ticked/unticked args list None - If you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in characters or to \"fill\" height size None No Set the height of the widget in characters or to \"fill\"","title":"Starting parameters"},{"location":"checkbox/#methods","text":"You can call the following methods on a CheckBox object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden toggle() - - Switches the CheckBox to the opposite of its current value. i.e. if it is ticked, untick it and vice versa update_command(command, args =None) command (function name), args ( Optional List of arguments to be passed to command) - Updates the function to call when the checkbox is ticked/unticked change_text(newtext) newtext (string) - Replaced by the text property get_text() - string Replaced by the text property get_value() - int Replaced by the value property Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Methods"},{"location":"checkbox/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" master App or Box The container to which this widget belongs text string The text associated with the checkbox value int 1 if the CheckBox is ticked or 0 if it is not ticked visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\" text_size int The size of the text text_color color The colour of the text Refer to a property as <name of widget>.property . For example, if your CheckBox object is called checkbox you would write checkbox.value . You can set the property (for example checkbox.value = 1 ) or get the value of the property to use (for example print(checkbox.value) ).","title":"Properties"},{"location":"checkbox/#examples","text":"Creating multiple CheckBoxes Create multiple CheckBoxes like this. from guizero import App, CheckBox app = App() glitter = CheckBox(app, text=\"Add glitter\") sparkles = CheckBox(app, text=\"Add sparkles\") app.display() Calling a function when a CheckBox value changes You can call a function when the value of a CheckBox changes (becomes checked or unchecked). In this particular example all three CheckBoxes call the same function, but it is possible for each CheckBox object to call a different function. from guizero import App, Text, CheckBox, TextBox def calculate_extras(): total = 0 if syrup.value == 1: total += 20 if sprinkles.value == 1: total += 10 if cream.value == 1: total += 50 cost.value = total app = App() questions = Text(app, text=\"What would you like with your coffee?\") syrup = CheckBox(app, text=\"Caramel syrup (20p)\", command=calculate_extras) sprinkles = CheckBox(app, text=\"Chocolate sprinkles (10p)\", command=calculate_extras) cream = CheckBox(app, text=\"Whipped cream (50p)\", command=calculate_extras) cost_of_extras = Text(app, text=\"Cost of extras:\") cost = TextBox(app, text=\"0\") app.display()","title":"Examples"},{"location":"colors/","text":"Colors (or Colo u rs) You can set colors in guizero using: the name of the color - white a #rgb hex value - #ffffff a list of rgb values - (255,255,255) Colors can be used as either starting parameters e.g. : app = App(bg = \"red\") app = App(bg = \"#ff0000\") app = App(bg = (255, 0, 0)) or as properties e.g. : text = Text(app, text = \"hi\") text.text_color = \"green\" text.text_color = \"#00ff00\" text.text_color = (0, 255, 0) If a color is set using a list of rgb values ( (255,255,255) ) it will be returned as an #rgb hex value ( #ffffff ) Color names Color names can be given as strings e.g. white black red green blue yellow A complete list of color names is available at wiki.tcl.tk/37701 rgb hex value A rgb color value must start with a # and 6 characters following, 2 each for the red, green and blue value in hex. Each value must be 00 - ff e.g. white = #ffffff black = #000000 red = #ff0000 green = #00ff00 blue = #0000ff yellow = #ffff00 You can mix your own color by changing the red, green and blue values. There is a RGB calculator application at https://www.w3schools.com/colors/colors_rgb.asp where you can create your own color and get the #rrggbb value. rgb list The (red, green, blue) list color, must have 3 elements in the order red, green, blue with values 0 - 255 e.g. white = (255, 255, 255) black = (0, 0, 0) red = (255, 0, 0) green = (0, 255, 0) blue = (0, 0, 255) yellow = (255, 255, 0)","title":"Colors"},{"location":"colors/#colors-or-colours","text":"You can set colors in guizero using: the name of the color - white a #rgb hex value - #ffffff a list of rgb values - (255,255,255) Colors can be used as either starting parameters e.g. : app = App(bg = \"red\") app = App(bg = \"#ff0000\") app = App(bg = (255, 0, 0)) or as properties e.g. : text = Text(app, text = \"hi\") text.text_color = \"green\" text.text_color = \"#00ff00\" text.text_color = (0, 255, 0) If a color is set using a list of rgb values ( (255,255,255) ) it will be returned as an #rgb hex value ( #ffffff )","title":"Colors (or Colours)"},{"location":"colors/#color-names","text":"Color names can be given as strings e.g. white black red green blue yellow A complete list of color names is available at wiki.tcl.tk/37701","title":"Color names"},{"location":"colors/#rgb-hex-value","text":"A rgb color value must start with a # and 6 characters following, 2 each for the red, green and blue value in hex. Each value must be 00 - ff e.g. white = #ffffff black = #000000 red = #ff0000 green = #00ff00 blue = #0000ff yellow = #ffff00 You can mix your own color by changing the red, green and blue values. There is a RGB calculator application at https://www.w3schools.com/colors/colors_rgb.asp where you can create your own color and get the #rrggbb value.","title":"rgb hex value"},{"location":"colors/#rgb-list","text":"The (red, green, blue) list color, must have 3 elements in the order red, green, blue with values 0 - 255 e.g. white = (255, 255, 255) black = (0, 0, 0) red = (255, 0, 0) green = (0, 255, 0) blue = (0, 0, 255) yellow = (255, 255, 0)","title":"rgb list"},{"location":"combo/","text":"Combo (Contains a tkinter.OptionMenu object) __init__( self, master, options=[], selected=None, command=None, grid=None, align=None, visible=True, enabled=None, width=None, height=None) What is it? The Combo object displays a drop down box allowing a single option to be selected from a list of options. How do I make one? Create a Combo object like this: from guizero import App, Combo app = App() combo = Combo(app, options=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"]) app.display() Starting parameters When you create a Combo object you must specify a master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: combo = Combo(app, options=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"]) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs options List [] No A list of options to display selected string None No The option to select by default align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . command function name None - The name of a function to call when a different option is selected. This function MUST take either zero or one argument, if the function takes one argument the current value of the Combo will be given. grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in characters or to \"fill\" height size None No Set the height of the widget in characters or to \"fill\" Methods You can call the following methods on a Combo object. Method Takes Returns Description append(option) item (string) - Appends a new option to the end of the Combo. after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command clear() - - Removes all options from the Combo box destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. insert(index, option) index (int), item (string) - Insert a new option in the Combo at index remove(option) item (string) Boolean Removes the first option from the Combo. Returns True if an item was removed. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget select_default() - - Resets the combo box so that the first item is selected show() - - Displays the widget if it was previously hidden update_command(command) command (function name) - Updates the function to call when a different option is selected. add_option(option) option (string) - Adds a new item to the combo box with the value option get() - string Replaced by the value property set(text) text (string) - Replaced by the value property Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" master App or Box The container to which this widget belongs value string The text associated with the currently selected option visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\" text_size int The size of the text text_color color The colour of the text Refer to a property as <name of widget>.property . For example, if your Combo object is called combo you would write combo.value . You can set the property (for example combo.value = \"Chicken\" ) or get the value of the property to use (for example print(combo.value) ). Examples Calling a function when the value selected changes You can call a function when the selected value in a Combo object changes. The function you call can take either zero or one argument, if the function takes one argument it will automatically be passed a string containing the currently selected value from the Combo object. from guizero import App, Text, Combo def you_chose(selected_value): if selected_value == \"Tiny goblet\": result.value = \"You chose...wisely\" else: result.value = \"You chose...poorly\" app = App() instructions = Text(app, text=\"Choose a goblet\") combo = Combo(app, options=[\"\", \"Huge golden goblet\", \"Jewel encrusted goblet\", \"Tiny goblet\"], command=you_chose) result = Text(app) app.display()","title":"Combo"},{"location":"combo/#combo","text":"(Contains a tkinter.OptionMenu object) __init__( self, master, options=[], selected=None, command=None, grid=None, align=None, visible=True, enabled=None, width=None, height=None)","title":"Combo"},{"location":"combo/#what-is-it","text":"The Combo object displays a drop down box allowing a single option to be selected from a list of options.","title":"What is it?"},{"location":"combo/#how-do-i-make-one","text":"Create a Combo object like this: from guizero import App, Combo app = App() combo = Combo(app, options=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"]) app.display()","title":"How do I make one?"},{"location":"combo/#starting-parameters","text":"When you create a Combo object you must specify a master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: combo = Combo(app, options=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"]) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs options List [] No A list of options to display selected string None No The option to select by default align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . command function name None - The name of a function to call when a different option is selected. This function MUST take either zero or one argument, if the function takes one argument the current value of the Combo will be given. grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in characters or to \"fill\" height size None No Set the height of the widget in characters or to \"fill\"","title":"Starting parameters"},{"location":"combo/#methods","text":"You can call the following methods on a Combo object. Method Takes Returns Description append(option) item (string) - Appends a new option to the end of the Combo. after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command clear() - - Removes all options from the Combo box destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. insert(index, option) index (int), item (string) - Insert a new option in the Combo at index remove(option) item (string) Boolean Removes the first option from the Combo. Returns True if an item was removed. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget select_default() - - Resets the combo box so that the first item is selected show() - - Displays the widget if it was previously hidden update_command(command) command (function name) - Updates the function to call when a different option is selected. add_option(option) option (string) - Adds a new item to the combo box with the value option get() - string Replaced by the value property set(text) text (string) - Replaced by the value property Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Methods"},{"location":"combo/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" master App or Box The container to which this widget belongs value string The text associated with the currently selected option visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\" text_size int The size of the text text_color color The colour of the text Refer to a property as <name of widget>.property . For example, if your Combo object is called combo you would write combo.value . You can set the property (for example combo.value = \"Chicken\" ) or get the value of the property to use (for example print(combo.value) ).","title":"Properties"},{"location":"combo/#examples","text":"Calling a function when the value selected changes You can call a function when the selected value in a Combo object changes. The function you call can take either zero or one argument, if the function takes one argument it will automatically be passed a string containing the currently selected value from the Combo object. from guizero import App, Text, Combo def you_chose(selected_value): if selected_value == \"Tiny goblet\": result.value = \"You chose...wisely\" else: result.value = \"You chose...poorly\" app = App() instructions = Text(app, text=\"Choose a goblet\") combo = Combo(app, options=[\"\", \"Huge golden goblet\", \"Jewel encrusted goblet\", \"Tiny goblet\"], command=you_chose) result = Text(app) app.display()","title":"Examples"},{"location":"commands/","text":"Commands Widgets in guizero can be given a command when created, which can be used to call a function when the widget is used. By using commands you can make your GUI change and take actions when the user uses it e.g. clicking a button, selecting an option, typing a message. Example Create an application which puts hello world on the GUI when a button is pressed: from guizero import App, Text, PushButton def say_hello(): text.value = \"hello world\" app = App() text = Text(app) button = PushButton(app, command=say_hello) app.display()","title":"Commands"},{"location":"commands/#commands","text":"Widgets in guizero can be given a command when created, which can be used to call a function when the widget is used. By using commands you can make your GUI change and take actions when the user uses it e.g. clicking a button, selecting an option, typing a message.","title":"Commands"},{"location":"commands/#example","text":"Create an application which puts hello world on the GUI when a button is pressed: from guizero import App, Text, PushButton def say_hello(): text.value = \"hello world\" app = App() text = Text(app) button = PushButton(app, command=say_hello) app.display()","title":"Example"},{"location":"contributing/","text":"Contributing Contibutions are very welcome; be that changes, bug fixing, issue resolution or support. Issues All issues should be raise on github.com/lawsie/guizero/issues Code When providing code changes please: use the dev branch as the base for all changes create a single pull requests for each fix / addition follow the existing coding style provide documentation for all changes as markdown in /docs-src provide tests for all changes in /test","title":"Notes"},{"location":"contributing/#contributing","text":"Contibutions are very welcome; be that changes, bug fixing, issue resolution or support.","title":"Contributing"},{"location":"contributing/#issues","text":"All issues should be raise on github.com/lawsie/guizero/issues","title":"Issues"},{"location":"contributing/#code","text":"When providing code changes please: use the dev branch as the base for all changes create a single pull requests for each fix / addition follow the existing coding style provide documentation for all changes as markdown in /docs-src provide tests for all changes in /test","title":"Code"},{"location":"deployment/","text":"Deploy Notes on how to deploy guizero (on Windows). Prepare Update version number in guizero\\__init__.py Update version number in docs-src\\docs\\about.md Update changelog.md in docs Python library Install locally: cd guizero python setup.py install Build for deployment: cd guizero python setup.py sdist python setup.py bdist_wheel Upload to pypi: cd guizero twine upload dist/* --skip-existing Documents Build: cd guizero/docs-src mkdocs build Copy to docs : cd guizero xcopy docs-src\\site\\* docs /E Promote and tag release on github Push all changes to master . Create a new release on github named 0.0.0 .","title":"Deploying"},{"location":"deployment/#deploy","text":"Notes on how to deploy guizero (on Windows).","title":"Deploy"},{"location":"deployment/#prepare","text":"Update version number in guizero\\__init__.py Update version number in docs-src\\docs\\about.md Update changelog.md in docs","title":"Prepare"},{"location":"deployment/#python-library","text":"Install locally: cd guizero python setup.py install Build for deployment: cd guizero python setup.py sdist python setup.py bdist_wheel Upload to pypi: cd guizero twine upload dist/* --skip-existing","title":"Python library"},{"location":"deployment/#documents","text":"Build: cd guizero/docs-src mkdocs build Copy to docs : cd guizero xcopy docs-src\\site\\* docs /E","title":"Documents"},{"location":"deployment/#promote-and-tag-release-on-github","text":"Push all changes to master . Create a new release on github named 0.0.0 .","title":"Promote and tag release on github"},{"location":"development/","text":"Development Notes on how to develop guizero (on Windows). Setup Upgrade pip: python.exe -m pip install pip --upgrade Install / upgrade pre-requisites: pip install mkdocs wheel twine virtualenv pytest pillow --upgrade Python library Create a virtual environment (not essential, but a good idea!): virtualenv guizero-[versionno] cd guizero-[versionno] Activate your virtual environment: Scripts\\activate Checkout and install guizero for development: git clone https://github.com/lawsie/guizero cd guizero git checkout dev python setup.py develop When you have finished your development, deactivate your virtual environment: Scripts\\deactivate Tests To run the automated tests: cd guizero\\test pytest -v If running the tests inside a virtual environment you will need to install pytest in that virtual enviroment. pip install pytest Note - tkinter can error when running the tests usually when the interpreter doesn't start properly, it doesnt seem to like being initialised and destroyed hundreds of times, I suspect a file locking issue as you dont see the problem on Linux. So sometimes you might get a test fail with an error like This probably means that tk wasn't installed properly. . Just re-run the last failed errors! pytest --lf -v Documents Test documents by serving up MkDocs: cd guizero\\docs-src mkdocs serve Open http://127.0.0.1:8000/","title":"Developing"},{"location":"development/#development","text":"Notes on how to develop guizero (on Windows).","title":"Development"},{"location":"development/#setup","text":"Upgrade pip: python.exe -m pip install pip --upgrade Install / upgrade pre-requisites: pip install mkdocs wheel twine virtualenv pytest pillow --upgrade","title":"Setup"},{"location":"development/#python-library","text":"Create a virtual environment (not essential, but a good idea!): virtualenv guizero-[versionno] cd guizero-[versionno] Activate your virtual environment: Scripts\\activate Checkout and install guizero for development: git clone https://github.com/lawsie/guizero cd guizero git checkout dev python setup.py develop When you have finished your development, deactivate your virtual environment: Scripts\\deactivate","title":"Python library"},{"location":"development/#tests","text":"To run the automated tests: cd guizero\\test pytest -v If running the tests inside a virtual environment you will need to install pytest in that virtual enviroment. pip install pytest Note - tkinter can error when running the tests usually when the interpreter doesn't start properly, it doesnt seem to like being initialised and destroyed hundreds of times, I suspect a file locking issue as you dont see the problem on Linux. So sometimes you might get a test fail with an error like This probably means that tk wasn't installed properly. . Just re-run the last failed errors! pytest --lf -v","title":"Tests"},{"location":"development/#documents","text":"Test documents by serving up MkDocs: cd guizero\\docs-src mkdocs serve Open http://127.0.0.1:8000/","title":"Documents"},{"location":"drawing/","text":"Drawing (Contains a tkinter.canvas object) __init__( self, master, width=100, height=100, grid=None, align=None, visible=True, enabled=None) What is it? The Drawing object allows shapes, images and text to be created. How do I make one? Create a Drawing object and draw a blue rectangle 50x50 pixels like this: from guizero import App, Drawing app = App() drawing = Drawing(app) drawing.rectangle(10, 10, 60, 60, color=\"blue\") app.display() Starting parameters When you create a Drawing object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: drawing = Drawing(app, height=300, width=300) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs width size None No Set the width of the widget in characters or to \"fill\" height size None No Set the height of the widget in characters or to \"fill\" grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master Methods You can call the following methods on a Drawing object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command clear() - - Clears the drawing delete() id (int) - - Deletes an \"object\" (line, triangle, image, etc) from the drawing. destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. image(self, x, y, image, width=None, height=None): x (int), y (int), image (str), width (int), height (int) Id Inserts an image into the drawing at the specified position and returns the id of the image created. line(x1, y1, x2, y2, color=\"black\", width=1) x1 (int), y1 (int), x2 (int), y2 (int), color (str), width (int) Id Draws a line between 2 points and returns the id of the line created. oval(x1, y1, x2, y2, color=\"black\", outline=False, outline_color=\"black\") x1 (int), y1 (int), x2 (int), y2 (int), color (str), outline (int), outline_color (str) Id Draws an oval between 2 points and returns the id of the shape created. polygon(*coords, color=\"black\", outline=False, outline_color=\"black\") coords (list int), color (str), outline (int), outline_color (str) Id Draws a polygon between any number of coordinates passed as pairs of x, y and returns the id of the shape created. rectangle(x1, y1, x2, y2, color=\"black\", outline=False, outline_color=\"black\") x1 (int), y1 (int), x2 (int), y2 (int), color (str), outline (int), outline_color (str) Id Draws a rectangle between 2 points and returns the id of the shape created. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden text(x, y, text, color=\"black\", font=None, size=None, max_width=None) x (int), y (int), text (str), color (str), font (str), size (str), max_width (int) Id Inserts text into the drawing at the specified position and returns the id of the shape created. triangle(x1, y1, x2, y2, x3, y3, color=\"black\", outline=False, outline_color=\"black\") x1 (int), y1 (int), x2 (int), y2 (int), x3 (int), y3 (int), color (str), outline (int), outline_color (str) Id Draws a triangle between 3 points and returns the id of the shape created. update_command(command) command (function name) - Updates the function to call when a different option is selected. Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" master App or Box The container to which this widget belongs visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\" Refer to a property as <name of widget>.property . For example, if your Drawing object is called drawing you would write drawing.bg . You can set the property (for example drawing.bg = \"blue\" ) or get the value of the property to use (for example print(drawing.bg) ). Examples Draw a robot face Use a rectangle for the face, ovals for the eyes, a triangle for the nose and lines for the mouth. from guizero import App, Drawing a = App() # create drawing object d = Drawing(a, width=220, height=220) d.rectangle(10, 10, 210, 210, color=\"light blue\") d.oval(30, 30, 50, 50, color=\"white\", outline=True) d.oval(170, 30, 190, 50, color=\"white\", outline=True) d.triangle(110, 90, 120, 110, 100, 110, color=\"black\") d.line(50, 180, 50, 160, color=\"red\", width=5) d.line(50, 180, 170, 180, color=\"red\", width=5) d.line(170, 180, 170, 160, color=\"red\", width=5) a.display()","title":"Drawing"},{"location":"drawing/#drawing","text":"(Contains a tkinter.canvas object) __init__( self, master, width=100, height=100, grid=None, align=None, visible=True, enabled=None)","title":"Drawing"},{"location":"drawing/#what-is-it","text":"The Drawing object allows shapes, images and text to be created.","title":"What is it?"},{"location":"drawing/#how-do-i-make-one","text":"Create a Drawing object and draw a blue rectangle 50x50 pixels like this: from guizero import App, Drawing app = App() drawing = Drawing(app) drawing.rectangle(10, 10, 60, 60, color=\"blue\") app.display()","title":"How do I make one?"},{"location":"drawing/#starting-parameters","text":"When you create a Drawing object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: drawing = Drawing(app, height=300, width=300) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs width size None No Set the width of the widget in characters or to \"fill\" height size None No Set the height of the widget in characters or to \"fill\" grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master","title":"Starting parameters"},{"location":"drawing/#methods","text":"You can call the following methods on a Drawing object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command clear() - - Clears the drawing delete() id (int) - - Deletes an \"object\" (line, triangle, image, etc) from the drawing. destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. image(self, x, y, image, width=None, height=None): x (int), y (int), image (str), width (int), height (int) Id Inserts an image into the drawing at the specified position and returns the id of the image created. line(x1, y1, x2, y2, color=\"black\", width=1) x1 (int), y1 (int), x2 (int), y2 (int), color (str), width (int) Id Draws a line between 2 points and returns the id of the line created. oval(x1, y1, x2, y2, color=\"black\", outline=False, outline_color=\"black\") x1 (int), y1 (int), x2 (int), y2 (int), color (str), outline (int), outline_color (str) Id Draws an oval between 2 points and returns the id of the shape created. polygon(*coords, color=\"black\", outline=False, outline_color=\"black\") coords (list int), color (str), outline (int), outline_color (str) Id Draws a polygon between any number of coordinates passed as pairs of x, y and returns the id of the shape created. rectangle(x1, y1, x2, y2, color=\"black\", outline=False, outline_color=\"black\") x1 (int), y1 (int), x2 (int), y2 (int), color (str), outline (int), outline_color (str) Id Draws a rectangle between 2 points and returns the id of the shape created. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden text(x, y, text, color=\"black\", font=None, size=None, max_width=None) x (int), y (int), text (str), color (str), font (str), size (str), max_width (int) Id Inserts text into the drawing at the specified position and returns the id of the shape created. triangle(x1, y1, x2, y2, x3, y3, color=\"black\", outline=False, outline_color=\"black\") x1 (int), y1 (int), x2 (int), y2 (int), x3 (int), y3 (int), color (str), outline (int), outline_color (str) Id Draws a triangle between 3 points and returns the id of the shape created. update_command(command) command (function name) - Updates the function to call when a different option is selected.","title":"Methods"},{"location":"drawing/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" master App or Box The container to which this widget belongs visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\" Refer to a property as <name of widget>.property . For example, if your Drawing object is called drawing you would write drawing.bg . You can set the property (for example drawing.bg = \"blue\" ) or get the value of the property to use (for example print(drawing.bg) ).","title":"Properties"},{"location":"drawing/#examples","text":"Draw a robot face Use a rectangle for the face, ovals for the eyes, a triangle for the nose and lines for the mouth. from guizero import App, Drawing a = App() # create drawing object d = Drawing(a, width=220, height=220) d.rectangle(10, 10, 210, 210, color=\"light blue\") d.oval(30, 30, 50, 50, color=\"white\", outline=True) d.oval(170, 30, 190, 50, color=\"white\", outline=True) d.triangle(110, 90, 120, 110, 100, 110, color=\"black\") d.line(50, 180, 50, 160, color=\"red\", width=5) d.line(50, 180, 170, 180, color=\"red\", width=5) d.line(170, 180, 170, 160, color=\"red\", width=5) a.display()","title":"Examples"},{"location":"events/","text":"Events Warning - events are currently experimental, issues maybe experienced and the API may change. . Custom events can be added to guizero widgets to call functions when the user takes the following actions: when clicked - when_clicked when the left mouse button is pressed - when_left_button_pressed when the left mouse button is released - when_left_button_released when the right mouse button is pressed - when_right_button_pressed when the right mouse button is released - when_right_button_released when a key is pressed - when_key_pressed when a key is released - when_key_released when the mouse enters a widget - when_mouse_enters when the mouse leaves a widget - when_mouse_leaves when the mouse is dragged across a widget - when_mouse_dragged Events are set by assigning them to a function: def clicked(): print(\"clicked\") widget.when_clicked = clicked Event Data The function which is called can also accept a parameter and will be passed data about the event which occured. The event data returned has: widget - the guizero widget which raised the event tk_event - the tkinter event object key - the key which raised the event x - the mouse's x position relative to the widget when the event occured y - the mouse's y position relative to the widget when the event occured display_x - the mouse's x position on the display when the event occured display_y - the mouse's y position on the display when the event occured def clicked(event_data): print(\"widget clicked = \" + event_data.widget) print(\"mouse position = \" + event_data.x + \".\" + event_data.y) widget.when_clicked = clicked Example Highlight a text box widget by changing its background color ( bg ) when the mouse is hovering over it. from guizero import App, TextBox def highlight(): text_box.bg = \"lightblue\" def lowlight(): text_box.bg = \"white\" app = App() text_box = TextBox(app) # when the mouse enters the textbox text_box.when_mouse_enters = highlight # when the mouse leaves the textbox text_box.when_mouse_leaves = lowlight app.display()","title":"Events"},{"location":"events/#events","text":"Warning - events are currently experimental, issues maybe experienced and the API may change. . Custom events can be added to guizero widgets to call functions when the user takes the following actions: when clicked - when_clicked when the left mouse button is pressed - when_left_button_pressed when the left mouse button is released - when_left_button_released when the right mouse button is pressed - when_right_button_pressed when the right mouse button is released - when_right_button_released when a key is pressed - when_key_pressed when a key is released - when_key_released when the mouse enters a widget - when_mouse_enters when the mouse leaves a widget - when_mouse_leaves when the mouse is dragged across a widget - when_mouse_dragged Events are set by assigning them to a function: def clicked(): print(\"clicked\") widget.when_clicked = clicked","title":"Events"},{"location":"events/#event-data","text":"The function which is called can also accept a parameter and will be passed data about the event which occured. The event data returned has: widget - the guizero widget which raised the event tk_event - the tkinter event object key - the key which raised the event x - the mouse's x position relative to the widget when the event occured y - the mouse's y position relative to the widget when the event occured display_x - the mouse's x position on the display when the event occured display_y - the mouse's y position on the display when the event occured def clicked(event_data): print(\"widget clicked = \" + event_data.widget) print(\"mouse position = \" + event_data.x + \".\" + event_data.y) widget.when_clicked = clicked","title":"Event Data"},{"location":"events/#example","text":"Highlight a text box widget by changing its background color ( bg ) when the mouse is hovering over it. from guizero import App, TextBox def highlight(): text_box.bg = \"lightblue\" def lowlight(): text_box.bg = \"white\" app = App() text_box = TextBox(app) # when the mouse enters the textbox text_box.when_mouse_enters = highlight # when the mouse leaves the textbox text_box.when_mouse_leaves = lowlight app.display()","title":"Example"},{"location":"gettinghelp/","text":"Getting help You may encounter a problem when using guizero, so here are some ways you can get help to solve your problem. Getting help If you have a question about your guizero program it is a good idea to join a community to ask for support: Raspberry Pi Forums - some people post questions about guizero on these forums and other members of the community step in to help. The creators of guizero periodically check the Python forum. Stack Overflow - a popular site for techy questions Computing at School - a useful site for teachers If you would like to read guides and resources for guizero there are many freely available: Getting started with GUIs - a beginners guide to guizero by the Raspberry Pi Foundation Python guizero video - a series of videos by Devon Schafer on using guizero. Example programs - some example programs to get you going. Using guizero with hardware - Ben Nuttall's projects using guizero combined with hardware Cat name generator - materials for a kids workshop, first run at the Cotswold Jam Name your pet - article on page 42 of Hello World magazine issue 2. Bugs and feature requests Like many Python libraries, guizero has a GitHub repository where you can add issues. These issues come under two headings: You found a bug in guizero You would like to request we consider including a new feature We look at and respond to all issues created on GitHub. However, we ask that you only create issues for bugs and feature requests, rather than support, as we do not have time to answer everything :)","title":"Getting help"},{"location":"gettinghelp/#getting-help","text":"You may encounter a problem when using guizero, so here are some ways you can get help to solve your problem.","title":"Getting help"},{"location":"gettinghelp/#getting-help_1","text":"If you have a question about your guizero program it is a good idea to join a community to ask for support: Raspberry Pi Forums - some people post questions about guizero on these forums and other members of the community step in to help. The creators of guizero periodically check the Python forum. Stack Overflow - a popular site for techy questions Computing at School - a useful site for teachers If you would like to read guides and resources for guizero there are many freely available: Getting started with GUIs - a beginners guide to guizero by the Raspberry Pi Foundation Python guizero video - a series of videos by Devon Schafer on using guizero. Example programs - some example programs to get you going. Using guizero with hardware - Ben Nuttall's projects using guizero combined with hardware Cat name generator - materials for a kids workshop, first run at the Cotswold Jam Name your pet - article on page 42 of Hello World magazine issue 2.","title":"Getting help"},{"location":"gettinghelp/#bugs-and-feature-requests","text":"Like many Python libraries, guizero has a GitHub repository where you can add issues. These issues come under two headings: You found a bug in guizero You would like to request we consider including a new feature We look at and respond to all issues created on GitHub. However, we ask that you only create issues for bugs and feature requests, rather than support, as we do not have time to answer everything :)","title":"Bugs and feature requests"},{"location":"images/","text":"Images Widgets such as Picture and PushButton allow you to use images in your GUI. from guizero import App, Picture app = App() picture = Picture(app, image=\"test.gif\") app.display() The types of image (GIF, JPG, PNG, etc) supported depend on how you installed guizero and the setup of your computer. Supported files types All systems support the GIF file type. Windows and Linux also support PNG files. If you installed the addition image features using pip it will also have installed PIL (Python Imaging Library) and you will be able use the majority of commonly used image types. guizero will tell you what file types are supported on your computer using the following code: from guizero import system_config print(system_config.supported_image_types) Operating System PIL NOT available PIL available Windows GIF, PNG GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF MacOS GIF GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF Linux GIF, PNG GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF Raspbian GIF, PNG GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF Resizing When the size of a widget is changed the image will be changed to fit the widget, if PIL is available the image will be scaled correctly, if not the image will be cropped. Animated GIFs If PIL is installed guizero supports displaying animated GIFs, if not, the GIF will be displayed as a static image.","title":"Images"},{"location":"images/#images","text":"Widgets such as Picture and PushButton allow you to use images in your GUI. from guizero import App, Picture app = App() picture = Picture(app, image=\"test.gif\") app.display() The types of image (GIF, JPG, PNG, etc) supported depend on how you installed guizero and the setup of your computer.","title":"Images"},{"location":"images/#supported-files-types","text":"All systems support the GIF file type. Windows and Linux also support PNG files. If you installed the addition image features using pip it will also have installed PIL (Python Imaging Library) and you will be able use the majority of commonly used image types. guizero will tell you what file types are supported on your computer using the following code: from guizero import system_config print(system_config.supported_image_types) Operating System PIL NOT available PIL available Windows GIF, PNG GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF MacOS GIF GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF Linux GIF, PNG GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF Raspbian GIF, PNG GIF, Animated GIF, BMP, ICO, PNG, JPG, TIF","title":"Supported files types"},{"location":"images/#resizing","text":"When the size of a widget is changed the image will be changed to fit the widget, if PIL is available the image will be scaled correctly, if not the image will be cropped.","title":"Resizing"},{"location":"images/#animated-gifs","text":"If PIL is installed guizero supports displaying animated GIFs, if not, the GIF will be displayed as a static image.","title":"Animated GIFs"},{"location":"layout/","text":"Layouts The layout of your GUI is how you arrange the widgets in the window. Widgets can be arranged into \"containers\" (e.g. App , Window , Box ) using either of these layouts: auto - where widgets are positioned automatically grid - you specify where in a grid each widget should be positioned The layout is set using layout parameter of the container e.g. app = App(layout=\"auto\") app = App(layout=\"grid\") If no layout parameter is specified, the default auto layout is used. Auto layout auto is the default layout used when a container is created. All widgets will be arranged in the order they are created and aligned to the centre, e.g. the following code will create two Text widgets, one on top of the other. from guizero import App, Text app = App() text_1 = Text(app, text=\"on top\") text_2 = Text(app, text=\"below\") app.display() Aligning Widgets can be aligned to either the top , bottom , left or right , using the align property when created. Aligning Widgets will cause them to be \"stuck\" to that side of the container e.g. from guizero import App, Text app = App() top_text = Text(app, text=\"at the top\", align=\"top\") bottom_text = Text(app, text=\"at the bottom\", align=\"bottom\") left_text = Text(app, text=\"to the left\", align=\"left\") right_text = Text(app, text=\"to the right\", align=\"right\") app.display() By aligning multiple widgets to the same side of the container, widgets can be made to stack together e.g. from guizero import App, Text, TextBox, PushButton app = App() text = Text(app, text=\"label\", align=\"left\") text_box = TextBox(app, text=\"enter text\", align=\"left\") button = PushButton(app, text=\"submit\", align=\"left\") app.display() The widgets will stack in the order they are created, so the widget created first will be closest to the edge in the direction specified. Filling Widgets can also be made to \"fill\" all the available space by setting the width and height parameters to fill . e.g. A TextBox could span the entire width of the container: from guizero import App, TextBox app = App() text_box = TextBox(app, text=\"enter text\", width=\"fill\") app.display() Or a ListBox could fill the left hand side by using fill for the height and align to the left e.g. from guizero import App, ListBox app = App() list_box = ListBox(app, items=[\"a list\"], height=\"fill\", align=\"left\") app.display() Using fill for the width and the height will make a widget use all the available space e.g. from guizero import App, PushButton app = App() button = PushButton(app, width=\"fill\", height=\"fill\") app.display() When multiple widgets use fill the Window Manager (operating system) will distribute the space accordingly between all the widgets which need to fill it. from guizero import App, ListBox, PushButton app = App() list_box = ListBox(app, items=[\"a list\", \"of items\", \"yay\"], height=\"fill\", align=\"left\") button = PushButton(app, width=\"fill\", height=\"fill\", align=\"right\") app.display() Note : Using fill may not always have the effect you are expecting as it is up to the operating system to distribute screen space. Grid layout The grid layout allows you to position widgets into a virtual grid. When you create a widget you will need to pass an extra parameter called grid which is a list containing [x,y] coordinates for where you want the widget to appear, like this: app = App(layout=\"grid\") text = Text(app, text=\"Hello world\", grid=[0,1]) There is no need to specify the width or height of the grid you want - it will expand depending on the coordinates you provide with each widget. However, grid cells containing no objects will have no height or width. This is really useful when creating GUIs where you want widgets to line up. e.g. Creating a number keypad: from guizero import App, PushButton app = App(layout=\"grid\") button1 = PushButton(app, text=\"1\", grid=[0,0]) button2 = PushButton(app, text=\"2\", grid=[1,0]) button3 = PushButton(app, text=\"3\", grid=[2,0]) button4 = PushButton(app, text=\"4\", grid=[0,1]) button5 = PushButton(app, text=\"5\", grid=[1,1]) button6 = PushButton(app, text=\"6\", grid=[2,1]) button7 = PushButton(app, text=\"7\", grid=[0,2]) button8 = PushButton(app, text=\"8\", grid=[1,2]) button9 = PushButton(app, text=\"9\", grid=[2,2]) button0 = PushButton(app, text=\"0\", grid=[1,3]) app.display() You can also align widgets within the grid, e.g. when you are creating a form: from guizero import App, Text, TextBox app = App(layout=\"grid\") name_label = Text(app, text=\"Name\", grid=[0,0], align=\"left\") name = TextBox(app, grid=[1,0]) surname_label = Text(app, text=\"Surname\", grid=[0,1], align=\"left\") surname = TextBox(app, grid=[1,1]) dob_label = Text(app, text=\"Date of Birth\", grid=[0,2], align=\"left\") dob = TextBox(app, grid=[1,2]) app.display() Spanning columns or rows Widgets can be made to span multiple columns or rows by specifying the span within the grid parameter. These are optional, but if specified both must be included using the format [x,y,xspan,yspan] . The example below shows text widget located at 0,1 spanning two columns (x) and one row (y): text = Text(app, text=\"Hello world\", grid=[0,1,2,1]) This can be used to include widgets of different sizes arranged alongside each other. from guizero import App, Picture app = App(layout=\"grid\") picture1 = Picture(app, image=\"std1.gif\", grid=[0,0]) picture2 = Picture(app, image=\"std2.gif\", grid=[1,0]) picture3 = Picture(app, image=\"tall1.gif\", grid=[2,0,1,2]) picture4 = Picture(app, image=\"wide1.gif\", grid=[0,1,2,1]) app.display() Boxes By using a Box widget you can segment your GUI into different sections allowing you to lay out your user interface in any way you want. code for example above If you wanted to create a title in the top left hand corner of your GUI, you could use a Box which fills the top of the App and put a Text widget inside aligned to the left . from guizero import App, Box, Text app = App() title_box = Box(app, width=\"fill\", align=\"top\") title = Text(title_box, text=\"title\", align=\"left\") app.display() You may find it easier to design your layout if your Boxes have borders, which can be done by setting the border parameter on Box to True . title_box = Box(app, width=\"fill\", align=\"top\", border=True) A similar method can be used to put \"OK\" and \"Cancel\" buttons at the bottom right of the GUI. Remember that the widgets will get stacked on the right in order of creation, so the cancel button is created first. from guizero import App, Box, PushButton app = App() buttons_box = Box(app, width=\"fill\", align=\"bottom\") cancel = PushButton(buttons_box, text=\"Cancel\", align=\"right\") ok = PushButton(buttons_box, text=\"OK\", align=\"right\") app.display() Note : A Box can also be contained in a Box , allowing you to layer boxes and position your widgets. Tip : When creating a GUI you may find it easier to design it first on paper, noting where your boxes will be positioned.","title":"Layouts"},{"location":"layout/#layouts","text":"The layout of your GUI is how you arrange the widgets in the window. Widgets can be arranged into \"containers\" (e.g. App , Window , Box ) using either of these layouts: auto - where widgets are positioned automatically grid - you specify where in a grid each widget should be positioned The layout is set using layout parameter of the container e.g. app = App(layout=\"auto\") app = App(layout=\"grid\") If no layout parameter is specified, the default auto layout is used.","title":"Layouts"},{"location":"layout/#auto-layout","text":"auto is the default layout used when a container is created. All widgets will be arranged in the order they are created and aligned to the centre, e.g. the following code will create two Text widgets, one on top of the other. from guizero import App, Text app = App() text_1 = Text(app, text=\"on top\") text_2 = Text(app, text=\"below\") app.display()","title":"Auto layout"},{"location":"layout/#aligning","text":"Widgets can be aligned to either the top , bottom , left or right , using the align property when created. Aligning Widgets will cause them to be \"stuck\" to that side of the container e.g. from guizero import App, Text app = App() top_text = Text(app, text=\"at the top\", align=\"top\") bottom_text = Text(app, text=\"at the bottom\", align=\"bottom\") left_text = Text(app, text=\"to the left\", align=\"left\") right_text = Text(app, text=\"to the right\", align=\"right\") app.display() By aligning multiple widgets to the same side of the container, widgets can be made to stack together e.g. from guizero import App, Text, TextBox, PushButton app = App() text = Text(app, text=\"label\", align=\"left\") text_box = TextBox(app, text=\"enter text\", align=\"left\") button = PushButton(app, text=\"submit\", align=\"left\") app.display() The widgets will stack in the order they are created, so the widget created first will be closest to the edge in the direction specified.","title":"Aligning"},{"location":"layout/#filling","text":"Widgets can also be made to \"fill\" all the available space by setting the width and height parameters to fill . e.g. A TextBox could span the entire width of the container: from guizero import App, TextBox app = App() text_box = TextBox(app, text=\"enter text\", width=\"fill\") app.display() Or a ListBox could fill the left hand side by using fill for the height and align to the left e.g. from guizero import App, ListBox app = App() list_box = ListBox(app, items=[\"a list\"], height=\"fill\", align=\"left\") app.display() Using fill for the width and the height will make a widget use all the available space e.g. from guizero import App, PushButton app = App() button = PushButton(app, width=\"fill\", height=\"fill\") app.display() When multiple widgets use fill the Window Manager (operating system) will distribute the space accordingly between all the widgets which need to fill it. from guizero import App, ListBox, PushButton app = App() list_box = ListBox(app, items=[\"a list\", \"of items\", \"yay\"], height=\"fill\", align=\"left\") button = PushButton(app, width=\"fill\", height=\"fill\", align=\"right\") app.display() Note : Using fill may not always have the effect you are expecting as it is up to the operating system to distribute screen space.","title":"Filling"},{"location":"layout/#grid-layout","text":"The grid layout allows you to position widgets into a virtual grid. When you create a widget you will need to pass an extra parameter called grid which is a list containing [x,y] coordinates for where you want the widget to appear, like this: app = App(layout=\"grid\") text = Text(app, text=\"Hello world\", grid=[0,1]) There is no need to specify the width or height of the grid you want - it will expand depending on the coordinates you provide with each widget. However, grid cells containing no objects will have no height or width. This is really useful when creating GUIs where you want widgets to line up. e.g. Creating a number keypad: from guizero import App, PushButton app = App(layout=\"grid\") button1 = PushButton(app, text=\"1\", grid=[0,0]) button2 = PushButton(app, text=\"2\", grid=[1,0]) button3 = PushButton(app, text=\"3\", grid=[2,0]) button4 = PushButton(app, text=\"4\", grid=[0,1]) button5 = PushButton(app, text=\"5\", grid=[1,1]) button6 = PushButton(app, text=\"6\", grid=[2,1]) button7 = PushButton(app, text=\"7\", grid=[0,2]) button8 = PushButton(app, text=\"8\", grid=[1,2]) button9 = PushButton(app, text=\"9\", grid=[2,2]) button0 = PushButton(app, text=\"0\", grid=[1,3]) app.display() You can also align widgets within the grid, e.g. when you are creating a form: from guizero import App, Text, TextBox app = App(layout=\"grid\") name_label = Text(app, text=\"Name\", grid=[0,0], align=\"left\") name = TextBox(app, grid=[1,0]) surname_label = Text(app, text=\"Surname\", grid=[0,1], align=\"left\") surname = TextBox(app, grid=[1,1]) dob_label = Text(app, text=\"Date of Birth\", grid=[0,2], align=\"left\") dob = TextBox(app, grid=[1,2]) app.display()","title":"Grid layout"},{"location":"layout/#spanning-columns-or-rows","text":"Widgets can be made to span multiple columns or rows by specifying the span within the grid parameter. These are optional, but if specified both must be included using the format [x,y,xspan,yspan] . The example below shows text widget located at 0,1 spanning two columns (x) and one row (y): text = Text(app, text=\"Hello world\", grid=[0,1,2,1]) This can be used to include widgets of different sizes arranged alongside each other. from guizero import App, Picture app = App(layout=\"grid\") picture1 = Picture(app, image=\"std1.gif\", grid=[0,0]) picture2 = Picture(app, image=\"std2.gif\", grid=[1,0]) picture3 = Picture(app, image=\"tall1.gif\", grid=[2,0,1,2]) picture4 = Picture(app, image=\"wide1.gif\", grid=[0,1,2,1]) app.display()","title":"Spanning columns or rows"},{"location":"layout/#boxes","text":"By using a Box widget you can segment your GUI into different sections allowing you to lay out your user interface in any way you want. code for example above If you wanted to create a title in the top left hand corner of your GUI, you could use a Box which fills the top of the App and put a Text widget inside aligned to the left . from guizero import App, Box, Text app = App() title_box = Box(app, width=\"fill\", align=\"top\") title = Text(title_box, text=\"title\", align=\"left\") app.display() You may find it easier to design your layout if your Boxes have borders, which can be done by setting the border parameter on Box to True . title_box = Box(app, width=\"fill\", align=\"top\", border=True) A similar method can be used to put \"OK\" and \"Cancel\" buttons at the bottom right of the GUI. Remember that the widgets will get stacked on the right in order of creation, so the cancel button is created first. from guizero import App, Box, PushButton app = App() buttons_box = Box(app, width=\"fill\", align=\"bottom\") cancel = PushButton(buttons_box, text=\"Cancel\", align=\"right\") ok = PushButton(buttons_box, text=\"OK\", align=\"right\") app.display() Note : A Box can also be contained in a Box , allowing you to layer boxes and position your widgets. Tip : When creating a GUI you may find it easier to design it first on paper, noting where your boxes will be positioned.","title":"Boxes"},{"location":"listbox/","text":"ListBox (Contains a tkinter.Listbox object) __init__( self, master, items=None, selected=None, command=None, grid=None, align=None, visible=True, enabled=None, multiselect=False, scrollbar=False, width=None, height=None) What is it? The ListBox object displays a list of items from which either single or multiple items can be selected. How do I make one? Create a ListBox object like this: from guizero import App, ListBox app = App() listbox = ListBox(app, items=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"]) app.display() Starting parameters When you create a ListBox object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: listbox = ListBox(app, items=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"]) If you want the ListBox to allow multiple items to be selected you must set the multiselect optional parameter to True : listbox = ListBox(app, multiselect=True) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs selected string or List None No The item or items to select by default items List - Yes A list of items to display align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . command function name None - The name of a function to call when a different option is selected. This function MUST take either zero or one argument, if the function takes one argument the current value of the ListBox will be given. grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master multiselect boolean False No If the widget should allow multiple items to be selected. scrollbar boolean False No If the widget should have a verticle scrollbar. width size None No Set the width of the widget in pixels or to \"fill\" height size None No Set the height of the widget in pixels or to \"fill\" Methods You can call the following methods on a ListBox object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) append(item) item (string) - Appends a new item to the end of the ListBox. cancel(command) command (function name) - Cancels a scheduled call to command clear() - - Clears all the items in a ListBox destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. insert(index, item) index (int), item (string) - Insert a new item in the ListBox at index remove(item) item (string) Boolean Removes the first item from the ListBox. Returns True if an item was removed. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden update_command(command) command (function name) - Updates the function to call when a different option is selected. Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in pixels or to \"fill\" items List Returns a list of items in the ListBox master App or Box The container to which this widget belongs value string Sets or returns the items selected in a ListBox. Returns None if 0 items are selected. If the ListBox is a not multiselect , value is the item selected, if the ListBox is a multiselect , value is a list of items selected. visible boolean If this widget is visible width size Set the width of the widget in pixels or to \"fill\" text_size int The size of the text text_color color The colour of the text Refer to a property as <name of widget>.property . For example, if your ListBox object is called listbox you would write listbox.value . You can set the property (for example listbox.value = \"Chicken\" ) or get the value of the property to use (for example print(listbox.value) ). Examples Select a text color from a ListBox When an item in the ListBox is selected a function will be called to change the color of the text. from guizero import App, ListBox, Text def change_color(value): t.text_color = value a = App() t = Text(a, text=\"Its a ListBox\", color=\"black\") listbox = ListBox( a, items=[\"red\", \"green\", \"blue\", \"yellow\", \"purple\", \"turquoise\", \"pink\", \"orange\", \"black\", \"brown\", \"cyan\"], selected=\"black\", command=change_color, scrollbar=True) a.display()","title":"ListBox"},{"location":"listbox/#listbox","text":"(Contains a tkinter.Listbox object) __init__( self, master, items=None, selected=None, command=None, grid=None, align=None, visible=True, enabled=None, multiselect=False, scrollbar=False, width=None, height=None)","title":"ListBox"},{"location":"listbox/#what-is-it","text":"The ListBox object displays a list of items from which either single or multiple items can be selected.","title":"What is it?"},{"location":"listbox/#how-do-i-make-one","text":"Create a ListBox object like this: from guizero import App, ListBox app = App() listbox = ListBox(app, items=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"]) app.display()","title":"How do I make one?"},{"location":"listbox/#starting-parameters","text":"When you create a ListBox object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: listbox = ListBox(app, items=[\"Beef\", \"Chicken\", \"Fish\", \"Vegetarian\"]) If you want the ListBox to allow multiple items to be selected you must set the multiselect optional parameter to True : listbox = ListBox(app, multiselect=True) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs selected string or List None No The item or items to select by default items List - Yes A list of items to display align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . command function name None - The name of a function to call when a different option is selected. This function MUST take either zero or one argument, if the function takes one argument the current value of the ListBox will be given. grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master multiselect boolean False No If the widget should allow multiple items to be selected. scrollbar boolean False No If the widget should have a verticle scrollbar. width size None No Set the width of the widget in pixels or to \"fill\" height size None No Set the height of the widget in pixels or to \"fill\"","title":"Starting parameters"},{"location":"listbox/#methods","text":"You can call the following methods on a ListBox object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) append(item) item (string) - Appends a new item to the end of the ListBox. cancel(command) command (function name) - Cancels a scheduled call to command clear() - - Clears all the items in a ListBox destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. insert(index, item) index (int), item (string) - Insert a new item in the ListBox at index remove(item) item (string) Boolean Removes the first item from the ListBox. Returns True if an item was removed. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden update_command(command) command (function name) - Updates the function to call when a different option is selected.","title":"Methods"},{"location":"listbox/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in pixels or to \"fill\" items List Returns a list of items in the ListBox master App or Box The container to which this widget belongs value string Sets or returns the items selected in a ListBox. Returns None if 0 items are selected. If the ListBox is a not multiselect , value is the item selected, if the ListBox is a multiselect , value is a list of items selected. visible boolean If this widget is visible width size Set the width of the widget in pixels or to \"fill\" text_size int The size of the text text_color color The colour of the text Refer to a property as <name of widget>.property . For example, if your ListBox object is called listbox you would write listbox.value . You can set the property (for example listbox.value = \"Chicken\" ) or get the value of the property to use (for example print(listbox.value) ).","title":"Properties"},{"location":"listbox/#examples","text":"Select a text color from a ListBox When an item in the ListBox is selected a function will be called to change the color of the text. from guizero import App, ListBox, Text def change_color(value): t.text_color = value a = App() t = Text(a, text=\"Its a ListBox\", color=\"black\") listbox = ListBox( a, items=[\"red\", \"green\", \"blue\", \"yellow\", \"purple\", \"turquoise\", \"pink\", \"orange\", \"black\", \"brown\", \"cyan\"], selected=\"black\", command=change_color, scrollbar=True) a.display()","title":"Examples"},{"location":"menubar/","text":"MenuBar (Contains a tkinter.Menu object) __init__( self, master, toplevel, options) What is it? The MenuBar object displays a menu at the top of the screen, with each menu option leading to a submenu. How do I make one? Create a MenuBar object like this: from guizero import App, MenuBar def file_function(): print(\"File option\") def edit_function(): print(\"Edit option\") app = App() menubar = MenuBar(app, toplevel=[\"File\", \"Edit\"], options=[ [ [\"File option 1\", file_function], [\"File option 2\", file_function] ], [ [\"Edit option 1\", edit_function], [\"Edit option 2\", edit_function] ] ]) app.display() Starting parameters When you create a MenuBar object you must specify all of the parameters. Parameter Takes Default Compulsory Description master App - Yes The container to which this widget belongs toplevel list - Yes A list of top level menu items options 3D list - Yes A list of submenus, with each submenu being a list of options and each option being a text/command pair. See notes above for more details. The toplevel parameter should be a list of options you wish to display on the menu. In the example, the toplevel options are File and Edit: The options parameter should be a 3D List containing lists of submenu items, which are themselves lists. The elements in the list correspond to the elements in the toplevel list, so the first list of submenu items provided in options will be the submenu for the first menu heading provided in toplevel and so on. The menu item sub-sublists within options should contain pairs consisting of the text to display on the menu and the function to call when that option is selected. In this example, the text \"File option 1\" is displayed and the function file_function is called if this option is clicked on. [\"File option 1\", file_function] The MenuBar is never displayed on a grid so there are no grid or alignment parameters. Methods You can call the following methods on an MenuBar object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. Properties You can set and get the following properties: Method Data type Description master App The App object to which this MenuBar belongs","title":"MenuBar"},{"location":"menubar/#menubar","text":"(Contains a tkinter.Menu object) __init__( self, master, toplevel, options)","title":"MenuBar"},{"location":"menubar/#what-is-it","text":"The MenuBar object displays a menu at the top of the screen, with each menu option leading to a submenu.","title":"What is it?"},{"location":"menubar/#how-do-i-make-one","text":"Create a MenuBar object like this: from guizero import App, MenuBar def file_function(): print(\"File option\") def edit_function(): print(\"Edit option\") app = App() menubar = MenuBar(app, toplevel=[\"File\", \"Edit\"], options=[ [ [\"File option 1\", file_function], [\"File option 2\", file_function] ], [ [\"Edit option 1\", edit_function], [\"Edit option 2\", edit_function] ] ]) app.display()","title":"How do I make one?"},{"location":"menubar/#starting-parameters","text":"When you create a MenuBar object you must specify all of the parameters. Parameter Takes Default Compulsory Description master App - Yes The container to which this widget belongs toplevel list - Yes A list of top level menu items options 3D list - Yes A list of submenus, with each submenu being a list of options and each option being a text/command pair. See notes above for more details. The toplevel parameter should be a list of options you wish to display on the menu. In the example, the toplevel options are File and Edit: The options parameter should be a 3D List containing lists of submenu items, which are themselves lists. The elements in the list correspond to the elements in the toplevel list, so the first list of submenu items provided in options will be the submenu for the first menu heading provided in toplevel and so on. The menu item sub-sublists within options should contain pairs consisting of the text to display on the menu and the function to call when that option is selected. In this example, the text \"File option 1\" is displayed and the function file_function is called if this option is clicked on. [\"File option 1\", file_function] The MenuBar is never displayed on a grid so there are no grid or alignment parameters.","title":"Starting parameters"},{"location":"menubar/#methods","text":"You can call the following methods on an MenuBar object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor.","title":"Methods"},{"location":"menubar/#properties","text":"You can set and get the following properties: Method Data type Description master App The App object to which this MenuBar belongs","title":"Properties"},{"location":"multiple_windows/","text":"Multiple Windows A guizero application should only have have 1 App object, this is the main window and controller of your program. If you want to create a 2nd (or 3rd, 4th, 5th) window, your program should use a Window object. A 2nd Window Creating a 2nd Window is easy and just like creating a widget you need to pass it the App: from guizero import App, Window app = App(title=\"Main window\") window = Window(app, title=\"2nd window\") app.display() Adding widgets to the 2nd window is the same as adding them to an app, by passing the name of the window: from guizero import App, Window, Text app = App(title=\"Main window\") window = Window(app, title=\"2nd window\") text = Text(window, text=\"text\") app.display() Opening and closing windows When a Window object is created it is immediately displayed on the screen, you can control it using the show() and hide() methods. To make a window which is shown when a button on the App is clicked and closed when a button is clicked on the Window . from guizero import App, Window, PushButton def open_window(): window.show() def close_window(): window.hide() app = App(title=\"Main window\") window = Window(app, title=\"2nd window\") window.hide() open_button = PushButton(app, text=\"Open\", command=open_window) close_button = PushButton(window, text=\"Close\", command=close_window) app.display() Modal windows When a window is opened using show() it is opening side by side with the main window, and both windows can be used at the same time To open a \"modal\" window which prevents the other windows in the applcation being used until it is closed you can pass True to the optional wait parameter of show e.g. window.show(wait=True) . This will force all other windows to wait until this window is closed before they can be used. def open_window(): window.show(wait=True)","title":"Multiple windows"},{"location":"multiple_windows/#multiple-windows","text":"A guizero application should only have have 1 App object, this is the main window and controller of your program. If you want to create a 2nd (or 3rd, 4th, 5th) window, your program should use a Window object.","title":"Multiple Windows"},{"location":"multiple_windows/#a-2nd-window","text":"Creating a 2nd Window is easy and just like creating a widget you need to pass it the App: from guizero import App, Window app = App(title=\"Main window\") window = Window(app, title=\"2nd window\") app.display() Adding widgets to the 2nd window is the same as adding them to an app, by passing the name of the window: from guizero import App, Window, Text app = App(title=\"Main window\") window = Window(app, title=\"2nd window\") text = Text(window, text=\"text\") app.display()","title":"A 2nd Window"},{"location":"multiple_windows/#opening-and-closing-windows","text":"When a Window object is created it is immediately displayed on the screen, you can control it using the show() and hide() methods. To make a window which is shown when a button on the App is clicked and closed when a button is clicked on the Window . from guizero import App, Window, PushButton def open_window(): window.show() def close_window(): window.hide() app = App(title=\"Main window\") window = Window(app, title=\"2nd window\") window.hide() open_button = PushButton(app, text=\"Open\", command=open_window) close_button = PushButton(window, text=\"Close\", command=close_window) app.display()","title":"Opening and closing windows"},{"location":"multiple_windows/#modal-windows","text":"When a window is opened using show() it is opening side by side with the main window, and both windows can be used at the same time To open a \"modal\" window which prevents the other windows in the applcation being used until it is closed you can pass True to the optional wait parameter of show e.g. window.show(wait=True) . This will force all other windows to wait until this window is closed before they can be used. def open_window(): window.show(wait=True)","title":"Modal windows"},{"location":"picture/","text":"Picture (Contains a tkinter.Label object) __init__( self, master, image=None, grid=None, align=None, visible=True, enabled=None, width=None, height=None) What is it? The Picture object displays an image. How do I make one? Create a Picture object like this: from guizero import App, Picture app = App() picture = Picture(app, image=\"test.gif\") app.display() You must specify the correct path to the image. The image in the example is in the same directory as the program. If the image is in a different directory, specify a relative path, for example if the picture is in a subfolder called images you would write: picture = Picture(app, image=\"images/test.gif\") Image support Depending on your operating system and whether you installed the guizero additional image features will determine what image types you can use with Picture . By default GIF and PNG are supported, except macOS which only supports GIF. Starting parameters When you create a Picture object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: picture = Picture(app, image=\"test.gif\") Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs image string None - The file path, tkinter.PhotoImage or PIL.Image you wish to display align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in pixels height size None No Set the height of the widget in pixels Methods You can call the following methods on a Picture object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden set(image) image (string) - Replaced by the value property Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in pixels image string The file path, tkinter.PhotoImage or PIL.Image you wish to display master App or Box The container to which this widget belongs value string The file path, tkinter.PhotoImage or PIL.Image you wish to display visible boolean If this widget is visible width size Set the width of the widget in pixels Refer to a property as <name of widget>.property . For example, if your Picture object is called picture you would write picture.value . You can set the property (for example picture.value = \"star.gif\" ) or get the value of the property to use (for example print(picture.value) ).","title":"Picture"},{"location":"picture/#picture","text":"(Contains a tkinter.Label object) __init__( self, master, image=None, grid=None, align=None, visible=True, enabled=None, width=None, height=None)","title":"Picture"},{"location":"picture/#what-is-it","text":"The Picture object displays an image.","title":"What is it?"},{"location":"picture/#how-do-i-make-one","text":"Create a Picture object like this: from guizero import App, Picture app = App() picture = Picture(app, image=\"test.gif\") app.display() You must specify the correct path to the image. The image in the example is in the same directory as the program. If the image is in a different directory, specify a relative path, for example if the picture is in a subfolder called images you would write: picture = Picture(app, image=\"images/test.gif\")","title":"How do I make one?"},{"location":"picture/#image-support","text":"Depending on your operating system and whether you installed the guizero additional image features will determine what image types you can use with Picture . By default GIF and PNG are supported, except macOS which only supports GIF.","title":"Image support"},{"location":"picture/#starting-parameters","text":"When you create a Picture object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: picture = Picture(app, image=\"test.gif\") Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs image string None - The file path, tkinter.PhotoImage or PIL.Image you wish to display align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in pixels height size None No Set the height of the widget in pixels","title":"Starting parameters"},{"location":"picture/#methods","text":"You can call the following methods on a Picture object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden set(image) image (string) - Replaced by the value property Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Methods"},{"location":"picture/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in pixels image string The file path, tkinter.PhotoImage or PIL.Image you wish to display master App or Box The container to which this widget belongs value string The file path, tkinter.PhotoImage or PIL.Image you wish to display visible boolean If this widget is visible width size Set the width of the widget in pixels Refer to a property as <name of widget>.property . For example, if your Picture object is called picture you would write picture.value . You can set the property (for example picture.value = \"star.gif\" ) or get the value of the property to use (for example print(picture.value) ).","title":"Properties"},{"location":"pushbutton/","text":"PushButton (Contains a tkinter.Button object) __init__( self, master, command=None, args=None, text=\"Button\", image=None, pady=10, padx=10, grid=None, align=None, icon=None, visible=True, enabled=None, width=None, height=None) What is it? The PushButton object displays a button with text or an image, which calls a function when pressed. How do I make one? Create a PushButton object like this: from guizero import App, PushButton def do_nothing(): print(\"Button was pressed\") app = App() button = PushButton(app, command=do_nothing) app.display() Create a picture PushButton with an image like this: from guizero import App, PushButton def do_nothing(): print(\"A picture button was pressed\") app = App() button = PushButton(app, image=\"button.gif\", command=do_nothing) app.display() Depending on your operating system and whether you installed the guizero additional image features will determine what image types you can use for PushButton . By default GIF and PNG are supported, except macOS which only supports GIF. Starting parameters When you create a PushButton object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: button = PushButton(app) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs command function name None - The name of a function to call when the button is pressed. align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . args list None - If you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. image string None - The file path, tkinter.PhotoImage or PIL.Image you wish to display. If both an image and text are specified, the image will override the text. padx int 10 - How much horizontal padding to add between the text/icon and the edge of the button. pady int 10 - How much vertical padding to add between the text/icon and the edge of the button. text string \"Button\" - The text to display on the button visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in characters or pixels if its an image button or to \"fill\" height size None No Set the height of the widget in characters or pixels if its an image button or to \"fill\" Methods You can call the following methods on a PushButton object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. image(image_source) image_source (string) - The file path, tkinter.PhotoImage or PIL.Image you wish to display. padding(padx, pady) padx (int), pady(int) - Sets the amount of x (horizontal) and y (vertical) padding between the text/icon and the edge of the button repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden toggle() - - Changes the state of the button to the opposite of its current state - if it is currently enabled, disable it and vice versa. update_command(command, args =None) command (function name), args ( Optional List of arguments to be passed to command) - Updates the function to call when the button is pressed . change_command(newcommand, args) newcommand (function name), args (list) - Replaced by update_command function icon(icon) icon (string) - The file path, tkinter.PhotoImage or PIL.Image you wish to display set_text(text) text (string) - Replaced by the text property toggle_state() - - Renamed to toggle() Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text on the button grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or pixels if its an image button or to \"fill\" master App or Box The container to which this widget belongs text string The text on the button text_color color The colour of the text on the button text_size int The size of the text on the button value int Returns 1 when the button is pressed, 0 if the button is released visible boolean If this widget is visible width size Set the width of the widget in characters or pixels if its an image button or to \"fill\" Refer to a property as <name of widget>.property . For example, if your PushButton object is called button you would write button.value . You can set the property (for example button.bg = \"red\" ) or get the value of the property to use (for example print(button.bg) ).","title":"PushButton"},{"location":"pushbutton/#pushbutton","text":"(Contains a tkinter.Button object) __init__( self, master, command=None, args=None, text=\"Button\", image=None, pady=10, padx=10, grid=None, align=None, icon=None, visible=True, enabled=None, width=None, height=None)","title":"PushButton"},{"location":"pushbutton/#what-is-it","text":"The PushButton object displays a button with text or an image, which calls a function when pressed.","title":"What is it?"},{"location":"pushbutton/#how-do-i-make-one","text":"Create a PushButton object like this: from guizero import App, PushButton def do_nothing(): print(\"Button was pressed\") app = App() button = PushButton(app, command=do_nothing) app.display() Create a picture PushButton with an image like this: from guizero import App, PushButton def do_nothing(): print(\"A picture button was pressed\") app = App() button = PushButton(app, image=\"button.gif\", command=do_nothing) app.display() Depending on your operating system and whether you installed the guizero additional image features will determine what image types you can use for PushButton . By default GIF and PNG are supported, except macOS which only supports GIF.","title":"How do I make one?"},{"location":"pushbutton/#starting-parameters","text":"When you create a PushButton object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: button = PushButton(app) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs command function name None - The name of a function to call when the button is pressed. align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . args list None - If you wish to pass any arguments to the function specified in the command parameter, you can specify them as a list grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. image string None - The file path, tkinter.PhotoImage or PIL.Image you wish to display. If both an image and text are specified, the image will override the text. padx int 10 - How much horizontal padding to add between the text/icon and the edge of the button. pady int 10 - How much vertical padding to add between the text/icon and the edge of the button. text string \"Button\" - The text to display on the button visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in characters or pixels if its an image button or to \"fill\" height size None No Set the height of the widget in characters or pixels if its an image button or to \"fill\"","title":"Starting parameters"},{"location":"pushbutton/#methods","text":"You can call the following methods on a PushButton object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. image(image_source) image_source (string) - The file path, tkinter.PhotoImage or PIL.Image you wish to display. padding(padx, pady) padx (int), pady(int) - Sets the amount of x (horizontal) and y (vertical) padding between the text/icon and the edge of the button repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden toggle() - - Changes the state of the button to the opposite of its current state - if it is currently enabled, disable it and vice versa. update_command(command, args =None) command (function name), args ( Optional List of arguments to be passed to command) - Updates the function to call when the button is pressed . change_command(newcommand, args) newcommand (function name), args (list) - Replaced by update_command function icon(icon) icon (string) - The file path, tkinter.PhotoImage or PIL.Image you wish to display set_text(text) text (string) - Replaced by the text property toggle_state() - - Renamed to toggle() Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Methods"},{"location":"pushbutton/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text on the button grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or pixels if its an image button or to \"fill\" master App or Box The container to which this widget belongs text string The text on the button text_color color The colour of the text on the button text_size int The size of the text on the button value int Returns 1 when the button is pressed, 0 if the button is released visible boolean If this widget is visible width size Set the width of the widget in characters or pixels if its an image button or to \"fill\" Refer to a property as <name of widget>.property . For example, if your PushButton object is called button you would write button.value . You can set the property (for example button.bg = \"red\" ) or get the value of the property to use (for example print(button.bg) ).","title":"Properties"},{"location":"recipes/","text":"Recipes These are examples of how you can use guizero to create user interfaces. Don't be restricted to these ideas, check out Using guizero and the widgets . Hello World Create a guizero app and display some text. from guizero import App, Text app = App() text = Text(app, text=\"hello world\") app.display() Get some text Get some data from the user using a TextBox . from guizero import App, TextBox app = App() name = TextBox(app. text=\"Enter your name\") app.display() Push a button Use a PushButton to display a message when the button is pressed. from guizero import App, TextBox, PushButton, Text def update_text(): label.value = name.value app = App() label = Text(app, text=\"What's your name?\") name = TextBox(app) button = PushButton(app, command=update_text) app.display() Display an image Use a Picture object to display an image. from guizero import App, Picture app = App() pic = Picture(app, image=\"myimage.gif\") app.display() Toggle 2 buttons Have 2 buttons, start and stop with them changing the enabled state of each other. from guizero import App, PushButton def start(): start_button.disable() stop_button.enable() def stop(): start_button.enable() stop_button.disable() app = App() start_button = PushButton(app, command=start, text=\"start\") stop_button = PushButton(app, command=stop, text=\"stop\", enabled=False) app.display() Change your apps appearance Your app doesn't have to use the standard colors and text, let your user pick the background and text color from 2 combo's. from guizero import App, Combo, Text def update_bg(): app.bg = bg_combo.value def update_text(): app.text_color = text_combo.value colors = [\"black\", \"white\", \"red\", \"green\", \"blue\"] app = App() app.bg = \"black\" app.text_color = \"white\" title1 = Text(app, text=\"Background color\") bg_combo = Combo(app, options=colors, selected=app.bg, command=update_bg) title2 = Text(app, text=\"Text color\") text_combo = Combo(app, options=colors, selected=app.text_color, command=update_text) app.display() Scale an image Display an image on the screen with 2 sliders, 1 for height and 1 for width. from guizero import App, Slider, Picture def resize(): picture.width = width.value picture.height = height.value app = App(layout=\"grid\") picture = Picture(app, image=\"image.gif\", grid=[0,1]) width = Slider(app, command=resize, grid=[0,0], start=1, end=picture.width) width.width = picture.width width.value = picture.width height = Slider(app, command=resize, horizontal=False, grid=[1,1], start=1, end=picture.height) height.height = picture.height height.value = picture.height app.display()","title":"Recipes"},{"location":"recipes/#recipes","text":"These are examples of how you can use guizero to create user interfaces. Don't be restricted to these ideas, check out Using guizero and the widgets .","title":"Recipes"},{"location":"recipes/#hello-world","text":"Create a guizero app and display some text. from guizero import App, Text app = App() text = Text(app, text=\"hello world\") app.display()","title":"Hello World"},{"location":"recipes/#get-some-text","text":"Get some data from the user using a TextBox . from guizero import App, TextBox app = App() name = TextBox(app. text=\"Enter your name\") app.display()","title":"Get some text"},{"location":"recipes/#push-a-button","text":"Use a PushButton to display a message when the button is pressed. from guizero import App, TextBox, PushButton, Text def update_text(): label.value = name.value app = App() label = Text(app, text=\"What's your name?\") name = TextBox(app) button = PushButton(app, command=update_text) app.display()","title":"Push a button"},{"location":"recipes/#display-an-image","text":"Use a Picture object to display an image. from guizero import App, Picture app = App() pic = Picture(app, image=\"myimage.gif\") app.display()","title":"Display an image"},{"location":"recipes/#toggle-2-buttons","text":"Have 2 buttons, start and stop with them changing the enabled state of each other. from guizero import App, PushButton def start(): start_button.disable() stop_button.enable() def stop(): start_button.enable() stop_button.disable() app = App() start_button = PushButton(app, command=start, text=\"start\") stop_button = PushButton(app, command=stop, text=\"stop\", enabled=False) app.display()","title":"Toggle 2 buttons"},{"location":"recipes/#change-your-apps-appearance","text":"Your app doesn't have to use the standard colors and text, let your user pick the background and text color from 2 combo's. from guizero import App, Combo, Text def update_bg(): app.bg = bg_combo.value def update_text(): app.text_color = text_combo.value colors = [\"black\", \"white\", \"red\", \"green\", \"blue\"] app = App() app.bg = \"black\" app.text_color = \"white\" title1 = Text(app, text=\"Background color\") bg_combo = Combo(app, options=colors, selected=app.bg, command=update_bg) title2 = Text(app, text=\"Text color\") text_combo = Combo(app, options=colors, selected=app.text_color, command=update_text) app.display()","title":"Change your apps appearance"},{"location":"recipes/#scale-an-image","text":"Display an image on the screen with 2 sliders, 1 for height and 1 for width. from guizero import App, Slider, Picture def resize(): picture.width = width.value picture.height = height.value app = App(layout=\"grid\") picture = Picture(app, image=\"image.gif\", grid=[0,1]) width = Slider(app, command=resize, grid=[0,0], start=1, end=picture.width) width.width = picture.width width.value = picture.width height = Slider(app, command=resize, horizontal=False, grid=[1,1], start=1, end=picture.height) height.height = picture.height height.value = picture.height app.display()","title":"Scale an image"},{"location":"size/","text":"Sizes You can set the width and height of widgets in guizero. Widgets are sized by pixels or characters depending on the widget and what it contains. Some widgets size can also be set to \"fill\" where it will use up all of the available space. from guizero import App, PushButton, Slider, ListBox app = App() # a PushButton's size is noted in characters button = PushButton(app, width=30, height=5) # a Slider's size is noted in pixels slider = Slider(app, width=300, height=30) # some widgets, such as ListBox can also be told to fill all the available space listbox = ListBox(app, width=\"fill\", height=\"fill\") app.display() Widget Characters or Pixels Fill Notes Box Pixels Yes If a Box is sized in Pixels, both width and height must be specified. ButtonGroup Characters Yes The height of a ButtonGroup must divide by the number of buttons in it CheckBox Characters Yes Combo Characters Yes ListBox Pixels Yes Picture Pixels No See Images for more information PushButton Characters Yes PushButton with image Pixels No PushButton's which have images are sized in pixels Slider Pixels Yes Text Characters Yes TextBox Characters Yes Only a TextBox's width can be set Waffle Pixels No","title":"Sizes"},{"location":"size/#sizes","text":"You can set the width and height of widgets in guizero. Widgets are sized by pixels or characters depending on the widget and what it contains. Some widgets size can also be set to \"fill\" where it will use up all of the available space. from guizero import App, PushButton, Slider, ListBox app = App() # a PushButton's size is noted in characters button = PushButton(app, width=30, height=5) # a Slider's size is noted in pixels slider = Slider(app, width=300, height=30) # some widgets, such as ListBox can also be told to fill all the available space listbox = ListBox(app, width=\"fill\", height=\"fill\") app.display() Widget Characters or Pixels Fill Notes Box Pixels Yes If a Box is sized in Pixels, both width and height must be specified. ButtonGroup Characters Yes The height of a ButtonGroup must divide by the number of buttons in it CheckBox Characters Yes Combo Characters Yes ListBox Pixels Yes Picture Pixels No See Images for more information PushButton Characters Yes PushButton with image Pixels No PushButton's which have images are sized in pixels Slider Pixels Yes Text Characters Yes TextBox Characters Yes Only a TextBox's width can be set Waffle Pixels No","title":"Sizes"},{"location":"slider/","text":"Slider (Contains a tkinter.Scale object) __init__( self, master, start=0, end=100, horizontal=True, command=None, grid=None, align=None, visible=True, enabled=None, width=None, height=None) What is it? The Slider object displays a bar and selector which can be used to specify a value in a range. The above code looks like this on Windows: How do I make one? Create a Slider object like this: from guizero import App, Slider app = App() slider = Slider(app) app.display() Starting paramters When you create a Slider object, you must specify a master and you can specify any of the the optional parameters. Specify parameters in the brackets, like this: slider = Slider(app, horizontal=False) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . command function name None - The name of a function to call when the slider value is changed end int 100 - The largest value selectable on the slider grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. horizontal Boolean True - Whether you wish to display your slider horizontally or vertically (defaults to horizontal) start int 0 - The smallest value selectable on the slider visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in pixels or to \"fill\" height size None No Set the height of the widget in pixels or to \"fill\" Methods You can call the following methods on a Slider object. Method Takes Returns Description the function specified in command after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden update_command(command) command (function name) - Updates the function to call when the slider value is changed add_command(command) command (function name) - Sets the function called when the slider value is changed to Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in pixels or to \"fill\" master App or Box The container to which this widget belongs text_size int The size of the text text_color color The colour of the text value string The current value of the slider visible boolean If this widget is visible width size Set the width of the widget in pixels or to \"fill\" Examples Calling a function when the slider value changes You can specify a function to call when the slider value changes. Your function MUST have a minimum of one parameter as it will automatically receive a string containing the value of the slider (called slider_value in the example) when it is called. This code has a slider and a text box, and the text box updates automatically to display the current value of the slider. from guizero import App, Slider, TextBox def slider_changed(slider_value): textbox.value = slider_value app = App() slider = Slider(app, command=slider_changed) textbox = TextBox(app) app.display()","title":"Slider"},{"location":"slider/#slider","text":"(Contains a tkinter.Scale object) __init__( self, master, start=0, end=100, horizontal=True, command=None, grid=None, align=None, visible=True, enabled=None, width=None, height=None)","title":"Slider"},{"location":"slider/#what-is-it","text":"The Slider object displays a bar and selector which can be used to specify a value in a range. The above code looks like this on Windows:","title":"What is it?"},{"location":"slider/#how-do-i-make-one","text":"Create a Slider object like this: from guizero import App, Slider app = App() slider = Slider(app) app.display()","title":"How do I make one?"},{"location":"slider/#starting-paramters","text":"When you create a Slider object, you must specify a master and you can specify any of the the optional parameters. Specify parameters in the brackets, like this: slider = Slider(app, horizontal=False) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . command function name None - The name of a function to call when the slider value is changed end int 100 - The largest value selectable on the slider grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. horizontal Boolean True - Whether you wish to display your slider horizontally or vertically (defaults to horizontal) start int 0 - The smallest value selectable on the slider visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in pixels or to \"fill\" height size None No Set the height of the widget in pixels or to \"fill\"","title":"Starting paramters"},{"location":"slider/#methods","text":"You can call the following methods on a Slider object. Method Takes Returns Description the function specified in command after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden update_command(command) command (function name) - Updates the function to call when the slider value is changed add_command(command) command (function name) - Sets the function called when the slider value is changed to Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Methods"},{"location":"slider/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in pixels or to \"fill\" master App or Box The container to which this widget belongs text_size int The size of the text text_color color The colour of the text value string The current value of the slider visible boolean If this widget is visible width size Set the width of the widget in pixels or to \"fill\"","title":"Properties"},{"location":"slider/#examples","text":"Calling a function when the slider value changes You can specify a function to call when the slider value changes. Your function MUST have a minimum of one parameter as it will automatically receive a string containing the value of the slider (called slider_value in the example) when it is called. This code has a slider and a text box, and the text box updates automatically to display the current value of the slider. from guizero import App, Slider, TextBox def slider_changed(slider_value): textbox.value = slider_value app = App() slider = Slider(app, command=slider_changed) textbox = TextBox(app) app.display()","title":"Examples"},{"location":"start/","text":"Getting Started At the start of every guizero program, choose the widgets you need from the guizero library and import them: from guizero import App, PushButton, Slider You only need to import each widget once, and then you can use it in your program as many times as you like. Hello World All guizero projects begin with a main window which is called an App . At the end of every guizero program you must tell the program to display the app you have just created. Let's create an app window with the title \"Hello world\": from guizero import App app = App(title=\"Hello world\") app.display() Save and run the code - you've created your first guizero app! Adding widgets Widgets are the things which appear on the GUI, such as text boxes, buttons, sliders and even plain old pieces of text. All widgets go between the line of code to create the App and the app.display() line. from guizero import App, Text app = App(title=\"Hello world\") message = Text(app, text=\"Welcome to the Hello world app!\") app.display() Let\u2019s look at the Text widget code in a bit more detail: message = Text(app, text=\"Welcome to the Hello world app!\") message = - The Text object has a name, just like any variable Text - an object which creates a piece of text on the screen app \u2013 This tells the Text where it will live. Most of the time your widgets will live directly inside the app. text=\"Welcome to the Hello world app!\" - The text to display And that's it! Now have a look on the documentation pages for the individual widgets to find out more about how to use them.","title":"Getting started"},{"location":"start/#getting-started","text":"At the start of every guizero program, choose the widgets you need from the guizero library and import them: from guizero import App, PushButton, Slider You only need to import each widget once, and then you can use it in your program as many times as you like.","title":"Getting Started"},{"location":"start/#hello-world","text":"All guizero projects begin with a main window which is called an App . At the end of every guizero program you must tell the program to display the app you have just created. Let's create an app window with the title \"Hello world\": from guizero import App app = App(title=\"Hello world\") app.display() Save and run the code - you've created your first guizero app!","title":"Hello World"},{"location":"start/#adding-widgets","text":"Widgets are the things which appear on the GUI, such as text boxes, buttons, sliders and even plain old pieces of text. All widgets go between the line of code to create the App and the app.display() line. from guizero import App, Text app = App(title=\"Hello world\") message = Text(app, text=\"Welcome to the Hello world app!\") app.display() Let\u2019s look at the Text widget code in a bit more detail: message = Text(app, text=\"Welcome to the Hello world app!\") message = - The Text object has a name, just like any variable Text - an object which creates a piece of text on the screen app \u2013 This tells the Text where it will live. Most of the time your widgets will live directly inside the app. text=\"Welcome to the Hello world app!\" - The text to display And that's it! Now have a look on the documentation pages for the individual widgets to find out more about how to use them.","title":"Adding widgets"},{"location":"text/","text":"Text (Contains a tkinter.Label object) __init__( self, master, text=\"\", size=12, color=\"black\", bg=None, font=\"Helvetica\", grid=None, align=None, visible=True, enabled=None, width=None, height=None) What is it? The Text object displays non editable text in your app, useful for titles, labels and instructions. How do I make one? Create a Text object like this: from guizero import App, Text app = App() text = Text(app, text=\"Hello World\") app.display() Starting parameters When you create a Text object, you must specify a master and you can specify any of the the optional parameters. Specify parameters in the brackets, like this: text = Text(app, text=\"hi\") Parameter Data type Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . color color black - The colour of the text. Accepts some colour strings (e.g. red ) and colours specified in hex format (e.g. #0099ff ) font string \"Helvetica\" - The font face that the text will be displayed in. Availability of fonts depends on which fonts are installed locally. grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. text_size int 12 - The font size of the text text string \"\" - The text you want to display visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in characters or to \"fill\" height size None No Set the height of the widget in characters or to \"fill\" Methods You can call the following methods on a Text object.. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) append(text) text (string) - Adds the provided text to the end of the current text within the object cancel(command) command (function name) - Cancels a scheduled call to command clear() - - Clears the text destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden color(color) color (string) - Replaced by text_color property font_face(font) font (string) - Replaced by font property font_size(size) size (int) - Replaced by size property get() - string Replaced by value property set(text) text (string) - Replaced by value property Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" master App or Box The container to which this widget belongs text_size int The size of the text text_color color The colour of the text value string The text visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\"","title":"Text"},{"location":"text/#text","text":"(Contains a tkinter.Label object) __init__( self, master, text=\"\", size=12, color=\"black\", bg=None, font=\"Helvetica\", grid=None, align=None, visible=True, enabled=None, width=None, height=None)","title":"Text"},{"location":"text/#what-is-it","text":"The Text object displays non editable text in your app, useful for titles, labels and instructions.","title":"What is it?"},{"location":"text/#how-do-i-make-one","text":"Create a Text object like this: from guizero import App, Text app = App() text = Text(app, text=\"Hello World\") app.display()","title":"How do I make one?"},{"location":"text/#starting-parameters","text":"When you create a Text object, you must specify a master and you can specify any of the the optional parameters. Specify parameters in the brackets, like this: text = Text(app, text=\"hi\") Parameter Data type Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . color color black - The colour of the text. Accepts some colour strings (e.g. red ) and colours specified in hex format (e.g. #0099ff ) font string \"Helvetica\" - The font face that the text will be displayed in. Availability of fonts depends on which fonts are installed locally. grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. text_size int 12 - The font size of the text text string \"\" - The text you want to display visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master width size None No Set the width of the widget in characters or to \"fill\" height size None No Set the height of the widget in characters or to \"fill\"","title":"Starting parameters"},{"location":"text/#methods","text":"You can call the following methods on a Text object.. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) append(text) text (string) - Adds the provided text to the end of the current text within the object cancel(command) command (function name) - Cancels a scheduled call to command clear() - - Clears the text destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden color(color) color (string) - Replaced by text_color property font_face(font) font (string) - Replaced by font property font_size(size) size (int) - Replaced by size property get() - string Replaced by value property set(text) text (string) - Replaced by value property Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Methods"},{"location":"text/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" master App or Box The container to which this widget belongs text_size int The size of the text text_color color The colour of the text value string The text visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\"","title":"Properties"},{"location":"textbox/","text":"TextBox (Contains a tkinter.Entry object) __init__( self, master, text=\"\", width=10, height=1, grid=None, align=None, visible=True, enabled=None, multiline=False, scrollbar=False, command=None) What is it The TextBox object displays a text box which the user can type in. How do I make one? Create a TextBox object like this: from guizero import App, TextBox app = App() input_box = TextBox(app) app.display() Starting parameters When you create a TextBox object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: textbox = TextBox(app, text=\"Please enter some text\") Parameter Data type Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. text string \"\" - Any text you wish to be pre-filled in the text box width int 10 - Set the width of the widget in characters or to \"fill\" height int 1 - Set the height of the widget in characters or to \"fill\" , only effective if multiline is True visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master multiline boolean False No Create a multi-line text box. scrollbar boolean False No Add a vertical scrollbar to a multi-line text box command function name None - The name of a function to call when the text is changed. This function MUST take either zero or one argument, if the function takes one argument the key which was added to the textbox will be returned. Methods You can call the following methods on your TextBox object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) append(text) text (string) - Adds the provided text to the end of the current text within the text box cancel(command) command (function name) - Cancels a scheduled call to command clear() - - Clears the textbox destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden update_command(command) command (function name) - Updates the function to call when the text is changed. get() - string Replaced by value property set(text) text (string) - Replaced by value property Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" , only effective if multiline is True master App or Box The container to which this widget belongs value string The text in the TextBox visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\" text_size int The size of the text text_color color The colour of the text Examples Creating a TextBox with default text You can set the default text in a TextBox when it is created using the text parameter: from guizero import App, TextBox app = App() input_box = TextBox(app, text=\"Type here\") app.display() Creating a multi-line TextBox You can create a text box which is capable of capturing multiple lines of text by setting the multiline parameter to True and giving the textbox a height : from guizero import App, TextBox app = App() input_box = TextBox(app, text=\"Type lines here\", height=10, multiline=True) app.display() Multi-line text boxes can also be given a scrollbar by setting the scrollbar parameter to True : input_box = TextBox(app, text=\"Type lines here\", height=10, multiline=True, scrollbar=True)","title":"TextBox"},{"location":"textbox/#textbox","text":"(Contains a tkinter.Entry object) __init__( self, master, text=\"\", width=10, height=1, grid=None, align=None, visible=True, enabled=None, multiline=False, scrollbar=False, command=None)","title":"TextBox"},{"location":"textbox/#what-is-it","text":"The TextBox object displays a text box which the user can type in.","title":"What is it"},{"location":"textbox/#how-do-i-make-one","text":"Create a TextBox object like this: from guizero import App, TextBox app = App() input_box = TextBox(app) app.display()","title":"How do I make one?"},{"location":"textbox/#starting-parameters","text":"When you create a TextBox object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: textbox = TextBox(app, text=\"Please enter some text\") Parameter Data type Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. text string \"\" - Any text you wish to be pre-filled in the text box width int 10 - Set the width of the widget in characters or to \"fill\" height int 1 - Set the height of the widget in characters or to \"fill\" , only effective if multiline is True visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master multiline boolean False No Create a multi-line text box. scrollbar boolean False No Add a vertical scrollbar to a multi-line text box command function name None - The name of a function to call when the text is changed. This function MUST take either zero or one argument, if the function takes one argument the key which was added to the textbox will be returned.","title":"Starting parameters"},{"location":"textbox/#methods","text":"You can call the following methods on your TextBox object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) append(text) text (string) - Adds the provided text to the end of the current text within the text box cancel(command) command (function name) - Cancels a scheduled call to command clear() - - Clears the textbox destroy() - - Destroys the widget disable() - - Disables the widget so that it is \"greyed out\" and cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. resize(width, height) width (int), height (int) - Sets the width and height of the widget show() - - Displays the widget if it was previously hidden update_command(command) command (function name) - Updates the function to call when the text is changed. get() - string Replaced by value property set(text) text (string) - Replaced by value property Methods in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Methods"},{"location":"textbox/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget enabled boolean True if the widget is enabled font string The font of the text grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height of the widget in characters or to \"fill\" , only effective if multiline is True master App or Box The container to which this widget belongs value string The text in the TextBox visible boolean If this widget is visible width size Set the width of the widget in characters or to \"fill\" text_size int The size of the text text_color color The colour of the text","title":"Properties"},{"location":"textbox/#examples","text":"Creating a TextBox with default text You can set the default text in a TextBox when it is created using the text parameter: from guizero import App, TextBox app = App() input_box = TextBox(app, text=\"Type here\") app.display() Creating a multi-line TextBox You can create a text box which is capable of capturing multiple lines of text by setting the multiline parameter to True and giving the textbox a height : from guizero import App, TextBox app = App() input_box = TextBox(app, text=\"Type lines here\", height=10, multiline=True) app.display() Multi-line text boxes can also be given a scrollbar by setting the scrollbar parameter to True : input_box = TextBox(app, text=\"Type lines here\", height=10, multiline=True, scrollbar=True)","title":"Examples"},{"location":"usingtk/","text":"Using tkinter If you are an advanced user, you can still make use of tkinter when using guizero. You can combine the use of guizero and tkinter seamlessly in a program, taking advantage of the simplified syntax of guizero whilst still being able to access the full range of functionality in tkinter if you need it. Using tkinter widgets in guizero You can add tk widgets into your guizero app using the add_tk_widget method of App , Window and Box . In this example, we are adding the tkinter widget Spinbox into a guizero App : from guizero import App, Text from tkinter import Spinbox app = App() text = Text(app, text=\"A Spinbox widget\") spinbox = Spinbox(from_=0, to=10) app.add_tk_widget(spinbox) a.display() When adding a tk widget to a Box or a Window you will have to specify its tk property when creating the tk widget. box = Box(app) spinbox = Spinbox(box.tk, from_=0, to=10) box.add_tk_widget(spinbox) Using a tkinter method on a guizero object Each guizero widget itself contains a tk widget - you can find out which by looking on the guizero documentation page for the widget. For example, a guizero TextBox contains a tkinter Entry object. You can access the internal object using the syntax <object_name>.tk . In this example, we have guizero App and TextBox widgets and are using the tk widgets config method to change the mouse cursor when it is over the TextBox . from guizero import App, TextBox app = App() name = TextBox(app, text=\"Laura\") name.tk.config(cursor=\"target\") app.display()","title":"Using tkinter"},{"location":"usingtk/#using-tkinter","text":"If you are an advanced user, you can still make use of tkinter when using guizero. You can combine the use of guizero and tkinter seamlessly in a program, taking advantage of the simplified syntax of guizero whilst still being able to access the full range of functionality in tkinter if you need it.","title":"Using tkinter"},{"location":"usingtk/#using-tkinter-widgets-in-guizero","text":"You can add tk widgets into your guizero app using the add_tk_widget method of App , Window and Box . In this example, we are adding the tkinter widget Spinbox into a guizero App : from guizero import App, Text from tkinter import Spinbox app = App() text = Text(app, text=\"A Spinbox widget\") spinbox = Spinbox(from_=0, to=10) app.add_tk_widget(spinbox) a.display() When adding a tk widget to a Box or a Window you will have to specify its tk property when creating the tk widget. box = Box(app) spinbox = Spinbox(box.tk, from_=0, to=10) box.add_tk_widget(spinbox)","title":"Using tkinter widgets in guizero"},{"location":"usingtk/#using-a-tkinter-method-on-a-guizero-object","text":"Each guizero widget itself contains a tk widget - you can find out which by looking on the guizero documentation page for the widget. For example, a guizero TextBox contains a tkinter Entry object. You can access the internal object using the syntax <object_name>.tk . In this example, we have guizero App and TextBox widgets and are using the tk widgets config method to change the mouse cursor when it is over the TextBox . from guizero import App, TextBox app = App() name = TextBox(app, text=\"Laura\") name.tk.config(cursor=\"target\") app.display()","title":"Using a tkinter method on a guizero object"},{"location":"waffle/","text":"Waffle (Contains a tkinter.Frame object) __init__( self, master, height=3, width=3, dim=20, pad=5, color=\"white\", dotty=False, grid=None, align=None, command=None, remember=True, visible=True, enabled=None, bg=None) What is it The Waffle object display an n*n grid of squares with custom dimensions and padding How do I make one? Create a Waffle object like this: from guizero import App, Waffle app = App() waffle = Waffle(app) app.display() Starting parameters When you create a Waffle object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: waffle = Waffle(app, height=25) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . color color \"white\" - The default colour of pixels on the waffle command function name None - The name of a function to call when the waffle is clicked. This function MUST take either zero or two arguments, if the function takes two arguments the x and y co-ordinates of the pixel which was clicked will be given. dim int 20 - How large one of the pixels on the waffle is dotty boolean False - Whether the pixels display as dots/circles (True) or squares (False) grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. height int 3 - Set the height in waffle pixels pad int 5 - How much space is between the pixels on the waffle width int 3 - Set the width in waffle pixels remember boolean True - No longer needed - all Waffles will now have a memory. visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master bg color None No The background colour of the waffle. Takes a color value. Parameters in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero Methods You can call the following methods on your Waffle object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) get_all() - List Returns the pixel colours in the grid as a 2D list. get_pixel(x, y) x (int), y (int) string Returns the colour of the pixel at the specified coordinates. 0,0 is the top left of the grid. hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. pixel(x, y) (int), y (int) WafflePixel Returns the pixel at the specified coordinates. 0,0 is the top left of the grid. Waffle.pixel(x,y) is the equivalent of Waffle[x,y] repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. set_all(color) color ( color ) - Sets all pixels to the specified colour. set_pixel(x, y, color) x (int), y (int), color ( color ) - Sets the pixel at the specified coordinates to the specified colour. 0,0 is the top left of the grid. show() - - Displays the widget update_command(command) command (function name) - Updates the function to call when the Waffle is clicked Properties You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget color color The default colour of pixels on the waffle dotty bool If True the waffle will display circles enabled boolean True if the widget is enabled grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height in waffle pixels master App or Box The container to which this widget belongs pad int The size of the padding between pixels pixel_size int The size of the one pixel width size Set the width in waffle pixels visible boolean If this widget is visible Example Set a pixel colour A Waffle can remember the colour of each pixel within it. from guizero import App, Waffle app = App() my_waffle = Waffle(app) my_waffle[2,1].color = \"red\" # Your waffle will remember what colour each pixel is print(my_waffle[2,1].color) # Even the ones auto-set at the start (which are white by default) print(my_waffle[1,1].color) app.display() WafflePixel A WafflePixel object is returned by Waffle.pixel(x,y) and Waffle[x,y] . from guizero import App, Waffle app = App() my_waffle = Waffle(app) my_waffle.pixel(x,y).color = \"red\" my_waffle[x,y].dotty = True app.display() Properties You can set and get the following properties: Method Data type Description x int Returns the x position of the pixel on the widget x int Returns the y position of the pixel on the widget canvas_x int Returns the x position of the pixel on the canvas canvas_y int Returns the y position of the pixel on the canvas color color Sets or returns the color of the pixel dotty bool Set to True to make the pixel a circle size int Returns the size of the pixel in display pixels","title":"Waffle"},{"location":"waffle/#waffle","text":"(Contains a tkinter.Frame object) __init__( self, master, height=3, width=3, dim=20, pad=5, color=\"white\", dotty=False, grid=None, align=None, command=None, remember=True, visible=True, enabled=None, bg=None)","title":"Waffle"},{"location":"waffle/#what-is-it","text":"The Waffle object display an n*n grid of squares with custom dimensions and padding","title":"What is it"},{"location":"waffle/#how-do-i-make-one","text":"Create a Waffle object like this: from guizero import App, Waffle app = App() waffle = Waffle(app) app.display()","title":"How do I make one?"},{"location":"waffle/#starting-parameters","text":"When you create a Waffle object you must specify master and you can specify any of the optional parameters. Specify parameters in the brackets, like this: waffle = Waffle(app, height=25) Parameter Takes Default Compulsory Description master App, Window or Box - Yes The container to which this widget belongs align string None - Alignment of this widget within its container. Possible values: \"top\" , \"bottom\" , \"left\" , \"right\" . color color \"white\" - The default colour of pixels on the waffle command function name None - The name of a function to call when the waffle is clicked. This function MUST take either zero or two arguments, if the function takes two arguments the x and y co-ordinates of the pixel which was clicked will be given. dim int 20 - How large one of the pixels on the waffle is dotty boolean False - Whether the pixels display as dots/circles (True) or squares (False) grid List [int, int] None - [x,y] coordinates of this widget. This parameter is only required if the master object has a grid layout. height int 3 - Set the height in waffle pixels pad int 5 - How much space is between the pixels on the waffle width int 3 - Set the width in waffle pixels remember boolean True - No longer needed - all Waffles will now have a memory. visible boolean True No If the widget should be visible. enabled boolean None No If the widget should be enabled. If None (the default) the enabled property will be inherited from the master bg color None No The background colour of the waffle. Takes a color value. Parameters in italics will still work but are deprecated - this means you should stop using them because they may not work in future versions of guizero","title":"Starting parameters"},{"location":"waffle/#methods","text":"You can call the following methods on your Waffle object. Method Takes Returns Description after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command destroy() - - Destroys the widget disable() - - Disables the widget so that it cannot be interacted with enable() - - Enables the widget focus() - - Gives focus to the widget (e.g. focusing a TextBox so that the user can type inside it) get_all() - List Returns the pixel colours in the grid as a 2D list. get_pixel(x, y) x (int), y (int) string Returns the colour of the pixel at the specified coordinates. 0,0 is the top left of the grid. hide() - - Hides the widget from view. This method will unpack the widget from the layout manager. pixel(x, y) (int), y (int) WafflePixel Returns the pixel at the specified coordinates. 0,0 is the top left of the grid. Waffle.pixel(x,y) is the equivalent of Waffle[x,y] repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. set_all(color) color ( color ) - Sets all pixels to the specified colour. set_pixel(x, y, color) x (int), y (int), color ( color ) - Sets the pixel at the specified coordinates to the specified colour. 0,0 is the top left of the grid. show() - - Displays the widget update_command(command) command (function name) - Updates the function to call when the Waffle is clicked","title":"Methods"},{"location":"waffle/#properties","text":"You can set and get the following properties: Method Data type Description align string The alignment of this widget within its container bg color The background colour of the widget color color The default colour of pixels on the waffle dotty bool If True the waffle will display circles enabled boolean True if the widget is enabled grid List [x,y] coordinates of this widget. This parameter is only required if the master object has a grid height size Set the height in waffle pixels master App or Box The container to which this widget belongs pad int The size of the padding between pixels pixel_size int The size of the one pixel width size Set the width in waffle pixels visible boolean If this widget is visible","title":"Properties"},{"location":"waffle/#example","text":"Set a pixel colour A Waffle can remember the colour of each pixel within it. from guizero import App, Waffle app = App() my_waffle = Waffle(app) my_waffle[2,1].color = \"red\" # Your waffle will remember what colour each pixel is print(my_waffle[2,1].color) # Even the ones auto-set at the start (which are white by default) print(my_waffle[1,1].color) app.display()","title":"Example"},{"location":"waffle/#wafflepixel","text":"A WafflePixel object is returned by Waffle.pixel(x,y) and Waffle[x,y] . from guizero import App, Waffle app = App() my_waffle = Waffle(app) my_waffle.pixel(x,y).color = \"red\" my_waffle[x,y].dotty = True app.display()","title":"WafflePixel"},{"location":"waffle/#properties_1","text":"You can set and get the following properties: Method Data type Description x int Returns the x position of the pixel on the widget x int Returns the y position of the pixel on the widget canvas_x int Returns the x position of the pixel on the canvas canvas_y int Returns the y position of the pixel on the canvas color color Sets or returns the color of the pixel dotty bool Set to True to make the pixel a circle size int Returns the size of the pixel in display pixels","title":"Properties"},{"location":"window/","text":"Window (Contains a tkinter.TopLevel object) __init__( self, master, title=\"guizero\", width=500, height=500, layout=\"auto\", bg=None, visible=True) What is it? A Window object is how you create new windows in guizero. How do I make one? Create an Window object like this: from guizero import App, Window app = App() window = Window(app) app.display() Starting parameters When you create a Window object you must specify a master and you can specify any of the the optional parameters. Specify parameters in the brackets like this: window = Window(app, bg=\"red\", height=200) Parameter Data type Default Compulsory Description master App - Yes The app to which the window belongs bg color None No The background colour of the window. Takes a color value. height int 500 No The height of the window in pixels. layout string \"auto\" No Whether widgets pack themselves ( \"auto\" ) or you specify their position on a grid ( \"grid\" ) title string \"guizero\" No The title displayed in the bar at the top of the window. width int 500 No The width of the window in pixels. visible boolean True No If the window should be visible. Methods You can call the following methods on a Window object. Method Takes Returns Description add_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None) tk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int) Widget Adds a tk widget into a guizero container. Note - this is an advanced feature see Using tk for more information. after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command disable() - - Disables all the widgets in the window so that they cannot be interacted with destroy() - - Destroys the windows enable() - - Enables all the widgets in the window exit_full_screen() - - Exit full screen display focus() - - Gives focus to the window hide() - - Hides the window from view. on_close(command) command (function name) - Calls the given function when the user tries to close the window. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. set_full_screen(keybind) String - Set the application to display full screen. Option to specify a key to exit full screen (default is 'Esc'.) show(wait = False) - - Displays the window if it was previously hidden update() - - Force the window to update itself, useful if changes aren't reflected in the UI. Properties You can set and get the following properties: Method Data type Description bg color The background colour of the window enabled boolean True if the window is enabled font string The font that widgets should use full_screen boolean False No Whether the App is full screen height int The height of the window layout string The layout being used by the Window ( \"auto\" ) or ( \"grid\" ) title string The title of the window text_size int The size of the text widgets should use text_color color The colour of the text widgets should use visible boolean If the window is visible width int The width of the window Refer to a property as <name of widget>.property . For example, if your Window object is called window you would write window.title . You can set the property (for example window.title = \"Hello world\" ) or get the value of the property to use (for example print(window.title) ). Examples Creating a Window object Create an Window object by calling the Window() constructor. You should give the object a name so you can refer to it later - in this case we have called it window . It is best to keep the name you give to your Window object quite short, as you will have to use it to tell other widgets where they should be stored. from guizero import App, Window app = App(title=\"My app\", height=300, width=200) window = Window(title = \"2nd Window\", height=300, width=200) app.display() Showing and hiding a Window Window objects can be shown and hidden using the show() and hide() methods: from guizero import App, Window, PushButton def open_window(): window_2.show() app = App(title=\"My app\", height=300, width=200) window = Window(app, title = \"2nd Window\", height=300, width=200) window.hide() open_button(app, text=\"open 2nd window\", command=open_window) app.display() If you want a Window to become the main window and stop all other windows responding until it is closed you can set the optional wait parameter to True when using show : def open_window(): window_2.show(wait = True)","title":"Window"},{"location":"window/#window","text":"(Contains a tkinter.TopLevel object) __init__( self, master, title=\"guizero\", width=500, height=500, layout=\"auto\", bg=None, visible=True)","title":"Window"},{"location":"window/#what-is-it","text":"A Window object is how you create new windows in guizero.","title":"What is it?"},{"location":"window/#how-do-i-make-one","text":"Create an Window object like this: from guizero import App, Window app = App() window = Window(app) app.display()","title":"How do I make one?"},{"location":"window/#starting-parameters","text":"When you create a Window object you must specify a master and you can specify any of the the optional parameters. Specify parameters in the brackets like this: window = Window(app, bg=\"red\", height=200) Parameter Data type Default Compulsory Description master App - Yes The app to which the window belongs bg color None No The background colour of the window. Takes a color value. height int 500 No The height of the window in pixels. layout string \"auto\" No Whether widgets pack themselves ( \"auto\" ) or you specify their position on a grid ( \"grid\" ) title string \"guizero\" No The title displayed in the bar at the top of the window. width int 500 No The width of the window in pixels. visible boolean True No If the window should be visible.","title":"Starting parameters"},{"location":"window/#methods","text":"You can call the following methods on a Window object. Method Takes Returns Description add_tk_widget(tk_widget, grid=None, align=None, visible=True, enabled=None, width=None, height=None) tk_widget (tk), grid (list), align (str), visible (bool), enabled (bool), width (int), height (int) Widget Adds a tk widget into a guizero container. Note - this is an advanced feature see Using tk for more information. after(time, command, args=None) time (int), command (function name), args (list of arguments) - Schedules a single call to command after time milliseconds. (To repeatedly call the same command, use repeat() ) cancel(command) command (function name) - Cancels a scheduled call to command disable() - - Disables all the widgets in the window so that they cannot be interacted with destroy() - - Destroys the windows enable() - - Enables all the widgets in the window exit_full_screen() - - Exit full screen display focus() - - Gives focus to the window hide() - - Hides the window from view. on_close(command) command (function name) - Calls the given function when the user tries to close the window. repeat(time, command, args=None) time (int), command (function name), args (list of arguments) - Repeats command every time milliseconds. This is useful for scheduling a function to be regularly called, for example updating a value read from a sensor. set_full_screen(keybind) String - Set the application to display full screen. Option to specify a key to exit full screen (default is 'Esc'.) show(wait = False) - - Displays the window if it was previously hidden update() - - Force the window to update itself, useful if changes aren't reflected in the UI.","title":"Methods"},{"location":"window/#properties","text":"You can set and get the following properties: Method Data type Description bg color The background colour of the window enabled boolean True if the window is enabled font string The font that widgets should use full_screen boolean False No Whether the App is full screen height int The height of the window layout string The layout being used by the Window ( \"auto\" ) or ( \"grid\" ) title string The title of the window text_size int The size of the text widgets should use text_color color The colour of the text widgets should use visible boolean If the window is visible width int The width of the window Refer to a property as <name of widget>.property . For example, if your Window object is called window you would write window.title . You can set the property (for example window.title = \"Hello world\" ) or get the value of the property to use (for example print(window.title) ).","title":"Properties"},{"location":"window/#examples","text":"Creating a Window object Create an Window object by calling the Window() constructor. You should give the object a name so you can refer to it later - in this case we have called it window . It is best to keep the name you give to your Window object quite short, as you will have to use it to tell other widgets where they should be stored. from guizero import App, Window app = App(title=\"My app\", height=300, width=200) window = Window(title = \"2nd Window\", height=300, width=200) app.display() Showing and hiding a Window Window objects can be shown and hidden using the show() and hide() methods: from guizero import App, Window, PushButton def open_window(): window_2.show() app = App(title=\"My app\", height=300, width=200) window = Window(app, title = \"2nd Window\", height=300, width=200) window.hide() open_button(app, text=\"open 2nd window\", command=open_window) app.display() If you want a Window to become the main window and stop all other windows responding until it is closed you can set the optional wait parameter to True when using show : def open_window(): window_2.show(wait = True)","title":"Examples"}]}
\ No newline at end of file
diff --git a/docs/search/worker.js b/docs/search/worker.js
new file mode 100644
index 00000000..a3ccc07f
--- /dev/null
+++ b/docs/search/worker.js
@@ -0,0 +1,128 @@
+var base_path = 'function' === typeof importScripts ? '.' : '/search/';
+var allowSearch = false;
+var index;
+var documents = {};
+var lang = ['en'];
+var data;
+
+function getScript(script, callback) {
+  console.log('Loading script: ' + script);
+  $.getScript(base_path + script).done(function () {
+    callback();
+  }).fail(function (jqxhr, settings, exception) {
+    console.log('Error: ' + exception);
+  });
+}
+
+function getScriptsInOrder(scripts, callback) {
+  if (scripts.length === 0) {
+    callback();
+    return;
+  }
+  getScript(scripts[0], function() {
+    getScriptsInOrder(scripts.slice(1), callback);
+  });
+}
+
+function loadScripts(urls, callback) {
+  if( 'function' === typeof importScripts ) {
+    importScripts.apply(null, urls);
+    callback();
+  } else {
+    getScriptsInOrder(urls, callback);
+  }
+}
+
+function onJSONLoaded () {
+  data = JSON.parse(this.responseText);
+  var scriptsToLoad = ['lunr.js'];
+  if (data.config && data.config.lang && data.config.lang.length) {
+    lang = data.config.lang;
+  }
+  if (lang.length > 1 || lang[0] !== "en") {
+    scriptsToLoad.push('lunr.stemmer.support.js');
+    if (lang.length > 1) {
+      scriptsToLoad.push('lunr.multi.js');
+    }
+    for (var i=0; i < lang.length; i++) {
+      if (lang[i] != 'en') {
+        scriptsToLoad.push(['lunr', lang[i], 'js'].join('.'));
+      }
+    }
+  }
+  loadScripts(scriptsToLoad, onScriptsLoaded);
+}
+
+function onScriptsLoaded () {
+  console.log('All search scripts loaded, building Lunr index...');
+  if (data.config && data.config.separator && data.config.separator.length) {
+    lunr.tokenizer.separator = new RegExp(data.config.separator);
+  }
+  if (data.index) {
+    index = lunr.Index.load(data.index);
+    data.docs.forEach(function (doc) {
+      documents[doc.location] = doc;
+    });
+    console.log('Lunr pre-built index loaded, search ready');
+  } else {
+    index = lunr(function () {
+      if (lang.length === 1 && lang[0] !== "en" && lunr[lang[0]]) {
+        this.use(lunr[lang[0]]);
+      } else if (lang.length > 1) {
+        this.use(lunr.multiLanguage.apply(null, lang));  // spread operator not supported in all browsers: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator#Browser_compatibility
+      }
+      this.field('title');
+      this.field('text');
+      this.ref('location');
+
+      for (var i=0; i < data.docs.length; i++) {
+        var doc = data.docs[i];
+        this.add(doc);
+        documents[doc.location] = doc;
+      }
+    });
+    console.log('Lunr index built, search ready');
+  }
+  allowSearch = true;
+  postMessage({allowSearch: allowSearch});
+}
+
+function init () {
+  var oReq = new XMLHttpRequest();
+  oReq.addEventListener("load", onJSONLoaded);
+  var index_path = base_path + '/search_index.json';
+  if( 'function' === typeof importScripts ){
+      index_path = 'search_index.json';
+  }
+  oReq.open("GET", index_path);
+  oReq.send();
+}
+
+function search (query) {
+  if (!allowSearch) {
+    console.error('Assets for search still loading');
+    return;
+  }
+
+  var resultDocuments = [];
+  var results = index.search(query);
+  for (var i=0; i < results.length; i++){
+    var result = results[i];
+    doc = documents[result.ref];
+    doc.summary = doc.text.substring(0, 200);
+    resultDocuments.push(doc);
+  }
+  return resultDocuments;
+}
+
+if( 'function' === typeof importScripts ) {
+  onmessage = function (e) {
+    if (e.data.init) {
+      init();
+    } else if (e.data.query) {
+      postMessage({ results: search(e.data.query) });
+    } else {
+      console.error("Worker - Unrecognized message: " + e);
+    }
+  };
+}
diff --git a/docs/sitemap.xml b/docs/sitemap.xml
index 1040ce81..d8f51dc6 100644
--- a/docs/sitemap.xml
+++ b/docs/sitemap.xml
@@ -1,228 +1,173 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
-
-    
     <url>
-     <loc>/about/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-    
-
-    
     <url>
-     <loc>/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-    
-
-    
-        
     <url>
-     <loc>/start/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/commands/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/multiple_windows/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/layout/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/alerts/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/size/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/colors/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/images/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/blocking/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/events/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/usingtk/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/gettinghelp/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
-    
-
-    
     <url>
-     <loc>/recipes/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-    
-
-    
-        
     <url>
-     <loc>/app/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/box/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/buttongroup/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/checkbox/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/combo/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/drawing/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/listbox/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/menubar/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/picture/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/pushbutton/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/slider/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/text/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/textbox/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/waffle/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/window/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
-    
-
-    
-        
     <url>
-     <loc>/contributing/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/development/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
     <url>
-     <loc>/deployment/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-        
-    
-
-    
     <url>
-     <loc>/changelog/</loc>
-     <lastmod>2019-04-18</lastmod>
+     <loc>None</loc>
+     <lastmod>2019-05-08</lastmod>
      <changefreq>daily</changefreq>
     </url>
-    
-
 </urlset>
\ No newline at end of file
diff --git a/docs/sitemap.xml.gz b/docs/sitemap.xml.gz
new file mode 100644
index 0000000000000000000000000000000000000000..64a72134b1af8efcb9933b96bd4e6c5830899e21
GIT binary patch
literal 216
zcmb2|=HOVm_fibg|KiM&)ZD}Zy^7o%hPT%@@*PqTV0&<PxxyRPtfWg)UgqxVwG2)h
zRWlbdMb%cXTzgEtz-pRxonFo7kG~ARyjWLja4yV3okux$YIaYqc8#6vCZ_92hx7OG
zTP-rlac<o$aol$4Ws`{si{ze2bbQw3UFAL9;raxlprnnCFVD#9$UfQ|{OHA+XC?3K
z7V;Dp^xoLC=gbYgWY?;=&804-m$v<S^flDv(ieZf`bn+}<JlY-7+D06iT`~2yl>4v
O%Kf%y>a=`*1_l7W1zxTI

literal 0
HcmV?d00001

diff --git a/docs/size/index.html b/docs/size/index.html
index 343c7119..b1cb27b7 100644
--- a/docs/size/index.html
+++ b/docs/size/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Sizes";
     var mkdocs_page_input_path = "size.md";
-    var mkdocs_page_url = "/size/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -224,7 +225,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -232,7 +233,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -398,9 +399,8 @@ <h2 id="sizes">Sizes</h2>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/slider/index.html b/docs/slider/index.html
index 5a11b1eb..1df50763 100644
--- a/docs/slider/index.html
+++ b/docs/slider/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Slider";
     var mkdocs_page_input_path = "slider.md";
-    var mkdocs_page_url = "/slider/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,21 @@
               
                 <h1 id="slider">Slider</h1>
 <p>(Contains a <code>tkinter.Scale</code> object)</p>
-<p><code>__init__(self, master, start=0, end=100, horizontal=True, command=None, grid=None, align=None)</code></p>
+<pre><code class="python">__init__(
+    self, 
+    master, 
+    start=0, 
+    end=100, 
+    horizontal=True, 
+    command=None, 
+    grid=None, 
+    align=None, 
+    visible=True, 
+    enabled=None, 
+    width=None, 
+    height=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>Slider</code> object displays a bar and selector which can be used to specify a value in a range.</p>
 <p>The above code looks like this on Windows:
@@ -597,9 +612,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/start/index.html b/docs/start/index.html
index e29cd423..e4f0e987 100644
--- a/docs/start/index.html
+++ b/docs/start/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Getting started";
     var mkdocs_page_input_path = "start.md";
-    var mkdocs_page_url = "/start/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -232,7 +233,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -240,7 +241,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -338,9 +339,8 @@ <h3 id="adding-widgets">Adding widgets</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/text/index.html b/docs/text/index.html
index 06edd766..98afa3e5 100644
--- a/docs/text/index.html
+++ b/docs/text/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Text";
     var mkdocs_page_input_path = "text.md";
-    var mkdocs_page_url = "/text/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -238,7 +239,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -246,7 +247,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -266,7 +267,22 @@
               
                 <h1 id="text">Text</h1>
 <p>(Contains a <code>tkinter.Label</code> object)</p>
-<p><code>__init__(self, master, text="", size=12, color="black", bg=None, font="Helvetica", grid=None, align=None, visible=True, enabled=None)</code></p>
+<pre><code class="python">__init__(
+    self,
+    master,
+    text=&quot;&quot;,
+    size=12,
+    color=&quot;black&quot;,
+    bg=None,
+    font=&quot;Helvetica&quot;,
+    grid=None,
+    align=None,
+    visible=True,
+    enabled=None,
+    width=None,
+    height=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>The <code>Text</code> object displays non editable text in your app, useful for titles, labels and instructions.</p>
 <p><img alt="Text on Windows" src="../images/text_windows.png" /></p>
@@ -604,9 +620,8 @@ <h3 id="properties">Properties</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/textbox/index.html b/docs/textbox/index.html
index df2bf67e..caa22e1b 100644
--- a/docs/textbox/index.html
+++ b/docs/textbox/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "TextBox";
     var mkdocs_page_input_path = "textbox.md";
-    var mkdocs_page_url = "/textbox/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,21 @@
               
                 <h1 id="textbox">TextBox</h1>
 <p>(Contains a <code>tkinter.Entry</code> object)</p>
-<p><code>__init__(self, master, text="", width=10, height=1, grid=None, align=None, visible=True, enabled=None, multiline=False, scrollbar=False, command=None)</code></p>
+<pre><code class="python">__init__(
+    self,
+    master,
+    text=&quot;&quot;,
+    width=10,
+    height=1,
+    grid=None,
+    align=None,
+    visible=True,
+    enabled=None,
+    multiline=False,
+    scrollbar=False,
+    command=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it</h3>
 <p>The <code>TextBox</code> object displays a text box which the user can type in.</p>
 <p><img alt="TextBox on Windows" src="../images/textbox_windows.png" /></p>
@@ -614,9 +629,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/usingtk/index.html b/docs/usingtk/index.html
index 627f3b4a..3b7d3190 100644
--- a/docs/usingtk/index.html
+++ b/docs/usingtk/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Using tkinter";
     var mkdocs_page_input_path = "usingtk.md";
-    var mkdocs_page_url = "/usingtk/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -232,7 +233,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -240,7 +241,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -276,6 +277,12 @@ <h3 id="using-tkinter-widgets-in-guizero">Using tkinter widgets in guizero</h3>
 a.display()
 </code></pre>
 
+<p>When adding a tk widget to a <code>Box</code> or a <code>Window</code> you will have to specify its <code>tk</code> property when creating the tk widget.</p>
+<pre><code class="python">box = Box(app)
+spinbox = Spinbox(box.tk, from_=0, to=10)
+box.add_tk_widget(spinbox)
+</code></pre>
+
 <h3 id="using-a-tkinter-method-on-a-guizero-object">Using a tkinter method on a guizero object</h3>
 <p>Each guizero widget itself contains a tk widget - you can find out which by looking on the guizero documentation page for the widget. For example, a guizero <code>TextBox</code> contains a tkinter <code>Entry</code> object. You can access the internal object using the syntax <code>&lt;object_name&gt;.tk</code>.</p>
 <p>In this example, we have guizero <code>App</code> and <code>TextBox</code> widgets and are using the tk widgets <code>config</code> method to change the mouse cursor when it is over the <code>TextBox</code>.</p>
@@ -329,9 +336,8 @@ <h3 id="using-a-tkinter-method-on-a-guizero-object">Using a tkinter method on a
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/waffle/index.html b/docs/waffle/index.html
index 8d05b5fe..8d60b3a2 100644
--- a/docs/waffle/index.html
+++ b/docs/waffle/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Waffle";
     var mkdocs_page_input_path = "waffle.md";
-    var mkdocs_page_url = "/waffle/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -242,7 +243,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -250,7 +251,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -270,7 +271,24 @@
               
                 <h1 id="waffle">Waffle</h1>
 <p>(Contains a <code>tkinter.Frame</code> object)</p>
-<p><code>__init__(self, master, height=3, width=3, dim=20, pad=5, color="white", dotty=False, grid=None, align=None, command=None, visible=True, enabled=None, bg=None)</code></p>
+<pre><code class="python">__init__(
+    self, 
+    master, 
+    height=3, 
+    width=3, 
+    dim=20, 
+    pad=5, 
+    color=&quot;white&quot;, 
+    dotty=False, 
+    grid=None, 
+    align=None, 
+    command=None, 
+    remember=True, 
+    visible=True, 
+    enabled=None, 
+    bg=None)
+</code></pre>
+
 <h3 id="what-is-it">What is it</h3>
 <p>The <code>Waffle</code> object display an n*n grid of squares with custom dimensions and padding</p>
 <p><img alt="Waffle on Windows" src="../images/waffle_windows.png" /></p>
@@ -697,9 +715,8 @@ <h3 id="properties_1">Properties</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/docs/window/index.html b/docs/window/index.html
index 7cce7587..7bbcc29b 100644
--- a/docs/window/index.html
+++ b/docs/window/index.html
@@ -13,18 +13,19 @@
 
   <link rel="stylesheet" href="../css/theme.css" type="text/css" />
   <link rel="stylesheet" href="../css/theme_extra.css" type="text/css" />
-  <link rel="stylesheet" href="../css/highlight.css">
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css">
   
   <script>
     // Current page data
     var mkdocs_page_name = "Window";
     var mkdocs_page_input_path = "window.md";
-    var mkdocs_page_url = "/window/";
+    var mkdocs_page_url = null;
   </script>
   
-  <script src="../js/jquery-2.1.1.min.js"></script>
-  <script src="../js/modernizr-2.8.3.min.js"></script>
-  <script type="text/javascript" src="../js/highlight.pack.js"></script> 
+  <script src="../js/jquery-2.1.1.min.js" defer></script>
+  <script src="../js/modernizr-2.8.3.min.js" defer></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
+  <script>hljs.initHighlightingOnLoad();</script> 
   
 </head>
 
@@ -35,10 +36,10 @@
     
     <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
       <div class="wy-side-nav-search">
-        <a href="../about/" class="icon icon-home"> guizero</a>
+        <a href=".." class="icon icon-home"> guizero</a>
         <div role="search">
   <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
-    <input type="text" name="q" placeholder="Search docs" />
+    <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
   </form>
 </div>
       </div>
@@ -240,7 +241,7 @@
       
       <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
         <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
-        <a href="../about/">guizero</a>
+        <a href="..">guizero</a>
       </nav>
 
       
@@ -248,7 +249,7 @@
         <div class="rst-content">
           <div role="navigation" aria-label="breadcrumbs navigation">
   <ul class="wy-breadcrumbs">
-    <li><a href="../about/">Docs</a> &raquo;</li>
+    <li><a href="..">Docs</a> &raquo;</li>
     
       
         
@@ -268,7 +269,17 @@
               
                 <h1 id="window">Window</h1>
 <p>(Contains a <code>tkinter.TopLevel</code> object)</p>
-<p><code>__init__(self, master, title="guizero", width=500, height=500, layout="auto", bg=None, visible=True):</code></p>
+<pre><code class="python">__init__(
+    self, 
+    master, 
+    title=&quot;guizero&quot;, 
+    width=500, 
+    height=500, 
+    layout=&quot;auto&quot;, 
+    bg=None, 
+    visible=True)
+</code></pre>
+
 <h3 id="what-is-it">What is it?</h3>
 <p>A <code>Window</code> object is how you create new windows in guizero.</p>
 <p><img alt="Window" src="../images/window.png" /></p>
@@ -609,9 +620,8 @@ <h3 id="examples">Examples</h3>
     </span>
 </div>
     <script>var base_url = '..';</script>
-    <script src="../js/theme.js"></script>
-      <script src="../search/require.js"></script>
-      <script src="../search/search.js"></script>
+    <script src="../js/theme.js" defer></script>
+      <script src="../search/main.js" defer></script>
 
 </body>
 </html>
diff --git a/guizero/__init__.py b/guizero/__init__.py
index 67c7f86a..df888a5a 100644
--- a/guizero/__init__.py
+++ b/guizero/__init__.py
@@ -1,6 +1,6 @@
 __name__ = "guizero"
 __package__ = "guizero"
-__version__ = '0.6.3'
+__version__ = '0.6.4'
 __author__ = "Laura Sach"
 
 from sys import exit