Qt+FFmpeg开发视频播放器笔记(二)：界面UI搭建

效果图

主要使用无边框窗体搭建,实现窗体的拖动和缩放，播放列表、文件打开等。

主要代码

manwindow设计类

#ifndef MAINWINDOW_H
#define MAINWINDOW_H#include <QMainWindow>
#include <QMutex>
#include "framelesshelper.h"QT_BEGIN_NAMESPACE
namespace Ui {
class MainWindow;
}
QT_END_NAMESPACEclass MainWindow : public QMainWindow
{Q_OBJECTpublic:MainWindow(QWidget *parent = nullptr);~MainWindow();private slots:void on_m_closeBtn_clicked();void on_m_maxBtn_clicked();void on_m_minBtn_clicked();void on_m_listBtn_clicked();void on_m_openBtn_clicked();private:void InitUI();void InitSlots();void framelesshelperInit();private:Ui::MainWindow *ui;bool isListHid  = true;QMap<QString,QString> m_playMap ;QMutex m_mapMutex;
};
#endif // MAINWINDOW_H

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QFileDialog>MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), ui(new Ui::MainWindow)
{ui->setupUi(this);this->setWindowFlags(Qt::FramelessWindowHint);// 适用调色板设置背景色QPalette palette(this->palette());palette.setColor(QPalette::Window, Qt::gray);   //设置背景黑色this->setPalette(palette);this->setMouseTracking(true);// 设置鼠标跟踪，不然只会在鼠标按下时才会触发鼠标移动事件InitUI();framelesshelperInit();
}MainWindow::~MainWindow()
{delete ui;
}void MainWindow::InitUI()
{ui->m_menuBtn->setToolTip("logo");ui->m_menuBtn->setAutoRaise(true);ui->m_menuBtn->setIcon(QPixmap(":/images/btn_logo.png"));ui->m_closeBtn->setToolTip("关闭");ui->m_closeBtn->setAutoRaise(true);ui->m_closeBtn->setIcon(QPixmap(":/images/btn_close.png"));ui->m_minBtn->setToolTip("最小化");ui->m_minBtn->setAutoRaise(true);ui->m_minBtn->setIcon(QPixmap(":/images/btn_minus.png"));ui->m_maxBtn->setToolTip("最大化");ui->m_maxBtn->setAutoRaise(true);ui->m_maxBtn->setIcon(QPixmap(":/images/btn_normal.png"));ui->m_openBtn->setToolTip("打开");ui->m_openBtn->setAutoRaise(true);ui->m_openBtn->setIcon(QPixmap(":/images/btn_open.png"));ui->m_preBtn->setToolTip("上一个");ui->m_preBtn->setAutoRaise(true);ui->m_preBtn->setIcon(QPixmap(":/images/btn_back.png"));ui->m_playBtn->setToolTip("播放");ui->m_playBtn->setAutoRaise(true);ui->m_playBtn->setIcon(QPixmap(":/images/btn_play.png"));ui->m_nextBtn->setToolTip("下一个");ui->m_nextBtn->setAutoRaise(true);ui->m_nextBtn->setIcon(QPixmap(":/images/btn_next.png"));ui->m_setBtn->setToolTip("设置");ui->m_setBtn->setAutoRaise(true);ui->m_setBtn->setIcon(QPixmap(":/images/btn_set.png"));ui->m_listBtn->setToolTip("列表");ui->m_listBtn->setAutoRaise(true);ui->m_listBtn->setIcon(QPixmap(":/images/btn_list.png"));ui->m_volumeBtn->setToolTip("声音");ui->m_volumeBtn->setAutoRaise(true);ui->m_volumeBtn->setIcon(QPixmap(":/images/btn_voice.png"));ui->tableWidget->setStyleSheet("QTableWidget { background-color: gray; } QTableWidget::item:selected {background-color:  gray;}\QTableWidget::item:selected:active {background-color: gray;}");//ui->tableWidget->horizontalHeader()->hide();ui->tableWidget->setShowGrid(false);ui->tableWidget->setSelectionMode(QAbstractItemView::NoSelection); //被选中后不高亮//ui->tableWidget->horizontalHeader()->setDefaultAlignment(Qt::AlignLeft);ui->tableWidget->horizontalHeader()->setFont(QFont("Arial", 13));// 设置表头不显示网格ui->tableWidget->horizontalHeader()->setSectionHidden(0,true);ui->tableWidget->verticalHeader()->setSectionHidden(0,true);ui->tableWidget->horizontalHeader()->setSectionsClickable(false);//水平表头不可点击ui->tableWidget->horizontalHeader()->setStyleSheet("QHeaderView::section {background-color:gray;border: none;} QHeaderView::section { color: blue; }");ui->tableWidget->verticalHeader()->hide();ui->tableWidget->setSelectionBehavior(QAbstractItemView::SelectRows); //选中整行.ui->tableWidget->setSelectionMode(QAbstractItemView::SingleSelection); //单行模式.ui->tableWidget->setEditTriggers(QAbstractItemView::NoEditTriggers);ui->tableWidget->setFocusPolicy(Qt::NoFocus); //设置item选中后去掉虚线边框.ui->tableWidget->setAcceptDrops(true); //启用拖放事件.ui->tableWidget->setColumnCount(1);// 也可以设置表头标签，如果你不需要可以省略这一步QStringList headers;headers << "播放列表";ui->tableWidget->setHorizontalHeaderLabels(headers);ui->tableWidget->setRowCount(16); // 假设你想要5行ui->tableWidget->setColumnWidth(0,220);
}void MainWindow::InitSlots()
{}void MainWindow::on_m_closeBtn_clicked()
{close();
}void MainWindow::on_m_maxBtn_clicked()
{showMaximized();
}void MainWindow::on_m_minBtn_clicked()
{showMinimized();
}void MainWindow::framelesshelperInit()
{//this指的是要处理的窗体FramelessHelper *pHelper = new FramelessHelper(this);pHelper->activateOn(this);  //激活当前窗体pHelper->setWidgetMovable(true);  //设置窗体可移动pHelper->setWidgetResizable(true);  //设置窗体可缩放pHelper->setRubberBandOnMove(false);  //设置橡皮筋效果-可移动pHelper->setRubberBandOnResize(true);  //设置橡皮筋效果-可缩放
}void MainWindow::on_m_listBtn_clicked()
{if(isListHid){ui->tableWidget->hide();isListHid = false;}else{ui->tableWidget->show();isListHid = true;}
}void MainWindow::on_m_openBtn_clicked()
{QString strName = QFileDialog::getOpenFileName(this, "选择播放视频~！", "/", "视频 (*.mp4 *.m4v *.mov *.avi *.flv);; 其它(*)");if (strName.isEmpty()){return;}QString Name=strName.split("/").last();m_mapMutex.lock();m_playMap[Name]=strName;m_mapMutex.unlock();QTableWidgetItem *newItem = new QTableWidgetItem(Name);if(m_playMap.count() == 1 ){ui->tableWidget->setItem(0,0,newItem);}else{ui->tableWidget->setItem(m_playMap.count()-1,0,newItem);}//ui->listWidget->addItem(Name);
}

