概念介紹
無限加載與瀑布流的結合在Web前端開發中的效果非常新穎，對於網頁內容具備較好的表現形式。無限加載並沒有一次性將內容全部加載進來，而是通過監聽滾動條事件來刷新內容的。當用戶往下拖動滾動條或使用鼠標滾輪的時候，頁面會自動加載剩余的內容。如下：
簡約而不簡單，正是這種別出心裁，突破常規的設計才能得到用戶的青睞……
實現思路
在前端開發可以使用一些jQuery插件實現這種效果，后台只需要准備好數據就行了。在Qt中如何給列表組件（QListWidget,QTreeWidget, QTableWidget）或試圖（QListView, QTreeView, QTableView）添加這樣的效果呢？上面的無限加載的核心原理其實就是使用javascript偵聽瀏覽器的滾動條事件。那么在Qt里面這樣做就簡單了。我們知道Qt中有一個基類叫做QAbstractScrollArea，它是一個代表可滾動區域的抽象基類。因此，這個類中有許多和滾動條操作相關的方法。QAbstractScrollArea恰好又是Q*View的父類，這正好為我們提供了操作滾動條的機會。
新建一個基於窗體的Qt應用程序工程，並從QListWIdget派生出一個子類：MListWidget。為什么呢？因為我們打算對鼠標滾輪事件作出一點點不一樣的動作：當滾動條滾動的時候在主窗口的lineEdit中更新滾動條的當前位置；當滾動條滾到最底端的時候發送一個信號，以此更新ListWidget中的數據內容。
// mlistwidget.h
class MListWidget : public QListWidget
{
Q_OBJECT
public:
MListWidget(QWidget *parent);
~MListWidget();
signals:
void msliderChanged(int p);
void reachedBottom();
private slots:
void onSliderChanged(int p);
private:
QScrollBar* m_vscrollBar;
};
// mlistwidget.cpp
MListWidget::MListWidget(QWidget *parent)
: QListWidget(parent)
{
m_vscrollBar = verticalScrollBar(); // 保持垂直滾動條
connect(m_vscrollBar, SIGNAL(valueChanged(int)), this, SLOT(onSliderChanged(int)));
}
void MListWidget::onSliderChanged(int p)
{
int startRow = count();
if (p == m_vscrollBar->maximum())
{
//QMessageBox::information(this, "Warning", "You reached the bottom of the vertical scroll bar!");
emit reachedBottom(); // 1
}
emit msliderChanged(p); // 2
}
注釋1處發送了一個信號reachedBottom()，通知主窗體給ListWidget添加新的內容；注釋2處的信號通知主窗體更新滾動條的當前位置值。
接下來是主窗體的實現：
// testscrollbar.h
class TestScrollBar : public QMainWindow
{
Q_OBJECT
public:
TestScrollBar(QWidget *parent = 0);
~TestScrollBar();
private slots:
void onScrollBarMoved(int);
void onReachedBottom();
private:
Ui::TestScrollBarClass ui;
};
// testscrollbar.cpp
TestScrollBar::TestScrollBar(QWidget *parent)
: QMainWindow(parent)
{
ui.setupUi(this);
QListWidgetItem* temp;
for (int i = 0; i < 100; i++)
{
temp = new QListWidgetItem();
temp->setText("zhangzhongke_"+QString::number(i));
ui.listWidget->insertItem(i, temp);
}
connect(ui.listWidget, SIGNAL(msliderChanged(int)), this, SLOT(onScrollBarMoved(int)));
connect(ui.listWidget, SIGNAL(reachedBottom()), this, SLOT(onReachedBottom()));
}
void TestScrollBar::onScrollBarMoved(int v)
{
ui.lineEdit->setText(QString::number(v));
}
// 更新ListWidget中的內容，插入新數據到最后
void TestScrollBar::onReachedBottom()
{
QListWidgetItem* temp;
int startRow = ui.listWidget->count();
for (int i = startRow; i < startRow+5; i++)
{
temp = new QListWidgetItem();
temp->setText("hello_"+QString::number(i));
ui.listWidget->insertItem(i, temp);
}
}
這里從QListWidget中派生出了一個新的子類，記得在UI designer中對QListWidget組件進行提升(promote)。在Promote to...的時候填寫我們派生出來的子類MListWidget。
實際效果
鼠標滾動到底部的時候，每次插入5條數據。
Qt-vs-addin的小問題
使用Visual Studio進行Qt開發的時候，需要安裝一個插件。然而有時候這個插件的一些工具卻莫名其妙的失效：
其中qt5appwrapper.exe用於編輯Qt工程中的UI文件，也就是Qt Designer；qt5rceditor.exe則用於編輯Qt資源文件。此時在VS中卻無法正常打開，並報如上錯誤。具體的原因不知道是什么，修復的方法如下：
對工程中的*.ui文件或*.qrc文件右鍵，選擇“打開方式...”，彈出如下對話框，並點擊“添加...”按鈕，選擇qt-vs-addin的安裝目錄，找到上述的兩個可執行文件：
至此，添加完畢。記得將新添加的這個程序設置為默認值，也就是默認的打開工具。
參考
- 瀑布流與無限加載的結合案例：http://down.admin5.com/demo/code_pop/18/745/