Gradio(1) - 常用基础组件展示

工作中有用到Gradio来构建简单的工具Web，这里放个常用的基础组件demo。
更多的还是需要参照官方文档 https://www.gradio.app/docs

图例

代码

import random
import datetime
import gradio as gr

click_button_text = ""
global_show_text = []


def click_button(text):
    global click_button_text
    click_button_text = text

    return text


def change_select(text):
    return str(text)


def flush_show_click_button_text_value():
    def inner():
        global click_button_text
        return click_button_text

    return inner()


def auto_show_text():
    def inner():
        global global_show_text
        global_show_text.append(f'{datetime.datetime.now().strftime("%m-%d %H:%M:%S")} 随机生成: {random.random()}')
        show_text = "\n".join(global_show_text)
        return show_text

    return inner


def identity(x, state):
    state += 1
    return x, state, state


def message_error():
    raise gr.Error("发生错误！")


def message_info():
    raise gr.Info("信息提示")


def message_warning():
    raise gr.Warning("警告！")


with gr.Blocks() as tab_1:
    demo_label_1 = gr.Label("基本组件展示1")

    # 按钮
    with gr.Row() as row_1:
        button_1 = gr.Button("按钮1")
        button_2 = gr.Button("按钮2", size='lg')
        button_3 = gr.Button("按钮3", link='subPath')
        # every 是更新的频率，数值越低频率越快
        show_click_button_text_1 = gr.Label(label="最近一次点击-自动更新", value=flush_show_click_button_text_value, every=0.3)
        show_click_button_text_2 = gr.Label(label="最近一次点击-事件返回", value="")

    # 绑定函数
    button_1.click(click_button, inputs=[button_1], outputs=[show_click_button_text_2])
    button_2.click(click_button, inputs=[button_2], outputs=[show_click_button_text_2])
    button_3.click(click_button, inputs=[button_3], outputs=[show_click_button_text_2])

    # 选择
    with gr.Column() as column_1:
        with gr.Row() as col_sub_row1:
            select_1 = gr.Dropdown(
                ["cat", "dog", "bird"], label="下拉框", info="Will add more animals later!"
            )
            show_select_1 = gr.Label(label="下拉框选择", value="")

        with gr.Row() as col_sub_row2:
            select_2 = gr.CheckboxGroup(["China", "USA", "Japan", "Pakistan"], value=["China"], label="多选框", info="Where are they from?")
            show_select_2 = gr.Label(label="多选框选择", value="")

        with gr.Row() as col_sub_row3:
            select_3 = gr.Radio(["park", "zoo", "road"], label="单选框", info="Where did they go?")
            show_select_3 = gr.Label(label="单选框选择", value="")

        with gr.Row() as col_sub_row4:
            select_4 = gr.Checkbox(label="Morning", info="Did they do it in the morning?")
            show_select_4 = gr.Label(label="CheckBox选择", value="")

    select_1.change(change_select, inputs=[select_1], outputs=[show_select_1])
    select_2.change(change_select, inputs=[select_2], outputs=[show_select_2])
    select_3.change(change_select, inputs=[select_3], outputs=[show_select_3])
    select_4.change(change_select, inputs=[select_4], outputs=[show_select_4])


with gr.Blocks() as tab_2:
    demo_label_2 = gr.Label("基本组件展示2")
    with gr.Row() as tab_2_row_1:
        btn_err = gr.Button(value="错误提示")
        btn_info = gr.Button(value="信息提示")
        btn_warn = gr.Button(value="警告提示")

    btn_err.click(message_error)
    btn_info.click(message_info)
    btn_warn.click(message_warning)

    with gr.Row() as tab_2_row_2:
        fre_slider = gr.Slider(label='滑块', value=10, minimum=0, maximum=100, step=0.1)
        fre_state = gr.State(value=0)
        slider_number = gr.Number(label="滑块值")
        slider_number2 = gr.Number(label="滑块操作次数")
    fre_slider.release(identity, inputs=[fre_slider, fre_state], outputs=[slider_number, fre_state, slider_number2])

    with gr.Row() as tab_2_row_3:
        show_text1 = gr.Text(label="文本框", info="info", value="")
        show_text2 = gr.Textbox(label="自动渲染", info="auto show", value=auto_show_text(), every=1, max_lines=10)


if __name__ == "__main__":
    demo = gr.TabbedInterface([tab_1, tab_2], ["常用组件展示1", "常用组件展示2"])
    demo.launch(server_name="0.0.0.0", server_port=7860)