微信小程序camera攝像頭組件使用詳解
本篇經(jīng)驗(yàn)將繼續(xù)分享媒體類組件中camera攝像頭組件的使用詳解。注意,這篇經(jīng)驗(yàn)將基于第一個(gè)手工構(gòu)建的微信小程序演示,具體構(gòu)建步驟,可參考如下經(jīng)驗(yàn)引用。 百度搜索官方文檔 在百度搜索中查找camer
本篇經(jīng)驗(yàn)將繼續(xù)分享媒體類組件中camera攝像頭組件的使用詳解。注意,這篇經(jīng)驗(yàn)將基于第一個(gè)手工構(gòu)建的微信小程序演示,具體構(gòu)建步驟,可參考如下經(jīng)驗(yàn)引用。
百度搜索官方文檔
在百度搜索中查找camera攝像頭組件的官方文檔,常用屬性有device-position:哪個(gè)攝像頭,可選值有front和back,默認(rèn)為back;flash:閃光燈打開關(guān)閉的設(shè)置,mode:模式,包括相機(jī)模式和掃碼模式等。
wxml文件中添加camera組件
在wxml文件中通過
js中定義事件函數(shù)和變量
在js中定義wxml中按鈕綁定的單擊事件函數(shù),以及
保存編譯并測試效果
保存編譯后,在模擬器中可以查看效果,camera組件會調(diào)用筆記本電腦上的唯一攝像頭,通過按鈕可拍攝照片并顯示在下方的圖片區(qū)域中,符合預(yù)期。
真機(jī)調(diào)試效果
通過真機(jī)調(diào)試,在真實(shí)手機(jī)上測試,效果如下圖:
圖1:會彈出授權(quán)窗口,需要用戶授權(quán)訪問攝像頭硬件;
圖2:默認(rèn)會使用后置攝像頭,點(diǎn)擊按鈕拍攝后顯示在下方的圖片區(qū)域。