Input widgets

루까까·2024년 10월 19일

Streamlit

목록 보기
4/8
post-thumbnail

저번 시간에는 Data Elements에 알아보았다. data를 표현하는 법에 대해서 배웠다면 이제 사용자들에게 값을 받아서 활용하는
Input widgets에 대해 알아보자.

Input widgets

버튼, 슬라이더, 텍스트 입력 등과 같은 위젯을 사용하여 앱에 직접적인 상호작용을 지원하는 기능이다.
매우 많은 widget이 존재하기에 필자가 사용해보았던 widget을 기반으로 설명하겠다.

st.button

st.button(
      label, 
      key=None, 
      help=None, 
      on_click=None, 
      args=None, 
      kwargs=None, *, 
      type="secondary", 
      icon=None, 
      disabled=False, 
      use_container_width=False
	) -> bool

가장 많이 쓰이는 widget이 아닐까 생각한다 실제로도 UI작업하면서 많이 사용하기도 하였다.

label

  • 버튼의 이름을 지정해주는 인자이다. 필수 값이다.

key

  • 해당 UI를 구별해주는 값이라고 생각하면 된다.
  • 이름이 같은 버튼이 여러개 인경우,(ex. Submit) label만 지정해주고 key을 지정하지 않으면 오류가 발생 할 수 있다.
    • 마찬가지로 key의 경우 자동적으로 session_state에 값이 저장된다.

help

  • 해당 버튼이 무엇을 지원하는 지 사용자에게 알려주는 기능이다.

on_click

  • 해당 버튼을 눌렀을 때 호출되는 함수를 의미한다.
    • 사용법은 나중에 기술하겠다

args

  • on_click에서 함수를 지정햇으면 해당 함수에 들어가는 인자를 기입하는 곳이다.
  • 지원하는 type은 tuple형식이다.

kwargs

  • on_click에서 함수를 지정햇으면 해당 함수에 들어가는 인자를 기입하는 곳이다.
  • 지원하는 type은 dict형식이다.

type

  • 버튼의 색깔을 바꿀 수 있는 기능이다.
  • primary로 지정하면 버튼이 빨간색으로 변한다.
    • 놀랍게도.. 끝이다..

icon

  • 버튼에 이모지나 icon을 삽일할수 있게 해주는 인자이다.

disabled

  • 버튼 활성화이다.
  • True이면 버튼이 비활성화 되며
  • False이면 버튼이 활성화가 된다.
  • 매우 유용하다.(조건을 만족하지 못하면 버튼을 못누르게 하는 등으로 사용 가능!)

use_container_width

  • st.columns 같은 layout의 크기에 따라 버튼의 크기가 조절되게 할 수 있는 기능이다.

button의 경우 return값으로 bool값을 받게 되는데
다음과 같이 이용할 수 있다.

import streamlit as st

if st.button(label='test'):
    st.write('Wow')

해당 버튼을 누르면 Wow라는 글씨가 화면에 표시된다.

st.selectbox

st.selectbox(
    label, 
    options, 
    index=0, 
    format_func=special_internal_function, 
    key=None, 
    help=None, 
    on_change=None, 
    args=None, 
    kwargs=None,
    *, 
    placeholder="Choose an option", 
    disabled=False, 
    label_visibility="visible"
) -> any

select box ui를 만들 수 있게 해주는 widget이다.
st.butoon에서 겹치는 기능이나 인자는 생략해서 서술하겠다.

options

  • selectbox에서 선택지를 제공하는 인자이다. Iterable한 type면 뭐든 가능하다.

index

  • 해당 ui가 화면에 표시될때 default값으로 무엇을 하지 선택하는 인자이다.
  • 0 이면, options인자의 첫번째 값이 default값으로 설정된다.
  • 아무런 값이 선택되게 하고 싶지 않다면 None으로 하면된다.

format_func

  • 사용자에게 표시되는 options의 형식을 지정하는 기능이다.
  • 만약 options에서는 [1, 2, 3]으로 하고 해당 값을 화면에서는
    1명, 2명, 3명 으로 보이게 하고 싶으면 해당 함수에 설정하면 된다.

on_change

  • 사용자가 선택했을 때, 자동으로 호출되는 함수를 지정하는 기능이다.

placeholder

  • 사용자가 어떠한 값도 선택하지 않을때 나오는 문구이다.
  • index가 None일때도 해당 문구가 노출된다.

label_visibility

  • 해당 ui의 label을 사용하고 싶지 않을 때, 사용하는 기능이다.
    • visible
      • label 노출(default값)
    • hidden
      • label 숨김(보이지 않을 뿐 공간은 차지)
    • collapsed
      • label 숨김(보이지도 않고 공간도 차지 X)

st.multiselect

st.multiselect(
    label, 
    options, 
    default=None, 
    format_func=special_internal_function, 
    key=None, 
    help=None, 
    on_change=None, 
    args=None, 
    kwargs=None, 
    *, 
    max_selections=None, 
    placeholder="Choose an option", 
    disabled=False, 
    label_visibility="visible"
) -> list

기본적으로 selectbox와 동일하다.
다만, selectbox와 차이점은 selectbox는 하나만 선택가능하지만
multiselect의 경우, 여러개를 선택할 수 있다는 점이다.

max_selections

  • 사용자가 최대 몇개를 선택할 수 있게 제한하는 기능이다.

st.checkbox

st.checkbox(
    label, 
    value=False,
    key=None, 
    help=None, 
    on_change=None, 
    args=None, 
    kwargs=None, 
    *, 
    disabled=False, 
    label_visibility="visible"
) -> bool

체크 박스 기능을 지원하는 함수이다.

value

  • defalut값을 설정하는 것이다.
  • false면 ui에서 빈박스로
  • true면 ui에서 체크된 박스로 표시된다.

st.radio

st.radio(
    label, 
    options, 
    index=0, 
    format_func=special_internal_function, 
    key=None, 
    help=None, 
    on_change=None, 
    args=None, 
    kwargs=None, 
    *, 
    disabled=False, 
    horizontal=False, 
    captions=None, 
    label_visibility="visible"
) -> any

radio ui를 제공하는 기능이다.

horizontal

  • 위에 사진처럼 가로로 보여줄지 아니면 세로로 보여줄지 선택하는 인자이다.

captions

  • radio 아래에 글을 표시하는 기능이다.

st.toggle

st.toggle(
    label, 
    value=False, 
    key=None, 
    help=None, 
    on_change=None, 
    args=None, 
    kwargs=None, 
    *, 
    disabled=False, 
    label_visibility="visible"
) -> bool

토글 기능을 지원하는 함수이다.
체크박스와 같이 결과값으로 bool값을 지원하지만
보이는 형태가 체크박스냐 토글의 차이가 있다.

출처
https://docs.streamlit.io/develop/api-reference/widgets

profile
기타치는 개발자

0개의 댓글