GRADIO: Change position of second slider, when value lower than on first one

I have 2 sliders created in Gradio:

 number1 = gr.Slider(0, 20, step=1, label='number1', default=0, interactive=True) number2 = gr.Slider(0, 20, step=1, label='number2', default=0, interactive=True) gr.Interface(add_function, [number1, number2], "number", live=True).launch(debug=True)

I would like to change position of second slider dynamically. When value of first slider is bigger than on second slider, second slider should get the same position as the first one, eg. first slider = 4 second slider = 1 Then second's slider position should change to 4 as well.

It is possible to do it using gr.Interface or only using Gradio Box?

1 Answer

Ok, I found solution using Gradio Box:

def compare(number1, number2): if number1 > number2: number2 = number1 return number2
def add_function(number1, number2): return number2 + number1
with gr.Blocks() as demo: with gr.Row(): with gr.Column(): slider1 = gr.Slider(0, 100, default=50, label="number1", interactive=True) slider2 = gr.Slider(0, 100, default=50, label="number2", interactive=True) with gr.Column(): predict = gr.Button() output = gr.Number(label="output") slider1.change(compare, [slider1, slider2], slider2) click_event = predict.click(add_function, [slider1, slider2] , output)
demo.queue().launch()

Not so fast, but solve my problem :)