1、效果展示
今天這篇文章主要講解的是自定義搜索框，不僅僅支持搜索，而且可以支持搜索預(yù)覽，具體請看效果圖1。網(wǎng)上也有一些比較簡單明了的自定義搜索框，比如Qt之自定義搜索框 ，講的也比較詳細(xì)，不過本文的側(cè)重點(diǎn)不僅僅是搜索，而且包括了檢索功能。有興趣的小伙伴可以看下步驟3的思路講解。
圖1 自定義搜索框
2、功能分析
這個自定義搜索框支持輸入一定的數(shù)據(jù)源，然后通過檢索窗口進(jìn)行搜索數(shù)據(jù)，匹配到的數(shù)據(jù)會優(yōu)先展示到預(yù)覽下拉框，預(yù)覽窗口支持hover高亮整行。仔細(xì)閱讀demo源碼的同學(xué)可能就會發(fā)現(xiàn)其實(shí)這個搜搜框的左側(cè)又一個按鈕是可以點(diǎn)擊的，但是目前還沒有添加具體的點(diǎn)擊功能。了解了這個控件的功能之后，如果覺得對你有用，那么就可以接著繼續(xù)往下看實(shí)現(xiàn)流程。
3、思路講解
問題分析：
1、數(shù)據(jù)源存儲在哪兒？怎么實(shí)現(xiàn)檢索
2、彈出式下拉框顯示和隱藏控制？位置同步？
3、鼠標(biāo)hover狀態(tài)的顏色設(shè)置？
首先在講解源碼之前，我拋出了3個問題，有精力的同學(xué)可以先思考下這幾個問題，然后在接著往下看，下邊我也會逐一說明這個些問題。
源碼講解：
1、使用到的類：
StockSortFilterProxyModel：過濾數(shù)據(jù)源，該model上的數(shù)據(jù)索引直接供視圖展示
StockTableView：自定義視圖，用于顯示預(yù)覽數(shù)據(jù)
StockListWidget：自定義搜索框
StockItemDelegate：自定義委托，提供自定義繪圖
上邊4個類是完成自定義搜索框的自定義類，當(dāng)然除了上述4個類以外，還用到了qt自帶的一些類，更好的理解這些類，那么這個自定義控件的思路也就顯得異常好理解。
2、頭文件說明
委托：負(fù)責(zé)視圖繪制
延伸閱讀
學(xué)習(xí)是年輕人改變自己的最好方式