python - 如何处理ipywidgets中按钮的可变宽度

Question

我需要显示一堆按钮。每个按钮的描述对应于文本的每个单词。

为了给出文本外观，我想让按钮宽度与内部单词的长度一致。所以我创建了一个变量，根据字母的数量给我宽度 px 。

我不知道为什么，但它不能很好地工作。它适用于某些单词和其他单词。

一些想法？（在屏幕截图中看到“the”这个词没有足够的空间，只有 ... 是显示的。

最终目标当然是让文本看起来像我可以点击单词的文本一样正常。

谢谢。

mylist=['loren','ipsum','whapmmtever','loren','ipsum','otra','the','palabra','concept']

list_btns=[]
for i,word in enumerate(mylist):
    # here I try to define the width of the button as depending on the length of the word:
    wordwidth= str(len(word)*12) + 'px'
    wd_raw_save_button = widgets.Button(description=word,
                                        disabled=False,
                                        button_style='success',
                                        tooltip='check the word',
                                        icon='',
                                        layout = Layout(width = wordwidth, margin='0px 0px 0px 0px'))

    list_btns.append(wd_raw_save_button)



showcase=HBox(list_btns)
showcase

实际上，在运行 voila 以可视化结果之后，我得到了这个：

这不会给人以真实文本的印象，即单词之间的相同间距是最终目标。我在猜测，但我不确定，原因可能是字符的宽度不同，我将不得不逐个字符地计算宽度。但这并不能解释“the”这个词不适合按钮内部。第二种解释是，底层 CSS 假定某个最小边框“超出”了单词本身。无论如何，我不知道如何控制/影响它。

Answer 1

小部件的 CSS 控制有限。似乎有一个 40 像素左右的截断，文本将被截断。我使用了一个简单的max比较来希望接近您正在寻找的内容：

from ipywidgets import *
mylist=['loren','ipsum','whapmmtever','loren','ipsum','otra','the','palabra','concept', 'a'] * 2

list_btns=[]
for i,word in enumerate(mylist):
    # here I try to define the width of the button as depending on the length of the word:
    wordwidth= max(len(word) * 12, 40)
    wordwidth = str(wordwidth) + 'px'
    wd_raw_save_button = widgets.Button(description=word,
                                        disabled=False,
                                        button_style='success',
                                        tooltip='check the word',
                                        icon='',
                                        layout = Layout(width = wordwidth, margin='0px 0px 0px 0px')
                                       )

    list_btns.append(wd_raw_save_button)



showcase=HBox(list_btns, layout= Layout(width='100%'))
showcase