midslider类 

#ifndef MIDSLIDER_H
#define MIDSLIDER_H#include <QObject>
#include <QSlider>
#include <QWidget>
#include <QMouseEvent>class MidSlider : public QSlider
{Q_OBJECT
public:MidSlider(QWidget *parent = 0);~MidSlider();protected:void mousePressEvent(QMouseEvent *ev);//鼠标按下事件private:void initData();};#endif // MIDSLIDER_H

#include "midslider.h"MidSlider::MidSlider(QWidget *parent):QSlider(parent) {initData();
}MidSlider::~MidSlider()
{}//鼠标按下事件
void MidSlider::mousePressEvent(QMouseEvent *ev)
{double pos = (double)ev->pos().x() / (double)width();//当前鼠标位置比率setValue(pos*this->maximum());//设置位置QSlider::mousePressEvent(ev);
}void MidSlider::initData()
{setOrientation(Qt::Horizontal);//setFixedHeight(15);this->setStyleSheet("QSlider{background-color: transparent;}""QSlider::groove:horizontal {border: 0px solid #09A1FF;\background: #09A1FF;\height: 3px;\border-radius: 6px;\padding-left:0px;\padding-right:0px;\left:1px;right:0px;\}""QSlider::sub-page:horizontal {\background: #09A1FF;\border: 1px solid #09A1FF;\height: 3px;\border-radius: 3px;\}""QSlider::add-page:horizontal {\background: #696969;\border: 0px solid #696969;\height: 3px;\border-radius: 3px;\}""QSlider::handle:horizontal {\background:#FFFFFF;\width: 12px;height 12px;\margin-top: -5px;\margin-bottom: -5px;\border-radius: 6px;\}");}