Multiline label for radio widget

Using Streamlit
1

Hi there,

is there a way to force a new line in the label of the radio widget? This doesn’t work:

vis_outliers= st.radio(
   'Display outliers?\n(for data that might have errors only)',
   ['no', 'yes', 'hidden']
)

Thanks for your help.

2

Hi, how about doing this as an alternative:

  1. st.text(‘Display outliers?\n(for data that might have errors only’)

OR

  1. st.text(‘Display outliers?’)
    st.text(‘for data that might have errors only’)

AND

  1. vis_outliers= st.radio(’’,[‘no’, ‘yes’, ‘hidden’])
3

Hi Shawn,

thanks for your response. Unfortunately \n doesn’t seem to work in st.text( either. Your second suggestion kind of works, but the spacing between the lines and between the text and the radio buttons gets too big (I have a little bit of OCD when it comes to formatting :wink:).

I guess I’ll stick with having everything in one line.

Thanks anyway.

4

Hi @lasinludwig , there’s another thing you can try. Check the code below:

import streamlit as st
sc1, sc2 = st.columns((1,7))
with sc1:
st.caption(“With wrap”)
vis_outliers= st.radio(
‘Display outliers?\n(for data that might have errors only)’,
[‘no’, ‘yes’, ‘hidden’], key=“a”)

with sc2:
st.caption(“Without column wrap”)
vis_outliers= st.radio(
‘Display outliers?\n(for data that might have errors only)’,
[‘no’, ‘yes’, ‘hidden’], key=“b”)

Cheers

5

Hi @Shawn_Pereira

I don’t think this would work. If I understand this code correctly, you put the radio menu in a very narrow column. This wouldn’t allow you to define the position of the new line though. As far as I know the column width is connected to the window size of the browser. Also, since the second line of the text is longer than the first, you would get a line break in the second line as well…

6

Hi @lasinludwig ,

I’ll explain differently:

  1. You may want to display many lines / rows of matter onscreen (text, widgets, etc.)
  2. Each line can be split into different number of columns of different lengths (so line 1 can have 3 columns and line 2 can have 7 columns, etc. ; OR line 1 and line 2 can both have 3 columns of the same / different length
  3. Within our line in the code above, we put 2 widgets (caption & radio) in each column - so you can consider these as 2 sublines.
  4. The same logic replicates for all subsequent lines /rows onscreen.

Yes, in my code, I adjusted the column width to simulate a wrap to 2 lines, because individual writes would have given you a larger vertical gaps.

You won’t be able to micro-adjust as with some other programming languages.

Hope that’s understandable.

Anyway, I think you have already figured out a different solution.

Cheers

1 Like
7

This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.