App

The App class defines the structure of the application. It contains a root view, what you get when you go to ‘/’. It subscribes functions to component events and builds the application.

class bowtie.App(rows=1, columns=1, sidebar=True, title='Bowtie App', basic_auth=False, username='username', password='password', theme=None, background_color='White', host='0.0.0.0', port=9991, socketio='', debug=False)

Core class to layout, connect, build a Bowtie app.

Create a Bowtie App.

Parameters:

• row (int, optional) – Number of rows in the grid.
• columns (int, optional) – Number of columns in the grid.
• sidebar (bool, optional) – Enable a sidebar for control widgets.
• title (str, optional) – Title of the HTML.
• basic_auth (bool, optional) – Enable basic authentication.
• username (str, optional) – Username for basic authentication.
• password (str, optional) – Password for basic authentication.
• theme (str, optional) – Color for Ant Design components.
• background_color (str, optional) – Background color of the control pane.
• host (str, optional) – Host IP address.
• port (int, optional) – Host port number.
• socketio (string, optional) – Socket.io path prefix, only change this for advanced deployments.
• debug (bool, optional) – Enable debugging in Flask. Disable in production!

add(widget)

Add a widget to the grid in the next available cell.

Searches over columns then rows for available cells.

Parameters:widget (bowtie._Component) – A Bowtie widget instance.

add_route(view, path, exact=True)

Add a view to the app.

Parameters:

• view (View) –
• path (str) –
• exact (bool, optional) –

add_sidebar(widget)

Add a widget to the sidebar.

Parameters:widget (bowtie._Component) – Add this widget to the sidebar, it will be appended to the end.

load(func)

Call a function on page load.

Parameters:func (callable) – Function to be called.

respond(pager, func)

Call a function in response to a page.

When the pager calls notify, the function will be called.

Parameters:

• pager (Pager) – Pager that to signal when func is called.
• func (callable) – Function to be called.

Examples

Using the pager to run a callback function.

>>> from bowtie.pager import Pager
>>> app = App()
>>> pager = Pager()
>>> def callback():
...     pass
>>> def scheduledtask():
...     pager.notify()
>>> app.respond(pager, callback)

schedule(seconds, func)

Call a function periodically.

Parameters:

• seconds (float) – Minimum interval of function calls.
• func (callable) – Function to be called.

subscribe(func, event, *events)

Call a function in response to an event.

If more than one event is given, func will be given as many arguments as there are events.

Parameters:

• func (callable) – Function to be called.
• event (event) – A Bowtie event.
• *events (Each is an event, optional) – Additional events.

Examples

Subscribing a function to multiple events.

>>> from bowtie.control import Dropdown, Slider
>>> app = App()
>>> dd = Dropdown()
>>> slide = Slider()
>>> def callback(dd_item, slide_value):
...     pass
>>> app.subscribe(callback, dd.on_change, slide.on_change)

View

Views are responsible for laying components out on a webpage. Each view defines a grid and optional sidebar. Each app comes with one root view and you can add as many additional routes and view as you want.

class bowtie.View(rows=1, columns=1, sidebar=True, background_color='White')

Grid of widgets.

Create a new grid.

add(widget)

Add a widget to the grid in the next available cell.

Searches over columns then rows for available cells.

Parameters:widget (bowtie._Component) – A Bowtie widget instance.

add_sidebar(widget)

Add a widget to the sidebar.

Parameters:widget (bowtie._Component) – Add this widget to the sidebar, it will be appended to the end.

Size

Each row and column in the app is a Size object. The space used by each row and column can be changed through the following methods.

class bowtie._app.Size

Size of rows and columns in grid.

This is accessed through .rows and .columns from App and View instances.

This uses CSS’s minmax function.

The minmax() CSS function defines a size range greater than or equal to min and less than or equal to max. If max < min, then max is ignored and minmax(min,max) is treated as min. As a maximum, a <flex> value sets the flex factor of a grid track; it is invalid as a minimum.

Examples

Laying out an app with the first row using 1/3 of the space and the second row using 2/3 of the space.

>>> app = App(rows=2, columns=3)
>>> app.rows[0].fraction(1)
>>> app.rows[1].fraction(2)

Create a default row or column size with fraction = 1.

auto()

Set the size to auto or content based.

fraction(value)

Set the fraction of free space to use as an integer.

min_auto()

Set the minimum size to auto or content based.

min_percent(value)

Set the minimum percentage of free space to use.

min_pixels(value)

Set the minimum size in pixels.

percent(value)

Set the percentage of free space to use.

pixels(value)

Set the size in pixels.

Gap

Set the margin between the cells of the grid in the App.

class bowtie._app.Gap

Margin between rows or columns of the grid.

This is accessed through .row_gap and .column_gap from App and View instances.

Examples

Create a gap of 5 pixels between all rows.

>>> app = App()
>>> app.row_gap.pixels(5)

Create a default margin of zero.

percent(value)

Set the margin as a percentage.

pixels(value)

Set the margin in pixels.