gradio/demo/blocks_group/run.py
aliabid94 f2fd37ee59
Fix gr.Group, container=False (#4916)
* changes

* changes

* changes

* changes

* changes

* fix

* changes

* changes

* Deploy group demo

* changes

* changes

---------

Co-authored-by: Abubakar Abid <abubakar@huggingface.co>
Co-authored-by: freddyaboulton <alfonsoboulton@gmail.com>
2023-07-17 10:05:46 -07:00

113 lines
3.4 KiB
Python

import gradio as gr
def greet(name):
return "Hello " + name + "!"
with gr.Blocks() as demo:
gr.Markdown("### This is a couple of elements without any gr.Group. Form elements naturally group together anyway.")
gr.Textbox("A")
gr.Number(3)
gr.Button()
gr.Image()
gr.Slider()
gr.Markdown("### This is the same set put in a gr.Group.")
with gr.Group():
gr.Textbox("A")
gr.Number(3)
gr.Button()
gr.Image()
gr.Slider()
gr.Markdown("### Now in a Row, no group.")
with gr.Row():
gr.Textbox("A")
gr.Number(3)
gr.Button()
gr.Image()
gr.Slider()
gr.Markdown("### Now in a Row in a group.")
with gr.Group():
with gr.Row():
gr.Textbox("A")
gr.Number(3)
gr.Button()
gr.Image()
gr.Slider()
gr.Markdown("### Several rows grouped together.")
with gr.Group():
with gr.Row():
gr.Textbox("A")
gr.Number(3)
gr.Button()
with gr.Row():
gr.Image()
gr.Audio()
gr.Markdown("### Several columns grouped together. If columns are uneven, there is a gray group background.")
with gr.Group():
with gr.Row():
with gr.Column():
name = gr.Textbox(label="Name")
btn = gr.Button("Hello")
gr.Dropdown(["a", "b", "c"], interactive=True)
gr.Number()
gr.Textbox()
with gr.Column():
gr.Image()
gr.Dropdown(["a", "b", "c"], interactive=True)
with gr.Row():
gr.Number(scale=2)
gr.Textbox()
gr.Markdown("### container=False removes label, padding, and block border, placing elements 'directly' on background.")
gr.Radio([1,2,3], container=False)
gr.Textbox(container=False)
gr.Image("https://picsum.photos/id/237/200/300", container=False, height=200)
gr.Markdown("### Textbox, Dropdown, and Number input boxes takes up full space when within a group without a container.")
with gr.Group():
name = gr.Textbox(label="Name")
output = gr.Textbox(show_label=False, container=False)
greet_btn = gr.Button("Greet")
with gr.Row():
gr.Dropdown(["a", "b", "c"], interactive=True, container=False)
gr.Textbox(container=False)
gr.Number(container=False)
gr.Image(height=100)
greet_btn.click(fn=greet, inputs=name, outputs=output, api_name="greet")
gr.Markdown("### More examples")
with gr.Group():
gr.Chatbot()
with gr.Row():
name = gr.Textbox(label="Prompot", container=False)
go = gr.Button("go", scale=0)
with gr.Column():
gr.Radio([1,2,3], container=False)
gr.Slider(0, 20, container=False)
with gr.Group():
with gr.Row():
gr.Dropdown(["a", "b", "c"], interactive=True, container=False, elem_id="here2")
gr.Number(container=False)
gr.Textbox(container=False)
with gr.Row():
with gr.Column():
gr.Dropdown(["a", "b", "c"], interactive=True, container=False, elem_id="here2")
with gr.Column():
gr.Number(container=False)
with gr.Column():
gr.Textbox(container=False)
if __name__ == "__main__":
demo.launch()