Widget layout

[Shawn_Pereira]

I vote for the inclusion of 4 optional parameters in every widget: x, y, w, h; namely XY coordinates & Width, Height. This will solve all layout issues.

I don’t know if this will be difficult to implement, but frankly, Streamlit has achieved the impossible until now, hence the hesitant suggestion.

Because of its low learning curve and ease of use, I have been using Streamlit more as a web development tool rather than a data science one. Kudos to the Streamlit team for all the effort.

[randyzwitch]

Hi @Shawn_Pereira -

I’m not qualified to think through all of the frontend issues, but one of the reasons why Streamlit is set up the way it is is to provide a reactive layout for any size screen. I think having static x, y, w, h parameters might work against that.

Maybe someone else can comment if I’m misunderstanding.

Best,
Randy

[Shawn_Pereira]

Thank you @randyzwitch , for the prompt response.

Maybe, if this can be somehow implemented, x, y, w, h, provided by the programmer can be preliminary anchor points, which screen resizing can override?

I’ll give you two examples of why I ask this:
a. In my Streamlit apps, for some reason, I get a lot of horizontal space between the address bar and the first text line (whether the said text is in the sidebar or the main page area). Because there is no way for me to reduce this, the person who uses my app (on the desktop) has to vertically scroll down the sidebar and main section separately, just to see all the content that would have otherwise ordinarily fitted on a single page, had not that horizontal space been inexplicably introduced between the address bar and the page content.
b. I have an app, which displays a number of question numbers (Q #1, Q #2…) as buttons in the sidebar for the user to click on. Buttons are generated via a loop. With this same loop, I also generate a tick / cross to the left of each button to indicate to the user if a Question has already been answered/not. Now there is no way for me to horizontally align a tick/cross text with a button, as they are of different sizes / heights. (I used a number of blank st.writes("") / st.caption("") along with an algorithm just to get vertical spacing as right as possible.)

Even the horizontal size of the button cannot be made uniform for a number of buttons placed one below another in a column, as the button text is of varying length.

The x,y,w,h would resolve these issues. The same logic can also be used to micro-adjust other elements (expanders, images, etc.) Hence, the suggestion.

Thank you once again for Streamlit - it is just awesome.