天天看點

Qt-網易雲音樂界面實作-4 實作推薦清單和我的音樂清單,重要在QListWidget美化

Qt-網易雲音樂界面實作-4 實作推薦清單和我的音樂清單,重要在QListWidget美化

這次我們來是試下這部分功能,來對比一下,左邊是原生,右面是我寫的,按着模仿的海可以哈,就有有的資源不是一樣了,因為我連摳圖都懶得扣了了

Qt-網易雲音樂界面實作-4 實作推薦清單和我的音樂清單,重要在QListWidget美化

好了,現在就是我的是先過程了,主要教師QListWidget的。

下面就來看看代碼

//推薦清單 清單樣式
    ui->listWidget->setStyleSheet("QListWidget{color:rgb(173,175,178); background:rgb(25,27,31);border:0px solid gray;}"
                                  "QListWidget::Item{height:30px;border:0px solid gray;padding-left:15;}"
                                  "QListWidget::Item:hover{color:rgb(255,255,255);background:transparent;border:0px solid gray;}"
                                  "QListWidget::Item:selected{border-image:url(images/listwidget_h.png); color:rgb(255,255,255);border:0px solid gray;}"
                                  "QListWidget::Item:selected:active{background:#00FFFFFF;color:#FFFFFF;border-width:0;}"
                                  );
 
    QListWidgetItem *add_item_1 = new QListWidgetItem(ui->listWidget);
    add_item_1->setIcon(QIcon("./images/music.png"));
    add_item_1->setText("發現音樂");
 
 
    QListWidgetItem *add_item_2 = new QListWidgetItem(ui->listWidget);
    add_item_2->setIcon(QIcon("./images/fm.png"));
    add_item_2->setText("私人FM");
 
    QListWidgetItem *add_item_3 = new QListWidgetItem(ui->listWidget);
    add_item_3->setIcon(QIcon("./images/video.png"));
    add_item_3->setText("MV");
 
    QListWidgetItem *add_item_4 = new QListWidgetItem(ui->listWidget);
    add_item_4->setIcon(QIcon("./images/friend.png"));
    add_item_4->setText("朋友");
    //我的音樂清單
    ui->listWidget_mymusic->setStyleSheet("QListWidget{color:rgb(173,175,178); background:rgb(25,27,31);border:0px solid gray;}"
                                          "QListWidget::Item{height:30px;border:0px solid gray;padding-left:15;}"
                                          "QListWidget::Item:hover{color:rgb(255,255,255);background:transparent;border:0px solid gray;}"
                                          "QListWidget::Item:selected{border-image:url(images/listwidget_h.png); color:rgb(255,255,255);border:0px solid gray;}"
                                          "QListWidget::Item:selected:active{background:#00FFFFFF;color:#FFFFFF;border-width:0;}");
 
    QListWidgetItem *add_item_5 = new QListWidgetItem(ui->listWidget_mymusic);
    add_item_5->setIcon(QIcon("./images/music_1.png"));
    add_item_5->setText("本地音樂");
    QListWidgetItem *add_item_6 = new QListWidgetItem(ui->listWidget_mymusic);
    add_item_6->setIcon(QIcon("./images/download.png"));
    add_item_6->setText("下載下傳管理");
 
    QListWidgetItem *add_item_7 = new QListWidgetItem(ui->listWidget_mymusic);
    add_item_7->setIcon(QIcon("./images/yun.png"));
    add_item_7->setText("我的音樂雲盤");
 
    QListWidgetItem *add_item_8 = new QListWidgetItem(ui->listWidget_mymusic);
    add_item_8->setIcon(QIcon("./images/diantai.png"));
    add_item_8->setText("我的電台");
 
    QListWidgetItem *add_item_9 = new QListWidgetItem(ui->listWidget_mymusic);
    add_item_9->setIcon(QIcon("./images/shoucang.png"));
    add_item_9->setText("我的搜藏");      

由于是兩個清單,是以,這裡得做一下關聯。

/*
 * 推薦清單
 */
void MainWindow::on_listWidget_itemClicked(QListWidgetItem *item)
{
    qDebug()<<item->text();
    ui->listWidget_mymusic->clearSelection();
}
/*
 * 我的音樂清單
 */
void MainWindow::on_listWidget_mymusic_itemClicked(QListWidgetItem *item)
{
    qDebug()<<item->text();
    ui->listWidget->clearSelection();
}      

這裡就是今天的全部内容了,看着雖然有點少,但是在QListWidget的美化上面遇到了阻礙,現在已經23.20了,該準備睡覺了。明天還得上班

繼續閱讀