Python Streamlit 알아보기 (2):Text Elements
목차
✔ st.markdown
st.markdown 기능은 Markdown 형식의 문자열을 앱에 표시하는 데 사용된다.
이 API는 일반 텍스트와 함께 Markdown 구문 요소(예: 헤더, 볼드, 이탤릭, 링크, 리스트)를 지원한다.
이를 통해 텍스트를 보다 다양하고 동적으로 표현할 수 있다.
옵션으로 unsafe_allow_html을 제공하여 HTML 코드를 직접 삽입할 수 있게 해준다.
이를 사용하면 HTML 태그를 사용하여 텍스트를 더 세밀하게 제어할 수 있다.
st.markdown(body, unsafe_allow_html=False, help=None)📌 st.markdown 인자
- body (str)
표시할 마크다운 텍스트를 입력한다 - unsafe_allow_html (bool)
True로 설정하면 HTML 태그를 사용할 수 있다. (기본값은 False) - help (str)
텍스트 옆에 표시되는 선택적 툴팁.
# Example
# 기본 마크다운 사용
st.markdown("# 대제목")
st.markdown("## 부제목")
st.markdown("*이탤릭체 텍스트*")
st.markdown("**볼드 텍스트**")
st.markdown("`인라인 코드`")
# 리스트와 링크를 포함하는 마크다운
st.markdown("""
- 목록 항목 1
- 목록 항목 2 [Google 링크](https://www.google.com)
""")
# HTML 태그 사용 (unsafe_allow_html=True일 때만 작동)
st.markdown("<span style='color:red'>빨간색 텍스트</span>", unsafe_allow_html=True)
✔ st.title
st.title는 애플리케이션에서 가장 큰 제목을 표시하는 데 사용된다.
st.title은 텍스트를 크고 눈에 띄는 형식으로 표시한다.
주로 페이지의 주제나 중요한 섹션의 시작을 나타내는 데 사용되며, 사용자의 주목을 끌기에 적합하다.
st.title(body, anchor=None, help=None)📌 st.title 인자
- body (str)
표시할 텍스트로, Github-flavored Markdown을 지원한다. - anchor (str or False)
제목의 앵커 이름으로, URL에서 #anchor를 사용하여 접근할 수 있다.
생략하면 body를 기반으로 앵커를 생성하고, False로 설정하면 UI에 앵커가 표시되지 않는다. - help (str)
제목 옆에 표시되는 선택적 툴팁이다.
# Example
st.title('타이틀', help='Title')
st.title('_Streamlit_ _:green[Text Elements]_ :sunglasses:')
✔ st.header
st.header는 텍스트를 헤더(제목) 형식으로 표시한다.
Github-flavored 형식의 마크다운, 이모지, LaTeX 표현식, 색상 있는 텍스트를 지원한다.
st.header(body, anchor=None, help=None, divider=False)📌 st.header 인자
- body (str)
표시할 텍스트로, Github-flavored Markdown을 지원한다. - anchor (str or False)
헤더의 앵커 이름으로, URL에서 접근 가능하다.
생략 시 자동 생성, False면 UI에 표시 하지 않는다. - help (str)
툴팁으로, 헤더 옆에 표시된다. - divider (bool or color)
헤더 아래에 색상 있는 구분선을 표시합니다.
True면 순차적 색상, 색상명으로 직접 지정 가능.
# Example
st.header('디바이더가 있는 헤더', divider='rainbow')
st.header('_스트림릿_ :blue[HEADER] :smile:')
✔ st.subheader
st.subheader는 텍스트를 서브헤더(부제목) 형식으로 표시하는 기능을 가지고 있다.
st.subheader(body, anchor=None, help=None, divider=False)📌 st.subheader 인자
- body (str)
표시할 텍스트로, Github-flavored Markdown을 지원한다. - anchor (str or False)
헤더의 앵커 이름으로, URL에서 접근 가능하다.
생략 시 자동 생성, False면 UI에 표시 하지 않는다. - help (str)
툴팁으로, 헤더 옆에 표시된다. - divider (bool or color)
헤더 아래에 색상 있는 구분선을 표시합니다.
True면 순차적 색상, 색상명으로 직접 지정 가능.
# Example
st.subheader('부제목', divider='gray')
st.subheader('_스트림릿_ :red[SUBHEADER] :cry:')
✔ st.caption
st.caption은 작은 글씨체로 텍스트를 표시하는 데 사용된다.
주로 캡션, 주석, 각주, 부주 및 기타 설명 텍스트에 사용된다.
st.caption(body, unsafe_allow_html=False, help=None)📌 st.caption 인자
- body (str)
표시할 텍스트로, Github-flavored Markdown을 지원한다. - unsafe_allow_html (bool)
HTML 태그를 사용하려면 True로 설정한다. - help (str)
선택적 툴팁으로, 캡션 옆에 표시된다.
# Example
st.caption('이것은 매우 작은 캡션 텍스트')
st.caption('폰트를 _이탤릭체_ / 컬러는 :blue[파랗게] / :angry:')
✔ st.code
st.code는 코드 블록을 표시하며 구문 강조 기능을 제공한다.
st.code(body, language="python", line_numbers=False)📌 st.code 인자
- body (str)
표시할 코드 문자열. - language (str or None)
구문 강조에 사용될 프로그래밍 언어를 지정.
기본값은 "python"이며, None으로 설정하면 스타일이 적용되지 않는다. - line_numbers (bool)
코드 블록 왼쪽에 줄 번호를 표시할지 여부를 결정한다.
기본값은 False입니다.
# Example
# Python
py_code = '''def say_hello() :
print("Hello, world!")
'''
st.code(py_code, language="python")
# JavaScript
js_code = '''const sayHello = ()=>{
console.log("Hello, Streamlit!")
}
'''
st.code(js_code, language="javascript", line_numbers=True)
✔ st.text
st.text는 고정 너비와 사전에 서식이 지정된 텍스트를 표시하는데 사용된다.
간단하게 단순 텍스트를 출력할 때 사용한다.
st.text(body, help=None)📌 st.text 인자
- body (str)
표시할 문자열. - help (str)
선택적인 툴팁으로, 텍스트 옆에 표시된다.
# Example
st.text("단순 텍스트 출력")
✔ st.latex
st.latex는 수학적 표현식을 LaTeX 형식으로 표시하는 데 사용된다.
st.latex(body, help=None)📌 st.latex 인자
- body (str 또는 SymPy 표현식)
LaTeX으로 표시할 문자열 또는 SymPy 표현식입니다. 문자열의 경우 raw Python 문자열을 사용하는 것이 좋습니다. - help (str)
LaTeX 표현식 옆에 표시되는 선택적 툴팁입니다.
# Example
st.latex(r'''
\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}
''')
✔ st.divider
st.divider는 수평선을 표시하는 데 사용된다.
주로 콘텐츠 사이의 구분을 위해 사용되며, 별도의 인자를 받지 않는다.
간단하게 st.divider()라고 호출함으로써, Streamlit 앱 내에서 구분선을 그릴 수 있다.
st.divider()# Example
st.selectbox("Select Slider", options=["A", "B", "C"])
st.divider()
st.slider("Slider", min_value=1, max_value=10)
이번 포스트에서는 Streamlit의 Text Elements에 대해서 알아보는 시간을 가졌다.
생각보다 종류가 다양했고 사용하기에는 엄청 쉽게 느껴지긴 했다.
다만, Github-flavored Markdown이나 Latex를 위한 수식 작성하는 문법 같은 것은 사용하려면 별도로 또 스터디를 해야겠다.
이 부분은 나중에 시간되면 추가로 포스팅 해봐야겠다.
저를 응원해주세요!
'Python > Streamlit' 카테고리의 다른 글
| Python Streamlit 알아보기 (5-1):Chart Elements - Simple Charts (0) | 2024.03.03 |
|---|---|
| Python Streamlit 알아보기 (4-2):Column configuration (0) | 2024.02.08 |
| Python Streamlit 알아보기 (4-1):Column configuration (0) | 2024.01.20 |
| Python Streamlit 알아보기 (3):Data Elements (0) | 2024.01.13 |
| Python Streamlit 알아보기 (1):Introduction (0) | 2024.01.01 |
이번 포스트에서는 Streamlit의 Text Elements에 대해서 알아보는 시간을 갖겠다.
Streamlit의 API들 중 텍스트와 관련된 API인데 어떤 종류가 있는지 사용 방법과 옵션이 어떤 게 있는지 확인해보겠다.