在ipyvuetify中使用图像作为图标

Question

我正在使用ipyvuetify来编码一个应用程序，以呈现与voila，我想使用一个图像作为图标的页脚(或在未来的按钮)。你知道怎么做吗？

这是图标的代码

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'])]

这将生成：

​

我想使用我自己的徽标，而不是预定义的指纹。那么，如何加载图像并给出字体的相对大小呢？

谢谢

Answer 1

目前似乎还没有好的方法来简单地将相对链接传递给ipyvuetify并让它显示图像(如果有)。

我发现的一种解决方法是使用ipywidgets打开文件，并将其作为对象传递给ipyvuetify：

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'])]
        )

检查这是否解决了您的问题;)

Answer 2

通过对Christoph Weiss-Schabers的一些修改，答案可以用ipyvuetify完成：

import base64
import ipyvuetify as v

file = open( 'LINK_TO_YOUR_ICON', 'rb')
image = file.read()
image_base64 = base64.b64encode(image).decode('ascii')
img = v.Img(src=f'data:image/png;base64,{image_base64}')

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'])]
        )

或者对于在线图像：

v.Img(src='https://homepages.cae.wisc.edu/~ece533/images/fruits.png', width='100', height='100')