QListWidget與QTableWidget的使用以及樣式設定

QListWidget和QTableWidget的使用和屬性，QTableWidget和QListWidget樣式表的設定，捲軸的樣式設定

一、QListWidget的使用

//一、QListWidgetlist_widget = new QListWidget();//list_widget->resize(200,300);list_widget->setFixedWidth(300);//設定item表徵圖大小list_widget->setIconSize(QSize(50,30));QListWidgetItem *add_item = new QListWidgetItem(list_widget);add_item->setIcon(QIcon(":/res/pix/add.png"));add_item->setText(tr("Add"));//設定item項中的文字位置//add_item->setTextAlignment(Qt::AlignHCenter);//add_item->setFlags(Qt::ItemIsSelectable | Qt::ItemIsEnabled);//設定viewModel，來確定使用不同的視圖進行顯示//使ListWidgetItem中的表徵圖在上，文字在下//list_widget->setViewMode(QListView::IconMode);//list_widget->setViewMode(QListWidget::IconMode);  //這樣的形式也可以//list_widget->setViewMode(QListView::ListMode);//改變item大小，使用QListWidgetItem::setSizeHint()//add_item->setSizeHint(QSize(60,60));//設定ListWidget可以選擇多個itemlist_widget->setSelectionMode(QAbstractItemView::ExtendedSelection);//有兩種方法在ListWidget中添加item//一種在構造item的時候，指定其父WidgetQListWidgetItem *cubby_item = new QListWidgetItem(QIcon(":/res/pix/cubby.png"),                                                  tr("Cubby"),list_widget);//第二種方法是在構造完item後，使用QListWidget::additem()來添加itemQListWidgetItem *dropbox_item = new QListWidgetItem();dropbox_item->setIcon(QIcon(":/res/pix/dropbox.png"));dropbox_item->setText(tr("Dropbox"));list_widget->addItem(dropbox_item);//向QListWidget中指定的位置插入itemm，使用QListWidget::addItem()QListWidgetItem *google_item = new QListWidgetItem(QIcon(":/res/pix/google.png"),                                                     tr("Google"));list_widget->insertItem(1,google_item);//使用QListWidget::takeItem(int index)來刪除表中的某一項//list_widget->takeItem(0);//刪除item，必須要加上delete item，否則刪不掉//list_widget->removeItemWidget(add_item);//delete add_item;//開啟和關閉item是否可以編輯,預設不可編輯//使用QListWidget::openPersistenEditor(QListWidgetItem*)和//QListWidget::closePersistentEditor(QListWidgetItem*)//list_widget->openPersistentEditor(cubby_item);//設定當前的item是第幾行//初始化ListWidget顯示時，指向哪一行list_widget->setCurrentRow(1);//設定ListWidget是否可以自動排序,預設是false//list_widget->setSortingEnabled(true);//設定QLisView大小改變時，表徵圖的調整模式，預設是固定的，可以改成自動調整//list_widget->setResizeMode(QListView::Adjust);//設定列表可以拖動，如果想固定不能拖動，使用QListView::Static//拖動item，進行複製list_widget->setMovement(QListWidget::Free);QListWidgetItem *computer_item = new QListWidgetItem();QString str(tr("Computer"));computer_item->setData(Qt::DisplayRole,str);computer_item->setIcon(QIcon(":/res/pix/computer.png"));list_widget->addItem(computer_item);QPushButton *button = new QPushButton(tr("Button"));QListWidgetItem *button_item = new QListWidgetItem();list_widget->addItem(button_item);//實現替換，自訂itemlist_widget->setItemWidget(button_item,button);//使用QListWidget::count()來統計ListWidget中總共的item數目int item_count = list_widget->count();qDebug()<<item_count;//設定樣式，直接在函數中設定list_widget->setStyleSheet("QListWidget{border:1px solid gray; color:black; }"                           "QListWidget::Item{padding-top:20px; padding-bottom:4px; }"                           "QListWidget::Item:hover{background:skyblue; }"                           "QListWidget::item:selected{background:lightgray; color:red; }"                           "QListWidget::item:selected:!active{border-width:0px; background:lightgreen; }"                           );

二、QTableWidget的使用

