快捷導(dǎo)航

Qt學(xué)習(xí)之QListWidget控件的使用教程詳解

更新時(shí)間：2022年12月02日 09:58:04 作者：音視頻開發(fā)老舅

這篇文章主要為大家詳細(xì)介紹了Qt中QListWidget控件的使用教程，文中的示例代碼講解詳細(xì)，對(duì)我們學(xué)習(xí)Qt有一定的幫助，需要的可以參考一下

QListWidget去掉選中虛線框

虛線框如下所示，選中某項(xiàng)之后，文字包圍一個(gè)虛線框，

修改QSS，添加outline約束即可，

QListView { 
   
        /*border: 1px solid #636363;*/
        border: 0px;
        selection-background-color: #4D4D4D;
        selection-color: #F0F0F0;
        background: qlineargradient(spread:pad, x1:0, y1:0, x2:0, y2:1, stop:0 #4D4D4D, stop:1 #292929);
        outline:0px;
}

QListWidget添加自定義窗體

原文是這樣設(shè)計(jì)的：上面的導(dǎo)航切換選項(xiàng)卡使用QTabWidget，左側(cè)導(dǎo)航使用QListWidget，右側(cè)的顯示區(qū)域使用QScrollArea控件；主要使用垂直滾動(dòng)條的valueChanged事件和QListWidget的itemClicked事件；通過調(diào)用QWidget的visibleRegion().isEmpty() 判斷QScrollArea中滑動(dòng)過的區(qū)域，通過垂直滾動(dòng)條的setSliderPosition方法設(shè)置QScrollArea的新的區(qū)域。在功能區(qū)，我這里稱之為面板容器，原文博主選擇用QScrollArea作為容器，我這里打算采用QListWidget來實(shí)現(xiàn)這個(gè)容器，

修改QSS，添加outline約束即可，

QListView { 
   
        /*border: 1px solid #636363;*/
        border: 0px;
        selection-background-color: #4D4D4D;
        selection-color: #F0F0F0;
        background: qlineargradient(spread:pad, x1:0, y1:0, x2:0, y2:1, stop:0 #4D4D4D, stop:1 #292929);
        outline:0px;
}

QListWidget添加自定義窗體

繼續(xù)學(xué)習(xí)博客Qt淺談之三十五仿QQ設(shè)置面板功能，博主的界面長這樣，

原文是這樣設(shè)計(jì)的：上面的導(dǎo)航切換選項(xiàng)卡使用QTabWidget，左側(cè)導(dǎo)航使用QListWidget，右側(cè)的顯示區(qū)域使用QScrollArea控件；主要使用垂直滾動(dòng)條的valueChanged事件和QListWidget的itemClicked事件；通過調(diào)用QWidget的visibleRegion().isEmpty() 判斷QScrollArea中滑動(dòng)過的區(qū)域，通過垂直滾動(dòng)條的setSliderPosition方法設(shè)置QScrollArea的新的區(qū)域。在功能區(qū)，我這里稱之為面板容器，原文博主選擇用QScrollArea作為容器，我這里打算采用QListWidget來實(shí)現(xiàn)這個(gè)容器，

（錄屏軟件超級(jí)錄屏，然后用迅雷看看轉(zhuǎn)換成gif格式）先看一下自定義窗口設(shè)置，主要使用setItemWidget函數(shù)，QSS里把邊框設(shè)成0px，另外hover和selected的狀態(tài)需要保持一致，否則鼠標(biāo)滑過的狀態(tài)不一樣。

    /*QListWidgetItem**/ pLwiTcpClientContainer = new QListWidgetItem();
    //pLwiTcpClientContainer->setSizeHint(QSize(400, 400));
    pLwContainer->addItem(pLwiTcpClientContainer);
    pLwContainer->setItemWidget(pLwiTcpClientContainer, pWgtTcpClientPannel);
    /*QListWidgetItem**/ pLwiTcpServerContainer = new QListWidgetItem();
    //pLwiTcpServerContainer->setSizeHint(QSize(400, 400));
    pLwContainer->addItem(pLwiTcpServerContainer);
    pLwContainer->setItemWidget(pLwiTcpServerContainer, pWgtTcpServerPannel);
    /*QListWidgetItem**/ pLwiUdpClientContainer = new QListWidgetItem();
    //pLwiUdpClientContainer->setSizeHint(QSize(400, 400));
    pLwContainer->addItem(pLwiUdpClientContainer);
    pLwContainer->setItemWidget(pLwiUdpClientContainer, pWgtUdpClientPannel);
    if (index < pLwContainer->count())
    { 
   
        pLwContainer->setCurrentRow(index);
    }
    connect(pLwContainer, SIGNAL(itemClicked(QListWidgetItem*)), this, SLOT(OnLwContainerItemClicked(QListWidgetItem*)));
    connect(pLwContainer->verticalScrollBar(), SIGNAL(valueChanged(int)), this, SLOT(OnLwContainerVsbValueChanged(int)));

讓一個(gè)item獨(dú)占窗口，通過mainwindows的resizeEvent實(shí)現(xiàn)，

void MainWindow::resizeEvent(QResizeEvent *event)
{ 
   
    int x, y;
    x = this->width() - pLwLeftPannel->width() - 10;
    y = this->height() - pWgtTitle->height();
    pLwiTcpClientContainer->setSizeHint(QSize(x, y));
    pLwiTcpServerContainer->setSizeHint(QSize(x, y));
    pLwiUdpClientContainer->setSizeHint(QSize(x, y));
    QMainWindow::resizeEvent(event);
}

左側(cè)列表和容器聯(lián)動(dòng)，通過valueChanged信號(hào)實(shí)現(xiàn)，這里value取值是離散的，打印了才知道，所以這里的進(jìn)度條拖動(dòng)的效果是卡頓的，不像原文博主那樣流暢。

void MainWindow::OnLwContainerVsbValueChanged(int value)
{ 
   
    Q_UNUSED(value);
    if (value < pLwLeftPannel->count())
    { 
   
        pLwLeftPannel->setCurrentRow(value);
    }
    else
    { 
   
        qDebug() << "OnLwContainerVsbValueChanged value overflow" << value;
    }
}

自定義窗體無需設(shè)置大小，通過在外部是同item的setSizeHint來實(shí)現(xiàn)，

QePartitionItem::QePartitionItem(QWidget *parent) : QWidget(parent)
{ 
   
    QGridLayout* pGLyt = new QGridLayout();
    QLabel* pLabName = new QLabel(tr("Name: "));
    pLabNameVal = new QLabel("waiting...");
    QLabel* pLabFs = new QLabel(tr("Filesystem: "));
    pLabFsVal = new QLabel("waiting...");
    QLabel* pLabCap = new QLabel(tr("Capacity: "));
    pLabCapVal = new QLabel("waiting...");
    QLabel* pLabResCap = new QLabel(tr("Resdual Capacity: "));
    pLabResCapVal = new QLabel("waiting...");
    pGLyt->addWidget(pLabName, 0, 0);
    pGLyt->addWidget(pLabNameVal, 0, 1, 1, 1, Qt::AlignCenter);
    pGLyt->addWidget(pLabFs, 1, 0);
    pGLyt->addWidget(pLabFsVal, 1, 1, 1, 1, Qt::AlignCenter);
    pGLyt->addWidget(pLabCap, 2, 0);
    pGLyt->addWidget(pLabCapVal, 2, 1, 1, 1, Qt::AlignCenter);
    pGLyt->addWidget(pLabResCap, 3, 0);
    pGLyt->addWidget(pLabResCapVal, 3, 1, 1, 1, Qt::AlignCenter);
    this->setLayout(pGLyt);
    //this->setFixedHeight(160);
}
 
QePartitionItem* pi = new QePartitionItem();
QListWidgetItem* item = new QListWidgetItem();
item->setSizeHint(QSize(240, 160));
pLwPartition->addItem(item);
pLwPartition->setItemWidget(item, pi);

這樣qss才可以正常渲染item，如下所示，不設(shè)置sizehint，當(dāng)窗口大小超過item默認(rèn)大小（30pix左右），qss僅渲染默認(rèn)部分。