2

I want to create an interface with gradio where I have an initially hidden audio input, that after some steps, e.g. receiving instructions, the user can record audio. But when I make the audio input visible it is unable to record.

import gradio

with gradio.Blocks() as interface:
    recorder = gradio.Audio(source='microphone', type='filepath', visible=False)
    action_btn = gradio.Button('Start')
    def next_line(action):
        if action == 'Start':
            return {action_btn: 'Next', recorder: gradio.update(visible=True)}
        else:
            return {action_btn: 'Done', recorder: gradio.update(visible=False)}
    action_btn.click(next_line, inputs=[action_btn], outputs=[action_btn, recorder])
interface.launch(share=True)

Also, I am using it in a jupyter notebook at the moment for prototyping.

Can someone help me to workaround this issue, recording with a component that is sometimes hidden?

Bob
  • 13,867
  • 1
  • 5
  • 27

1 Answers1

1

Adding a component solely to outputs makes it interactive=False by default. Add your audio component to inputs to make it work:

import gradio

with gradio.Blocks() as interface:
    recorder = gradio.Audio(source='microphone', type='filepath', visible=False)
    action_btn = gradio.Button('Start')
    def next_line(action, _):
        if action == 'Start':
            return {action_btn: 'Next', recorder: gradio.update(visible=True)}
        else:
            return {action_btn: 'Done', recorder: gradio.update(visible=False)}
    action_btn.click(next_line, inputs=[action_btn, recorder], outputs=[action_btn, recorder])
interface.launch(share=True)
Yannick Funk
  • 1,319
  • 10
  • 23