Search code examples
pythonvuetify.jsipywidgetsvoila

use an image as icon in ipyvuetify


I am using ipyvuetify to code an app to be rendered with voila and I would like to use an image as icon for footer (or in the future for a button). Any idea how to do it?

This is the code for an icon

v.Footer( absolute = False,
          class_="font-weight-medium",
          children= [v.Col(class_="text-center", cols="12", children=[v.Icon(children=['fingerprint']),'BMW - 2020 - alpha version 0.0. powered by Soft company PPP'])]

this will generate: enter image description here

I want to use my own logo instead of the predefined fingerprint. So how can I load an image and give a relative size to the font.

thanks


Solution

  • Currently there seems to be no good way to simply pass relative link to ipyvuetify and have it display the image (if there).

    A workaround I found is to open the file with ipywidgets and pass this to ipyvuetify as object:

    import ipywidgets as widgets
    file = open( 'LINK_TO_YOUR_ICON', 'rb')
    image = file.read()
    img = widgets.Image(value=image, format='png')
    
    v.Footer( absolute = False,
              class_="font-weight-medium",
              children= [v.Col(class_="text-center", cols="12", children=[img,'BMW - 2020 - alpha version 0.0. powered by Soft company PPP'])]
            )
    

    check if this solves your problem ;)