【问题标题】:bokeh layout vertical alignment with buttons散景布局与按钮垂直对齐
【发布时间】:2018-05-13 15:38:37
【问题描述】:

我正在寻找 Bokeh 问题的解决方法。 当您将按钮和文本输入连续放置时,它们将不对齐。之所以会出现这种效果,是因为文本输入有一个标签,并在此处描述:https://github.com/bokeh/bokeh/issues/4817

screenshot of messed up alignment

示例代码:

# hello.py 

from bokeh.io import curdoc
from bokeh.layouts import column, row
from bokeh.models.widgets import TextInput, Button, Paragraph

# create some widgets
button = Button(label="Say HI")
input = TextInput(value="Bokeh")
output = Paragraph()

# add a callback to a widget
def update():
    output.text = "Hello, " + input.value
button.on_click(update)

# create a layout for everything
#layout = VBox(children=[HBox(children=[button, input]), output])
layout = column(row(button, input), output)

# add the layout to curdoc
curdoc().add_root(layout)

【问题讨论】:

    标签: python button row bokeh textinput


    【解决方案1】:

    设置TextInputcss_classes属性:

    input = TextInput(value="Bokeh", css_classes=["hide-label"])
    

    如果您的应用程序是文件夹,请将样式添加到模板文件夹中的index.html

    <style>
    .hide-label label{
        display: none !important;
    }
    </style>
    

    如果应用程序是脚本文件,则在样式表中添加Div 元素。

    【讨论】:

    • 我试过你建议的css,但没有用。但是 .hide-label { padding-top: 15px; } 成功了
    • 顺便说一句,.hide-label { display: none !important; } 使标签消失
    猜你喜欢
    • 2012-06-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-07-23
    • 2013-09-27
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多