개발/대시보드

웹 대시보드 - 여러 UI 함수 3(button,radio,checkbox,selectbox,multiselect,slider,expander)

웅'jk 2022. 12. 12. 17:34
button 버튼을 생성한다.
radio 라디오 형식으로 버튼을 생성한다.
checkbox 체크를 만든다.
selectbox 선택박스를 만든다.
multiselect 선택박스를 여러개 선택할수 있다.
slider 슬라이더 형식으로 만들 수 있다.
expander 확장탭을 만들 수 있다.

 

1. button

 # 버튼을 클릭하면, 데이터프레임이 보이도록 만들기.
    
    if st.button('데이터프레임 보기') :
        st.dataframe(df)
    
    # 버튼을 누르면 소문자와 대문재로 바꿔주기.
    name = 'Mike'

    if st.button('대문자로') :
        st.text(name.upper())

    if st.button('소문자로') :
        st.text(name.lower())

 

2. radio

 # 라디오 버튼
    status = st.radio('정렬을 선택하세요' , ['오름차순','내림차순','다른정렬'] )
    
    if status =='오름차순' :
        # df의 petal_length 컬럼을 오름차순으로 정렬해서 보여주세요.
        st.dataframe(df.sort_values('petal_length',ascending=True))
    elif status == '내림차순' :
        # df의 petal_length 컬럼을 내림차슨으로 정렬해서 보여주세요.
        st.dataframe(df.sort_values('petal_length',ascending=False))

 

3.checkbox

 # 체크박스를 체크하면, 데이터프레임이 나오고,
    # 해제하면, 데이터프레임이 나오지 않게
    if st.checkbox('show/hide') :
        st.dataframe(df)
    else :
        st.write('')

 

4.selectbox

# 셀렉트 박스 : 여러개 중에 한개 선택
    laguage = ['Python','C','JAVA','PHP','GO']
    my_choice = st.selectbox('좋아하는 언어를 선택하세요.',laguage)

    # 유저가 선택하면, 해당 언어를 다음처럼 표시해준다.
    # 저는 Python 언어를 가장 좋아합니다.
    # 저는 JAVA 언어를 가장 좋아합니다.
    st.write('저는 '+ my_choice+ ' 언어를 가장 좋아합니다.')
    st.text('저는 '+ my_choice+ ' 언어를 가장 좋아합니다.')

    # 만약 유저가 선택한 언어가, 파이썬이나 php,Go 언어이면,
    # 배우기 쉽습니다. 라고 화면에 보여주고,
    # java나 c를 선택하면, 배우기 어렵습니다 라고 화면에 보여주세요.
    if my_choice in ['PHP','Python','GO'] :
        st.text('배우기 쉽습니다.')
    else :
        st.text('배우기 어렵습니다.')

 

 

5. multiselectbox

 # 여러개를 선택할 수 있게 하는 multiselect box
    # 아이리스 데이터프레임의 컬럼이름을 가져오세요.
    selected_list = st.multiselect('원하는 컬럼을 선택하세요',df.columns )
    
    
    # 유저가 컬럼을 선택하면, 해당컬럼을 화면에 보여주고,
    # 유저가 아무컬럼도 선택하지 않으면, 데이터 프레임 보여주지 않는다.
    if len(selected_list) > 0 :
        st.dataframe(df[selected_list])
    else : 
        st.text('')

 

6. slider

 # 슬라이더
    age = st.slider('나이',1,100)
    st.text('당신이 선택한 나이는 '+ str(age) + '입니다.')

    st.slider('데이터',1,100,step=5)
    
    st.slider('데이터',1,200,value=75) #value는 기본값.

    st.slider('데이터',0.0,1.0,step=0.1) # 소수점은 min,max 값을 소수로 설정해야함.

 

7. expander

 with st.expander('hello') :
        st.text('안녕하세요')