Skip to main content
Join the official 2020 Python Developers SurveyStart the survey!

A python library simplifying development of ipyvuetify voila apps

Project description

vvapp

A python library simplifying ipyvuetify voila application building.

Documentation

https://radinplaid.github.io/vvapp/

Install

pip install vvapp

Inputs

vvapp is meant to be used in Jupyter, so launching jupyter first ($jupyter notebook).

There are a few key things to keep in mind when getting up and running with vvapp:

  • v_model
    • The value of vvapp inputs is set and accessed via the v_model attribute, following the ipyvuetify convention
  • class_
    • This is where you put vuetify.js class properties, like ma-4 to add margins around the input
  • style_
    • This is where you can add CSS to your elements
  • hint
    • The hint can be a string or a callable to provide input validation
    • If hint is a callable, it must return a string or None; if it returns a string, the input is marked as invalid and the string is displayed
from vvapp.inputs import __all__ as available_input_widgets
available_input_widgets
['switch',
 'checkbox',
 'text',
 'password',
 'time_input',
 'date',
 'date_range',
 'number',
 'range_slider',
 'slider',
 'radio_buttons',
 'select',
 'select_or_create',
 'button',
 'color_picker']

text

from vvapp.inputs import text
text(label='Text Input',hint='Enter some text',v_model='some text')
Text Input

select (dropdown)

For a select input, the v_model can be a list:

from vvapp.inputs import select
select(items=['one','two','three'],v_model='two')
Select Input

... or a dict where the keys are the labels to be displayed and the values and the values

select(items={'One':'one','Two':'two','Three':'three'},v_model='two')
Select Input

Also, it is possible for multiple items to be selected via the multiple prop:

tmp = select(items={'One':'one','Two':'two','Three':'three'},v_model=['one','two'],multiple=True)
tmp
Select Input
tmp.v_model
['one', 'two']

select_or_create (combobox)

from vvapp.inputs import select_or_create
select_or_create(items=['one','two','three'],v_model=['one','two'],multiple=True)

Combobox Input

switch

from vvapp.inputs import switch
switch(label='Switch example',v_model=True)
Switch Input

checkbox

from vvapp.inputs import checkbox
checkbox(label='Checkbox example',v_model=True)
Checkbox Input

slider

from vvapp.inputs import slider
slider(label='Slider Example',
       min=0,
       max=10,
       step=1,
       color='red',
       track_color='red',
       v_model=5)
Slider Input

range_slider

from vvapp.inputs import range_slider
range_slider(min=0,max=100,v_model=[40,60])
Range Slider input

radio_buttons

from vvapp.inputs import radio_buttons
radio_buttons(choices={
                    'Apple': 'apple',
                    'Blueberry': 'blueberry',
                    'Pumpkin': 'pumpkin'
                },
              label='What is your favourite pie flavour?',
              v_model='blueberry')
Radio Button Input

date

from vvapp.inputs import date
date(label='Please enter a date (format: YYYY-mm-dd)',
     v_model='2020-04-15',
     style_='max-width:320px')
Date Input

time

from vvapp.inputs import time_input
time_input(label='Please enter a time (format: HH:MM)',
     v_model='13:34',
     style_='max-width:320px')
Time Input

number

from vvapp.inputs import number
number(placeholder='Enter a number',
     style_='max-width:320px')
Number Input

number inputs have a default validation function that changes the error state of the input to True and prints a sensible hint if the value is less than min_value or greater than max_value

from vvapp.inputs import number
number(label='Number Input',
       v_model=123,
       min_value=0,
       max_value=100,
     style_='max-width:320px')
Number Input With Validation

password

from vvapp.inputs import password
pw = password(label='Please enter a password',v_model='correcthorsebatterystapler')
pw
Password Input

The value of of a vvapp widget is set/accessed by the v_model attribute, just like in ipyvuetify

pw.v_model
'correcthorsebatterystapler'

