Giter Club home page Giter Club logo

Comments (4)

abidlabs avatar abidlabs commented on August 27, 2024

Hi @balaji-ramk thanks for the suggestion! We've recently added gr.render, which offers a way to build dynamic apps and is a more flexible API, please take a look here: https://www.gradio.app/guides/dynamic-apps-with-render-decorator

from gradio.

balaji-ramk avatar balaji-ramk commented on August 27, 2024

Hi, thanks a ton, this looks very useful, and I'll definitely try it out!
Also thanks for taking the time to reply!

PS after snooping throught the documentation and trying it out a bit, I've found that there isn't a way to store the outputs of this render block into a specific variable that can be used in future functions, see the below code:

import gradio as gr
import time

with gr.Blocks() as demo:
    with gr.Row():
        num1 = gr.Textbox()
        num2 = gr.Textbox()
    
    result_btn = gr.Button("Add")
    @gr.render(inputs=[num1, num2], triggers=[result_btn.click])
    def show_outputs(num1, num2):
        time.sleep(5)
        result_value = gr.Textbox(str(int(num1) + int(num2)))
        return result_value
    
    multiply_btn = gr.Button("Double")
    @gr.render(inputs=[result_value], triggers=[multiply_btn.click])
    def double_output(num):
        time.sleep(5)
        doubled = gr.Textbox(2 * int(num))
    
demo.launch()

Would suggest adding an outputs parameter to the render block to fix this, but doing so could lead to something like this:

import gradio as gr
import time

with gr.Blocks() as demo:
    with gr.Row():
        num1 = gr.Textbox()
        num2 = gr.Textbox()
    
    result_btn = gr.Button("Add")
    result_value = gr.Textbox(visible=False)
    @gr.render(inputs=[num1, num2], triggers=[result_btn.click], outputs=[result_value, result_value])
    def show_outputs(num1, num2):
        time.sleep(5)
        result_value = gr.Textbox(str(int(num1) + int(num2)))
        return result_value, gr.update(visible=True)
    
    multiply_btn = gr.Button("Double")
    multiply_value = gr.Textbox(visible=False)
    @gr.render(inputs=[result_value], triggers=[multiply_btn.click], outputs=[multiply_value, multiply_value])
    def double_output(num):
        time.sleep(5)
        doubled = gr.Textbox(2 * int(num))
        return doubled, gr.update(visible=False)
    
demo.launch()

Because of this limitation, I don't think this is a perfect solution to what I was looking for, as most of my workflows using gradio require this information to flow between modules, which this doesn't work for, as far as I can see.

Please do let me know if I am missing something, thanks a ton!

from gradio.

balaji-ramk avatar balaji-ramk commented on August 27, 2024

Hi @abidlabs I think I forgot to mention so don't know if you received a notification for this,

Sorry if this is spam, I'm not too sure how GitHub Issues work

from gradio.

abidlabs avatar abidlabs commented on August 27, 2024

Thanks for following up @balaji-ramk --

PS after snooping throught the documentation and trying it out a bit, I've found that there isn't a way to store the outputs of this render block into a specific variable that can be used in future functions, see the below code:

It is possible to use the rendered components directly in event triggers, as long as the events are defined inside of the render function. Here's an example:

import gradio as gr

with gr.Blocks() as demo:
    text_count = gr.State(1)
    add_btn = gr.Button("Add Box")
    add_btn.click(lambda x: x + 1, text_count, text_count)

    @gr.render(inputs=text_count)
    def render_count(count):
        boxes = []
        for i in range(count):
            box = gr.Textbox(key=i, label=f"Box {i}")
            boxes.append(box)

        def merge(*args):
            return " ".join(args)
        
        merge_btn.click(merge, boxes, output)


    merge_btn = gr.Button("Merge")
    output = gr.Textbox(label="Merged Output")

demo.launch()

from gradio.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.