//二、QTableWidgettable_widget = new QTableWidget(15,5);QStringList header;header<<"Name"<<"Date"<<"Description"<<"Size"<<"Other";QStringList vertical_header;vertical_header<<"One"<<"Two"<<"Three"<<"Four"<<"Five"<<"Six";//設定表頭標籤table_widget->setHorizontalHeaderLabels(header);table_widget->setVerticalHeaderLabels(vertical_header);table_widget->setItem(0,0,new QTableWidgetItem("Jan"));table_widget->setItem(1,0,new QTableWidgetItem("Feb"));table_widget->setItem(2,0,new QTableWidgetItem("Mar"));table_widget->setItem(0,1,new QTableWidgetItem(QIcon(":/res/pix/refresh.png"),"Refresh"));//一、對QtableWidget本身的效果實現//1、將表格設定為禁止編輯table_widget->setEditTriggers(QAbstractItemView::NoEditTriggers);//2、將表格設定為整行選擇table_widget->setSelectionBehavior(QAbstractItemView::SelectRows);//3、單個選中和多個選中設定//設定為可以選中多個目標//主要功能是：在正常情況下是單選，但按下Ctrl或Shift鍵後，可以多選table_widget->setSelectionMode(QAbstractItemView::ExtendedSelection);//4、表頭的顯示與隱藏table_widget->verticalHeader()->setVisible(false);  //隱藏列表頭//table_widget->horizontalHeader()->setVisible(false);    //隱藏行表頭//5、對錶頭文字的字型、顏色進行設定//獲得水平方向表頭的item對象QTableWidgetItem *columnHeaderItem = table_widget->horizontalHeaderItem(1);columnHeaderItem->setFont(QFont("Helvetica"));  //設定字型columnHeaderItem->setBackgroundColor(QColor(0,60,10));  //設定儲存格背景顏色columnHeaderItem->setTextColor(QColor(200,111,30));     //設定文字顏色//6、在儲存格裡加入控制項//把一個下拉框加入儲存格QComboBox *comBo = new QComboBox();comBo->addItem("Y");comBo->addItem("N");table_widget->setCellWidget(0,2,comBo);//二、對儲存格進行設定//1、儲存格設定字型顏色、背景顏色、字型字元QTableWidgetItem *item = new QTableWidgetItem("Apple");item->setBackgroundColor(QColor(0,60,10));item->setTextColor(QColor(200,111,100));item->setFont(QFont("Helvetica"));table_widget->setItem(0,3,item);//對所有儲存格設定字型//table_widget->setFont(QFont("Courier"));//2、設定儲存格內文字對齊item->setTextAlignment(Qt::AlignHCenter | Qt::AlignVCenter);//3、合併儲存格//參數為：合并的起始行列數(0,0),合并的行數(3行),合并的列數(1列)table_widget->setSpan(0,0,3,1);//4、設定儲存格大小//可以指定單個行或者列的大小table_widget->setColumnWidth(3,200);table_widget->setRowHeight(3,60);//將行和列的大小設為與內容相匹配//table_widget->resizeColumnsToContents();//table_widget->resizeRowsToContents();//設定交替行顏色選項(預設是false)//對應於alternate-background-color:blue;   /*藍色*///否則無法交替顯示顏色//table_widget->setAlternatingRowColors(true);//將header最後的空間補全，僅僅是通過延伸最後一個儲存格實現的，而沒有儲存格平分table_widget->horizontalHeader()->setStretchLastSection(true);//儲存格延伸後，實現儲存格平分table_widget->horizontalHeader()->setResizeMode(QHeaderView::Stretch);//三、表頭設定//1、設定表頭不可點擊(預設點擊後進行排序)table_widget->horizontalHeader()->setClickable(false);table_widget->verticalHeader()->setClickable(false);//2、設定表頭字型加粗QFont font;font.setBold(true);table_widget->horizontalHeader()->setFont(font);table_widget->verticalHeader()->setFont(font);//設定行高，與表頭高度無關//table_widget->verticalHeader()->setDefaultSectionSize(50);//設定寬度//table_widget->horizontalHeader()->setDefaultSectionSize(30);//設定表頭文字顯示格式table_widget->horizontalHeader()->setDefaultAlignment(Qt::AlignHCenter | Qt::AlignVCenter);//設定無邊框//table_widget->setFrameShape(QFrame::NoFrame);//設定不顯示格子線//table_widget->setShowGrid(false);//設定表頭第一列的寬度為150//table_widget->horizontalHeader()->resizeSection(0,150);//設定表頭高度//table_widget->horizontalHeader()->setFixedHeight(150);//設定表格樣式table_widget->setStyleSheet(            "color:green;"            /*"gridline-color:red;"*/   /*表格中的網格線條顏色*/            "background:white;"            /*"alternate-background-color:red;"*/  /*設定交替顏色*/            "selection-color:red;"            "selection-background-color:lightgray;"            "border:1px solid gray;"            );//設定表頭樣式table_widget->horizontalHeader()->setStyleSheet("background-color:#F0F0F0;");#if 0//樣式二table_widget->horizontalHeader()->setStyleSheet(            "QHeaderView::section{background:skyblue; padding-left:4px; border:3px solid red; }"            "QHeaderView::section:checked{background-color:green; }"            );#endif#if 1//設定垂直捲軸樣式table_widget->verticalHeader()->setStyleSheet(            "QScrollBar{background:transparent; height:10px; }"            "QScrollBar::handle{background:lightgray; border:2px solid transparent; border-radius:5px; }"            "QScrollBar::handle:hover{background:gray; }"            "QScrollBar::handle:pressed{background:black;}"            "QScrollBar::sub-line{background:transparent;}"            "QScrollBar::add-line{background:transparent;}"            );#endif//清除所有可見資料(包括表頭)，行還在//tableWidget->clear();//只清除表中資料，不清除表頭內容//tableWidget->clearContents();//連行也清除//tableWidget->setRowCount(0);//tableWidget->setColumnCount(0);//擷取表格中當前總行數int row = table_widget->rowCount();qDebug()<<row;//添加一行//tableWidget->setRowCount(row+1);//清除已有的行列//tableWidget->removeRow(row);//去掉水平捲軸//tableWidget->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff);//垂直捲軸按項移動//tableWidget->setVerticalScrollMode(QAbstractItemView::ScrollPerItem);//去掉自動捲軸//tableWidget->setAutoScroll(false);

