1、使用设计师模式绘制ui界面

添加QPushButton并设置大小，ctrl+鼠标拖动复制相同的组件。

添加icon                //ps:icon下载网站

设置按钮无边框并设置鼠标悬停颜色：

修改QWidget样式表，添加：

*{
border:none;
}
QPushButton:hover
{
	background-color: rgb(125, 238, 255);
}

2、widget源码设计

widget.h

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include<QtWidgets/QtWidgets>
#include<QMediaPlayer>
#include<QAudioOutput>
QT_BEGIN_NAMESPACE
namespace Ui {
class Widget;
}
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();

private slots:
    void on_pushButton_clicked();

    void on_pushButton_4_clicked();

    void on_pushButton_3_clicked();

    void on_pushButton_5_clicked();

    void on_listWidget_currentRowChanged(int currentRow);

    void on_listWidget_doubleClicked(const QModelIndex &index);

private:
    Ui::Widget *ui;
    QList<QUrl> _playList;
    QAudioOutput *_audioOutput;
    QMediaPlayer *_mediaPlayer;
    int _curIndex=0;
};
#endif // WIDGET_H

widget.cpp

#include "widget.h"
#include "ui_widget.h"
#include<QtWidgets/QtWidgets>
#include<QMediaPlayer>
#include<QAudioOutput>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);

    _audioOutput=new QAudioOutput(this);
    _mediaPlayer=new QMediaPlayer(this);
    _mediaPlayer->setAudioOutput(_audioOutput);

    QObject::connect(_mediaPlayer,&QMediaPlayer::durationChanged,[&](qint64 duration){
        ui->totalLabel->setText(QString("%1:%2").arg(duration/1000/60,2,10,QChar('0')).arg(duration/1000%60));
        ui->playCourseSlider->setRange(0,duration);
    });

    QObject::connect(_mediaPlayer,&QMediaPlayer::positionChanged,[&](qint64 pos){
        ui->curLabel->setText(QString("%1:%2").arg(pos/1000/60,2,10,QChar('0')).arg(pos/1000%60,2,10,QChar('0')));
        ui->playCourseSlider->setValue(pos);
    });

    connect(ui->playCourseSlider,&QSlider::sliderMoved,_mediaPlayer,&QMediaPlayer::setPosition);
}

Widget::~Widget()
{
    delete ui;
}

void Widget::on_pushButton_clicked()
{
    auto path=QFileDialog::getExistingDirectory(this,"请选择音乐所在的目录","C:/Users/31468/Desktop/");
    QDir dir(path);
    auto musicList=dir.entryList(QStringList()<<"*.mp3"<<"*.wav");
    ui->listWidget->addItems(musicList);
    ui->listWidget->setCurrentRow(0);

    for(auto &elem:musicList)
    {
        _playList.push_back(QUrl::fromLocalFile(path+"/"+elem));
    }
    qDebug()<<_playList;

}


void Widget::on_pushButton_4_clicked()
{
    if(_playList.size()==0) return;

    if(_mediaPlayer->playbackState()==QMediaPlayer::PlaybackState::StoppedState)
    {
        // QPushButton *button = new QPushButton(this);
        // // 设置按钮的背景图片，使用border-image属性
        // button->setStyleSheet("QPushButton { border-image: url(:/path/to/your/image.png); }");
        //:/icon/pause (2).png ://icon/stop.png
        ui->pushButton_4->setStyleSheet("QPushButton { border-image: url(:/icon/stop.png); }");
        _curIndex=ui->listWidget->currentRow();
        _mediaPlayer->setSource(_playList[_curIndex]);
        _mediaPlayer->play();
    }
    else if(_mediaPlayer->playbackState()==QMediaPlayer::PlaybackState::PlayingState)
    {
        ui->pushButton_4->setStyleSheet("QPushButton { border-image: url(:/icon/pause (2).png); }");
        _mediaPlayer->pause();
    }
    else if(_mediaPlayer->playbackState()==QMediaPlayer::PlaybackState::PausedState)
    {
        ui->pushButton_4->setStyleSheet("QPushButton { border-image: url(:/icon/stop.png); }");
        _mediaPlayer->play();
    }
}


void Widget::on_pushButton_3_clicked()//上一曲
{
    if(_playList.size()==0) return;
    --_curIndex;
    if(_curIndex==-1)
    {
        _curIndex=_playList.size()-1;
    }
    ui->listWidget->setCurrentRow(_curIndex);
    _mediaPlayer->setSource(_playList[_curIndex]);
    _mediaPlayer->play();
}


void Widget::on_pushButton_5_clicked()//下一曲
{
    if(_playList.size()==0) return;
    ++_curIndex;
    if(_curIndex==_playList.size())
    {
        _curIndex=0;
    }
    ui->listWidget->setCurrentRow(_curIndex);
    _mediaPlayer->setSource(_playList[_curIndex]);
    _mediaPlayer->play();

}
void Widget::on_listWidget_doubleClicked(const QModelIndex &index)
{
    _curIndex=index.row();
    //ui->listWidget->setCurrentRow(_curIndex);
    _mediaPlayer->setSource(_playList[_curIndex]);
    _mediaPlayer->play();
}


void Widget::on_listWidget_currentRowChanged(int currentRow)
{

}