一、前言
最初視頻監(jiān)控系統(tǒng)按照二級菜單的設(shè)計思路，頂部標(biāo)題欄一級菜單，左側(cè)對應(yīng)二級菜單，最初采用圖片在上面，文字在下面的按鈕方式展示，隨著功能的增加，二級菜單越來越多，如果都是這個圖文上下排列的按鈕，那左側(cè)高度空間不夠，比如在筆記本1366x768的分辨率上，左側(cè)如果有七八個菜單按鈕，那就擺不下了，會把界面撐大導(dǎo)致有些界面看不到，在一整個屏幕上看不全，所以才想著把導(dǎo)航菜單設(shè)計成了動態(tài)展示的方案，根據(jù)菜單的名字，自動生成對應(yīng)的菜單按鈕，圖片位置可選是在上面還是在左側(cè)，所以產(chǎn)生了四種菜單排列組合，上側(cè)+上側(cè)，上側(cè)+左側(cè)，左側(cè)+上側(cè)，左側(cè)+左側(cè)，可以由用戶自己在系統(tǒng)設(shè)置中切換即可。文章來源：http://www.zghlxwxcb.cn/news/detail-487191.html
二、效果圖
文章來源地址http://www.zghlxwxcb.cn/news/detail-487191.html
三、體驗地址
- 國內(nèi)站點：https://gitee.com/feiyangqingyun
- 國際站點：https://github.com/feiyangqingyun
- 個人作品：https://blog.csdn.net/feiyangqingyun/article/details/97565652
- 體驗地址：https://pan.baidu.com/s/1d7TH_GEYl5nOecuNlWJJ7g 提取碼：01jf 文件名：bin_video_system。
四、相關(guān)代碼
void frmMain::initNav()
{
QList<QString> names, texts;
names << "btnView" << "btnVideo" << "btnMap" << "btnMain1" << "btnData" << "btnConfig";
texts << "視頻監(jiān)控" << "視頻回放" << "電子地圖" << AppData::TitleMain1 << "日志查詢" << "系統(tǒng)設(shè)置";
icons << 0xe68c << 0xe68d << 0xe695 << AppData::IconMain1 << 0xe699 << 0xe706;
//根據(jù)設(shè)定實例化導(dǎo)航按鈕對象
for (int i = 0; i < texts.count(); ++i) {
QToolButton *btn = new QToolButton;
CommonNav::initNavBtn(btn, names.at(i), texts.at(i), false);
connect(btn, SIGNAL(clicked(bool)), this, SLOT(buttonClicked()));
ui->layoutNav->addWidget(btn);
btns << btn;
}
}
void CommonNav::initNavLayout(QWidget *widget, QLayout *layout, bool left)
{
//不同的樣式邊距和圖標(biāo)大小不一樣,可以自行調(diào)整對應(yīng)值看效果
int topMargin, otherMargin;
if (left) {
} else {
if (CommonNav::NavMainLeft) {
topMargin = widget->height() + 6;
otherMargin = 9;
} else {
topMargin = 3;
otherMargin = 3;
}
}
layout->setContentsMargins(otherMargin, topMargin, otherMargin, otherMargin);
}
void CommonNav::initNavBtn(QToolButton *btn, const QString &name, const QString &text, bool left)
{
btn->setObjectName(name);
btn->setText(text);
btn->setCheckable(true);
//頂部導(dǎo)航和左側(cè)導(dǎo)航拉伸策略不一樣
if (left) {
btn->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Preferred);
if (CommonNav::NavSubLeft) {
btn->setToolButtonStyle(Qt::ToolButtonTextBesideIcon);
btn->setMinimumHeight(30);
} else {
btn->setToolButtonStyle(Qt::ToolButtonTextUnderIcon);
btn->setMinimumHeight(80);
}
} else {
btn->setSizePolicy(QSizePolicy::Preferred, QSizePolicy::Expanding);
if (CommonNav::NavMainLeft) {
btn->setToolButtonStyle(Qt::ToolButtonTextBesideIcon);
btn->setMinimumWidth(115);
} else {
btn->setToolButtonStyle(Qt::ToolButtonTextUnderIcon);
btn->setMinimumWidth(80);
}
}
}
void CommonNav::initNavBtnIcon(QAbstractButton *btn, int icon, bool left, int offset)
{
//可以自行調(diào)整尺寸
int size = 20;
int width = 25;
int height = 20;
//根據(jù)不同的圖標(biāo)位置設(shè)置不同的圖標(biāo)尺寸
if (left) {
if (!CommonNav::NavSubLeft) {
size = 35;
width = 40;
height = 35;
}
} else {
if (!CommonNav::NavMainLeft) {
size = 35;
width = 40;
height = 35;
}
}
//偏移值 可能部分圖標(biāo)要調(diào)整大小
size += offset;
setIconBtn(btn, icon, size, width, height);
}
void CommonNav::setIconBtn(QAbstractButton *btn, int icon)
{
//可以自行調(diào)整尺寸
int size = 16;
int width = 18;
int height = 18;
setIconBtn(btn, icon, size, width, height);
}
void CommonNav::setIconBtn(QAbstractButton *btn, int icon, int size, int width, int height, int fontSize)
{
//取出正常狀態(tài)和禁用狀態(tài)圖片
QPixmap pixNormal = IconHelper::getPixmap(QUIConfig::TextColor, icon, size, width, height);
QPixmap pixDisabled = IconHelper::getPixmap(QUIConfig::BorderColor, icon, size, width, height);
QIcon ico(pixNormal);
ico.addPixmap(pixDisabled, QIcon::Disabled, QIcon::On);
ico.addPixmap(pixDisabled, QIcon::Disabled, QIcon::Off);
btn->setIconSize(QSize(width, height));
btn->setIcon(ico);
if (fontSize > 0) {
QFont font;
font.setPixelSize(fontSize);
btn->setFont(font);
}
}
五、功能特點
5.1 軟件模塊
- 視頻監(jiān)控模塊，各種?？啃〈绑w子模塊，包括設(shè)備列表、圖文警情、窗口信息、云臺控制、預(yù)置位、巡航設(shè)置、設(shè)備控制、懸浮地圖、網(wǎng)頁瀏覽等。
- 視頻回放模塊，包括本地回放、遠(yuǎn)程回放、設(shè)備播放、圖片回放、視頻上傳等。
- 電子地圖模塊，包括圖片地圖、在線地圖、離線地圖、路徑規(guī)劃等。
- 日志查詢模塊，包括本地日志、設(shè)備日志等。
- 系統(tǒng)設(shè)置模塊，包括系統(tǒng)設(shè)置（基本設(shè)置、視頻參數(shù)、數(shù)據(jù)庫設(shè)置、地圖配置、串口配置等）、錄像機(jī)管理、攝像機(jī)管理、輪詢配置、錄像計劃、用戶管理等。
5.2 基礎(chǔ)功能
- 支持各種視頻流（rtsp、rtmp、http等）、視頻文件（mp4、rmvb、avi等）、本地USB攝像機(jī)播放。
- 支持多畫面切換，包括1、4、6、8、9、13、16、25、36、64畫面切換。
- 支持全屏切換，多種切換方式包括鼠標(biāo)右鍵菜單、工具欄按鈕、快捷鍵（alt+enter全屏，esc退出全屏）。
- 支持視頻輪詢，包括1、4、9、16畫面輪詢，可設(shè)置輪詢分組（輪詢預(yù)案）、輪詢間隔、碼流類型等。
- 支持onvif協(xié)議，包括設(shè)備搜索、云臺控制、預(yù)置位、設(shè)備控制（圖片參數(shù)、校對時間、系統(tǒng)重啟，抓拍圖片等）。
- 支持權(quán)限管理，不同的用戶可以對應(yīng)不同的模塊權(quán)限，比如刪除日志、關(guān)閉系統(tǒng)等。
- 數(shù)據(jù)庫支持多種，包括sqlite、mysql、sqlserver、postgresql、oracle、人大金倉等。
- 本地USB攝像機(jī)支持設(shè)置分辨率、幀率等參數(shù)。
- 所有?？磕K都自動生成對應(yīng)的菜單用來控制顯示和隱藏，在標(biāo)題欄右鍵可以彈出。
- 支持顯示所有模塊、隱藏所有模塊、復(fù)位普通布局、復(fù)位全屏布局。
- 雙擊設(shè)備彈出實時預(yù)覽視頻，支持圖片地圖、在線地圖、離線地圖等。
- 攝像機(jī)節(jié)點拖曳到對應(yīng)窗體播放視頻，同時支持拖曳本地文件直接播放。
- 刪除視頻支持鼠標(biāo)右鍵刪除、懸浮條關(guān)閉刪除、拖曳到視頻監(jiān)控面板外刪除等多種方式。
- 圖片地圖上設(shè)備按鈕可自由拖動，自動保存位置信息。百度地圖上可以鼠標(biāo)單擊獲取經(jīng)緯度信息，用來更新設(shè)備位置。
- 視頻監(jiān)控面板窗體中任意通道支持拖曳交換，瞬間響應(yīng)。
- 封裝了百度地圖，視圖切換，運動軌跡，設(shè)備點位，鼠標(biāo)按下獲取經(jīng)緯度等。
- 雙擊節(jié)點、拖曳節(jié)點、拖曳窗體交換位置等操作，均自動更新保存最后的播放地址，下次軟件打開自動應(yīng)用。
- 右下角音量條控件，失去焦點自動隱藏，音量條帶靜音圖標(biāo)。
- 支持視頻截圖，可指定單個或者對所有通道截圖，底部小工具欄也有截圖按鈕。
- 支持超時自動隱藏鼠標(biāo)指針、自動全屏機(jī)制。
- 支持onvif云臺控制，可上下左右移動云臺攝像機(jī)，包括復(fù)位和焦距調(diào)整等。
- 支持onvif預(yù)置位，可以添加、刪除、修改預(yù)置位，可以調(diào)用起始位。
- 支持onvif圖像參數(shù)設(shè)置，包括明亮度、對比度、飽和度、尖銳度等。
- 支持onvif其他操作，包括抓圖、網(wǎng)絡(luò)設(shè)置、校時、重啟、事件訂閱等。
- 支持任意onvif攝像機(jī)，包括但不限于?？?、大華、宇視、天地偉業(yè)、華為等。
- 可保存視頻，可選定時存儲或者單文件存儲，可選存儲間隔時間。
- 可設(shè)置視頻流通信方式tcp+udp，可設(shè)置視頻解碼是速度優(yōu)先、質(zhì)量優(yōu)先、均衡等。
- 可設(shè)置軟件中文名稱、英文名稱、LOGO圖標(biāo)等。
- 存儲的視頻文件支持導(dǎo)出到指定目錄，支持批量上傳到服務(wù)器。
- 完善的錄像計劃設(shè)置，支持每個通道7 * 24小時每半小時設(shè)置是否存儲錄像。
5.3 特色功能
- 主界面采用?？看绑w模式，各種組件以小模塊的形式加入，可自定義任意模塊加入。
- 停靠模塊可拖動任意位置嵌入和懸浮，支持最大化全屏，支持多屏幕。
- 雙重布局文件存儲機(jī)制，正常模式、全屏模式都對應(yīng)不同的布局方案，自動切換和保存，比如全屏模式可以突出幾個模塊透明顯示在指定位置，更具科幻感現(xiàn)代化。
- 原創(chuàng)onvif協(xié)議機(jī)制，采用底層協(xié)議解析（udp廣播搜索+http請求執(zhí)行命令）更輕量易懂易學(xué)習(xí)拓展，不依賴任何第三方組件比如gsoap。
- 原創(chuàng)數(shù)據(jù)導(dǎo)入、導(dǎo)出、打印機(jī)制，跨平臺不依賴任何組件，瞬間導(dǎo)出數(shù)據(jù)。
- 內(nèi)置多個原創(chuàng)組件，宇宙超值超級牛逼，包括數(shù)據(jù)導(dǎo)入導(dǎo)出組件（導(dǎo)出到xls、pdf、打?。?、數(shù)據(jù)庫組件（數(shù)據(jù)庫管理線程、自動清理數(shù)據(jù)線程、萬能分頁、數(shù)據(jù)請求等）、地圖組件、視頻監(jiān)控組件、文件多線程收發(fā)組件、onvif通信組件、通用瀏覽器內(nèi)核組件等。
- 自定義信息框+錯誤框+詢問框+右下角提示框（包含多種格式）等。
- 精美換膚，高達(dá)17套皮膚樣式隨意更換，所有樣式全部統(tǒng)一，包括菜單等。
- 視頻控件懸浮條可以自行增加多個按鈕，監(jiān)控界面底部小工具欄也可自行增加按鈕。
- 雙擊攝像機(jī)節(jié)點自動播放視頻，雙擊節(jié)點自動依次添加視頻，會自動跳到下一個，雙擊父節(jié)點自動添加該節(jié)點下的所有視頻?？蛇x主碼流、子碼流。
- 錄像機(jī)管理、攝像機(jī)管理，可添加刪除修改導(dǎo)入導(dǎo)出打印信息，立即應(yīng)用新的設(shè)備信息生成樹狀列表，不需重啟。
- 可選多種內(nèi)核自由切換，ffmpeg、vlc、mpv等，均可在pro中設(shè)置。推薦用ffmpeg，跨平臺最多，默認(rèn)提供好了linux和mac平臺上編譯好的庫。
- 支持硬解碼，可設(shè)置硬解碼類型（qsv、dxva2、d3d11va等）。
- 默認(rèn)采用opengl繪制視頻，超低的CPU資源占用，支持yuyv和nv12兩種格式繪制，性能爆表。
- 標(biāo)簽和圖形信息支持三種繪制方式，繪制到遮罩層、繪制到圖片、源頭繪制（對應(yīng)信息可以存儲到文件）。
- 高度可定制化，用戶可以很方便的在此基礎(chǔ)上衍生自己的功能，比如增加自定義模塊，增加運行模式、機(jī)器人監(jiān)控、無人機(jī)監(jiān)控、挖掘機(jī)監(jiān)控等。
- 支持xp、win7、win10、win11、linux、mac、各種國產(chǎn)系統(tǒng)（UOS、中標(biāo)麒麟、銀河麒麟等）、嵌入式linux等系統(tǒng)。
- 注釋完整，項目結(jié)構(gòu)清晰，超級詳細(xì)完整的使用開發(fā)手冊，精確到每個代碼文件的功能說明，不斷持續(xù)迭代版本。
到了這里，關(guān)于Qt編寫視頻監(jiān)控系統(tǒng)79-四種界面導(dǎo)航欄的設(shè)計的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