三、可以使用.qss設定樣式表

//設定樣式，最佳化介面QFile file(":/my.qss");  file.open(QFile::ReadOnly);QString style = tr(file.readAll());this->setStyleSheet(style);//設定ListWidget捲軸樣式list_widget->verticalScrollBar()->setCursor(Qt::PointingHandCursor);QFile scroll_file(":/scroll.qss");    scroll_file.open(QFile::ReadOnly);QString scroll_style = tr(scroll_file.readAll());list_widget->verticalScrollBar()->setStyleSheet(scroll_file.readAll());//list_widget->verticalScrollBar()->setStyleSheet(scroll_style);//設定TableWidget捲軸樣式table_widget->verticalScrollBar()->setCursor(Qt::PointingHandCursor);//table_widget->verticalScrollBar()->setStyleSheet(scroll_file.readAll());table_widget->verticalScrollBar()->setStyleSheet(scroll_style);

qss檔案格式設定樣式表
1、QListWidget和QTableWidget樣式設定my.qss

//my.qssQListWidget{    border:1px solid gray;   /*邊界線:寬度、顏色*/    /*background:gray;*/    /*表格背景色*/    color:black;        /*前景色彩：文字顏色*/    /*margin:5px,5px,0px,50px;*/   /*上、下、左、右，間距*/}/*QListWidget::item{    padding-top:24px;    padding-bottom:4px;}*/QListWidget::item:hover{    show-decoration-selected:5;    background:skyblue;}QListWidget::item:selected{    /*border:0px;*/    background:lightgray;    padding:0px;    margin:0px;    color:red;}/*上次選擇後保留的狀態，滑鼠離開後顯示*/QListWidget::item:selected:!active{    border-width:0px;    background:lightgreen;}/*QTableWidget*/QTableWidget{    color:green;    /*前景色彩：文字顏色*/    /*gridline-color:red;   */     /*表格中的網格線條顏色*/    background:white;    /*設定交替顏色，需要在函數屬性中設定:tableWidget->setAlternatingRowColors(true)*/    /*alternate-background-color:red;   */    selection-color:red;    /*滑鼠選中時前景色彩：文字顏色*/    selection-background-color:lightgray;   /*滑鼠選中時背景色*/    border:1px solid gray;  /*邊框線的寬度、顏色*/    /*border:none;*/    /*去除邊界線*/    /*border-radius:5px;*/    /*padding:10px 10px;*/  /*表格與邊框的間距*/}/*設定表頭屬性*/QTableWidget QHeaderView::section{    background-color:#F0F0F0;  /*lightgray*/    /*color:black;*/    /*padding-left:4px;*/    /*border:3px solid red;*/   /*表頭邊框線的寬度、顏色*/    /*border:1px solid gray;*/}

2、捲軸樣式設定scroll.qss

//scroll.qss/*垂直捲軸整體*/QScrollBar:vertical{    width:8px;    background:rgb(0,0,0,0%);    margin:0px,0px,0px,0px;    padding-top:12px;   /*上預留位置*/    padding-bottom:12px;    /*下預留位置*/}/*捲軸中滑塊的樣式*/QScrollBar::handle:vertical{    width:8px;    background:rgb(0,0,0,25%);    border-radius:4px;    min-height:20px;}/*滑鼠觸及滑塊樣式*/QScrollBar::handle:vertical:hover{    width:9px;    background:rgb(0,0,0,50%);    border-radius:4px;    min-height:20;}/*設定下箭頭*/QScrollBar::add-line:vertical{    height:12px;    width:10px;    border-image:url(:/selectfile/scroll/3.png);    subcontrol-position:bottom;}/*設定上箭頭*/QScrollBar::sub-line:vertical{    height:12px;    width:10px;    border-image:url(:/selectfile/scroll/1.png);    subcontrol-position:top;}/*設定下箭頭:懸浮狀態*/QScrollBar::add-line:vertical:hover{    height:12px;    width:10px;    border-image:url(:/selectfile/scroll/4.png);    subcontrol-position:bottom;}/*設定上箭頭：懸浮狀態*/QScrollBar::sub-line:vertical:hover{    height:12px;    width:10px;    border-image:url(:/selectfile/scroll/2.png);    subcontrol-position:top;}/*當捲軸滾動的時候，上面的部分和下面的部分*/QScrollBar::add-page:vertical,QScrollBar::sub-page:vertical{    background:rgb(0,0,0,10%);    border-radius:4px;}