Here we demonstrate the use of a function to validate the value of the input.

In this example the password must be at least 12 characters, less than 64 characters and include at least one number:

import re
def validate_pw(widget_value):
    if widget_value is None:
        return 'Input must not be None'

    else:
        if len(widget_value) < 12:
            return 'Too Short!'

        if len(widget_value) > 64:
            return 'Too Long!'

        if not re.search('[0-9]+',widget_value):
            return 'Must contain at least one number!'

    return None

pw = password(label='Please enter a password',v_model='correcthorsebatterystapler', hint=validate_pw)
pw
Password Input with Validation

button

from vvapp.inputs import button
def print_test_on_click(*args):
    print('test')

button(label='I print `test` on click',
       size='large',
       color='teal',
       dark=True,
       on_click=print_test_on_click)

Button Input Example
button(icon='mdi-recycle',
       size='large',
       color='teal',
       dark=True,
       fab=True,
       class_='ma-4'
      )
Button Input Example

date_range

from vvapp.inputs import date_range
temp = date_range(dates=['2020-01-01','2020-02-01'])
temp
Date Range Input Example
temp.dates
['2020-01-01', '2020-02-01']

color_picker

from vvapp.inputs import color_picker
temp=color_picker()
temp
Color Picker Input Example
temp.v_model

Outputs

PandasTable

import pandas as pd
from vvapp.outputs import PandasTable
df = pd.DataFrame({'a':[1,2,3],'b':[2,3,4]})
PandasTable(data=df,title='My DataFrame')
Pandas Dataframe Output

The pandas DataFrame output has a nice warning/error display if the search returns zero results or if are no rows in the PandasDataframe:

import pandas as pd
from vvapp.outputs import PandasTable
df = pd.DataFrame({'a':[1,2,3],'b':[2,3,4]})
PandasTable(data=df,title='My DataFrame')
Pandas Dataframe Output No Search Results
import pandas as pd
from vvapp.outputs import PandasTable
PandasTable(data=pd.DataFrame(),title='My DataFrame')
Pandas Dataframe Output No Data

Markdown

from vvapp.outputs import markdown 

markdown("""
# Markdown Title

## Markdown Subtitle

Some body text

* a list element
* another list element
""")
Output Markdown

Snackbar

from vvapp.outputs import info_snackbar
info_snackbar(message='Message text', color='teal',timeout=10000)
Output Snackbar

Dialog Button

from vvapp.outputs import dialog_button
dialog_button(label='My Button',icon=None)
Dialog Button Example

Container

from vvapp.inputs import button
from vvapp.outputs import container
container(children=[
    button(color='red', label='Red'),
    button(color='blue', label='Blue'),
    button(color='green', label='Green')
])
Container Output Example

Row

from vvapp.inputs import button
from vvapp.outputs import row
container(children=[
    row(children=[button(color='red', label='Red')]),
    row(children=[button(color='blue', label='Blue')]),
    row(children=[button(color='green', label='Green')])
])
Row Output Example

Column

from vvapp.inputs import button
from vvapp.outputs import column
row(children=[
    column(order=1, cols=4, children=[button(color='red', label='Red')]),
    column(order=0, cols=4, children=[button(color='blue', label='Blue')]),
    column(order=2, cols=4, children=[button(color='green', label='Green')])
])
Column Example

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Files for vvapp, version 0.0.13
Filename, size File type Python version Upload date Hashes
Filename, size vvapp-0.0.13-py3-none-any.whl (17.8 kB) File type Wheel Python version py3 Upload date Hashes View
Filename, size vvapp-0.0.13.tar.gz (22.5 kB) File type Source Python version None Upload date Hashes View

Supported by

Pingdom Pingdom Monitoring Google Google Object Storage and Download Analytics Sentry Sentry Error logging AWS AWS Cloud computing DataDog DataDog Monitoring Fastly Fastly CDN DigiCert DigiCert EV certificate StatusPage StatusPage Status page