How to Implement Page Separation in Gradio?

I'm trying to use Gradio for creating a user interface, and I'm looking to implement a multi-page setup using it. I want to have different pages within the interface for different tasks. Could you guide me on how to achieve this?

I've gone through the Gradio documentation, but I couldn't find specific information on creating multiple pages. Could you provide me with some guidance or code examples on how to set up distinct pages within a Gradio interface? I'm aiming to create a user-friendly interface where users can navigate between different tasks easily.

Here's a simplified version of the code I have so far:

import gradio as gr

# Code for Task 1
def task1(input_text):
    # Task 1 logic
    return "Task 1 Result: " + input_text

# Code for Task 2
def task2(input_image):
    # Task 2 logic
    return "Task 2 Result"

# Main interface
iface = gr.Interface(
    fn=task1,
    inputs="text",
    outputs="text",
    title="Multi-Page Interface"
)

# Run the interface
iface.launch()

In the above code, I've shown how I'm currently setting up a Gradio interface for a single task. However, I'm unsure about how to extend this to include multiple pages, each with its own set of inputs and outputs for different tasks.

Could you please provide me with guidance on how to modify the code to achieve the desired multi-page interface using Gradio? Any code examples or suggestions would be greatly appreciated.

Thank you in advance for your assistance!

Solution

Gradio doesn't have pages but you can use Tabs to implement a similar functionality. Modifying your code slightly and using gr.TabbedInterface()-

    import gradio as gr

# Code for Task 1
def task1(input_text):
    # Task 1 logic
    return "Task 1 Result: " + input_text

# Code for Task 2
def task2(input_image):
    # Task 2 logic
    return "Task 2 Result"

# interface one
iface1 = gr.Interface(
    fn=task1,
    inputs="text",
    outputs="text",
    title="Multi-Page Interface"
)
# interface two
iface2 = gr.Interface(
    fn=task2,
    inputs="image",
    outputs="text",
    title="Multi-Page Interface"
)

demo = gr.TabbedInterface([iface1, iface2], ["Text-to-text", "image-to-text"])

# Run the interface
demo.launch(share=True)