界面的制作一直是 Python 的痛！使用 Python 制作桌面端界面是非常痛苦的過(guò)程(又難學(xué)又難看)。不過(guò)，Python 已經(jīng)出現(xiàn)了幾個(gè)基于web前端的庫(kù)，他們的基本機(jī)制大同小異，如果對(duì)界面操作性沒(méi)有太大要求，那么這些庫(kù)就比較適合你。

這個(gè)系列基于 pywebio 的一系列實(shí)戰(zhàn)應(yīng)用，讓我們從實(shí)戰(zhàn)中學(xué)習(xí)這個(gè)庫(kù)的使用！

如果對(duì)你有幫助，記得轉(zhuǎn)發(fā)推薦給你的好友！

你的點(diǎn)贊、收藏是對(duì)我的最大鼓勵(lì)！

本文是對(duì)多種交互界面的套路，以及 pywebio 中對(duì)應(yīng)解決方式的講解。是本系列后續(xù)實(shí)戰(zhàn)案例的關(guān)鍵，如果你是能盡快上手 pywebio 或 streamlit 這些庫(kù)，那么請(qǐng)務(wù)必好好理解

上一節(jié)：

Python新晉界面庫(kù)pywebio，不會(huì)這個(gè)技巧不可能用好它

本節(jié)最終效果：

• 選擇文件加載

• 文本框輸入查詢條件，下方刷新顯示篩選結(jié)果

安裝庫(kù)：

布局

雖然需求比較簡(jiǎn)單，但我們還是希望培養(yǎng)一種好習(xí)慣。

首先利用作用域?qū)φ麄€(gè)頁(yè)面做布局：

• 行9-11：這是本系列第一節(jié)的內(nèi)容

• 行13：定義一個(gè)作用域 query_input

• 行15：使用 pin.put_input 得到一個(gè)不阻塞的輸入框

• 行16：執(zhí)行查詢按鈕，此時(shí)我們還沒(méi)有輸入第二個(gè)參數(shù)

• 行18：定義一個(gè)作用域 table ，里面就是用于顯示表格

這里定義作用域是為了方便后續(xù)對(duì)頁(yè)面的不同部分內(nèi)容做修改

關(guān)于作用域，pin 等內(nèi)容都在本系列章節(jié)有詳細(xì)講解，請(qǐng)回看

其實(shí)現(xiàn)在界面就可以正常顯示，但是當(dāng)點(diǎn)擊'查詢'按鈕時(shí)，就會(huì)報(bào)錯(cuò)：

這是因?yàn)槲覀儧](méi)有告訴按鈕，點(diǎn)擊時(shí)要執(zhí)行什么操作

查詢邏輯

現(xiàn)在可以定義按鈕點(diǎn)擊時(shí)的處理：

• 行10-13：定義函數(shù)，接受一個(gè) DataFrame 參數(shù)

• 行11：現(xiàn)在可以通過(guò) pin 獲取輸入框的內(nèi)容，注意此時(shí)的 pin_query 要與行21 的對(duì)應(yīng)

• 行12：此時(shí)體現(xiàn)作用域的作用，我們可以在代碼任何位置上更新表格

• 行27：hold 方法相當(dāng)重要，因?yàn)楫?dāng)你看到數(shù)據(jù)表出現(xiàn)時(shí)，自定義函數(shù)已經(jīng)執(zhí)行完畢，hold 方法讓 pywebio 保持自定義中定義的所有數(shù)據(jù)(包括自定義函數(shù))，否則點(diǎn)擊按鈕不會(huì)起作用(因?yàn)楹瘮?shù) whenclickquery 已經(jīng)被銷毀)

如果輸入框與按鈕在同一行，界面會(huì)比較合理：

• 行22：output.put_row([控件1,控件2,……]) 可以讓多個(gè)控件放置同一行上

現(xiàn)在界面：

有時(shí)候我們只是簡(jiǎn)單對(duì)一列作為條件篩選，每次都要輸入長(zhǎng)長(zhǎng)的查詢字符串，太麻煩了！

下一節(jié)，我們繼續(xù)增強(qiáng)功能，效果如下：

• 自動(dòng)列出數(shù)據(jù)表中的文本類型的列名，只需要選擇即可

• 選擇列后，會(huì)出現(xiàn)列中各類文本的選項(xiàng)，同樣只需要選擇即可(單選或多選)