Streamlit 學習筆記 : 使用者輸入元件 (十六) 拍照元件

本篇旨在測試 Streamlit 的拍照元件函式 st.download_button().

本系列所有測試文章參考 :

# Streamlit 學習筆記索引

呼叫 st.download_button() 函式並傳入必要參數 label 會建立一個拍照元件, 按下按鈕可從電腦的照相機鏡頭拍照, 其參數結構如下 : 

st.camera_input(label, key=None, help=None, on_change=None, args=None, kwargs=None, disabled=False, label_visibility="visible")

st.camera_input() 的傳回值為 None 或 UploadedFile 物件 (ByteIO 的子類別). 

 

參數說明如下表 :

st.camera_input() 參數	說明
label	元件的標籤文字
key	元件的唯一識別鍵，可用於 st.session_state
help	使用者滑鼠移到元件上時顯示的說明文字
on_change	當元件狀態改變時呼叫的回呼函式
args	傳給 on_change 回呼函式的額外引數 (以 tuple 傳遞)
kwargs	傳給 on_change 回呼函式的額外關鍵字引數 (以 dict 傳遞)
disabled	布林值，若為 True 則停用元件
label_visibility	設定標籤顯示方式：'visible'（預設）、'hidden' 或 'collapsed'

例如 : 

測試 1 : 下載文字檔 [看原始碼]   

# st-camera_input-test-1.py

import streamlit as st

picture=st.camera_input("請按 Take Photo 鈕拍照")

if picture:

    st.image(picture)

    st.write('已完成拍照')

此例執行時首先會彈出一個視窗詢問是否允許程式使用電腦的攝影鏡頭, 須按 "允許" 才會開啟攝像頭 : 

按下 Take Photo 鈕即拍照取得影像之 UploadedFile 物件, 然後傳給底下的 st.image() 顯示 : 

下面範例測試 on_change 與 args 參數的用法 :

測試 2 : 參數 on_change 與 args 用法 [看原始碼]   

# st-camera_input-test-2.py

import streamlit as st

def on_camera_change(name):

    picture=st.session_state['picture']

    if picture:

        st.image(picture, caption=f'**拍攝者 : {name}**')

picture=st.camera_input(

    '請按 Take Photo 鈕拍照',

    key='picture',

    on_change=on_camera_change,

    args=('Tony',)

    )

此例設定了 key 參數, 這樣 st.camera_input() 的傳回值 (UploadedFile 類別圖片) 就會以 picture 為鍵記錄在 st.session_state 字典裡, 當按下拍照件時會觸發 on_change 事件, 這時拍攝者名字會用 args 傳送給事件處理函式的 name 參數, 這時拍攝的照片會顯示在鏡頭上方 : 

但拍完照片鏡頭卻是空白 : 

這是正常現象, 原因是按下拍照鈕時會 st.camera_input() 會將拍攝的圖片存入 st.session_state[key] 內, 然後重新執行整支程式, 這時因為 st.session_state[key] 有保持圖片, 所以就不會開啟鏡頭, 必須按 Clear photo 鈕清除 st.session_state[key] 圖片後才會再次開啟鏡頭. 

上例也可以改用 kwargs 來傳引數給 on_change 事件處理函式, 例如 : 

測試 3 : 參數 on_change 與 kwargs 用法 [看原始碼]   

# st-camera_input-test-3.py

import streamlit as st

def on_camera_change(name):

    picture=st.session_state['picture']

    if picture:

        st.image(picture, caption=f'**拍攝者 : {name}**')

picture=st.camera_input(

    '請按 Take Photo 鈕拍照',

    key='picture',

    on_change=on_camera_change,

    kwargs={'name': 'Tony'}

    )

結果與上例一樣.