001黑馬c、cpp全棧培訓(xùn)第24期無密壓縮全全部課程qt案例教程v2

1、1 新建項目1.1 創(chuàng)建新項目第一步打開Qt Creator，點擊新建NewProject Application Qt Widgets Application -choose創(chuàng)建項目名稱例如： Myself，路徑自己選擇，注意不要有空格和中文選擇套件，點擊下一步選擇基類QWidget，然后點擊下一步然后點擊完成，至此項目創(chuàng)建完畢。2 創(chuàng)建列表2.1 添加新文件，列表類 DialogList右擊項目名，在彈出的快捷菜單中選擇“添加新文件.”菜單項，在彈出的擇“Qt”選項。選擇 Qt 設(shè)計師界面類，單擊“Choose.”按鈕；界面模板選擇 Widget，點擊下一步類名填寫 DialogList

2、（可以起其他名稱）點擊下一步框中選在匯總中單擊“完成”按鈕，系統(tǒng)會為源文件以及 dialoglist.ui 設(shè)計文件添加“dialoglist.h”頭文件和“dialoglist.cpp”2.2設(shè)計框列表 UI框的 UI，該窗口的大小為 250*700，其中的主要控按照下圖所示，設(shè)計件是 QToolBox，修改該控件的 currentItemText 為“群成員”，QToolBox 默認(rèn)生成的第二頁刪除掉在群成員里放入一個 Widget 做布局操作，可以先利用一些測試控件放入到其中，然后做垂直布局，然后把測試的控件刪除掉，這時該Widget 中就有了一個 layout 布局測試，main 函數(shù)

3、中修改代碼運行項目，效果如圖2.3 資源導(dǎo)入向項目中導(dǎo)入資源，對應(yīng)九個按鈕需要九張作為頭像圖標(biāo)使用，搜集九張（可用共享的資源或者自己收藏的，大小在 80*80 左右）添加新文件 Qt Qt Resource 點擊choose 名稱 res下一步，點擊完成，生成 res.qrc 文件右擊 res.qrc，點擊 openinEditor，添加前綴 /添加文件 將準(zhǔn)備好的文件選中，點擊打開，添加成功2.4 設(shè)置窗體標(biāo)題和圖標(biāo)2.4.1 設(shè)置標(biāo)題在 Drawer 構(gòu)造函數(shù)中加入如下代碼setWindowTitle(“Myself2017”);2.4.2 設(shè)置圖標(biāo)設(shè)置主窗體標(biāo)題圖標(biāo)setWindowIc

4、on(QPixmap(“:/images/.png”);2.5 設(shè)置列表中的按鈕2.5.1創(chuàng)建 9 個按鈕存放到 QVector 容器中運行效果如圖：（有點辣眼睛。）QVectorvToolBtn; /存放 QtoolButton 的容器vToolBtnfor(i = 0 ;i setText(斧頭幫幫主);/設(shè)置按鈕名稱btn-setIcon(QPixmap(:/images/ftbz.png);/設(shè)置btn-setIconSize(QPixmap(:images/ftbz.png).size(); /設(shè)置大小btn-setAutoRaise(true); /設(shè)置透明效果btn-setToo

5、lButtonStyle(Qt:ToolButtonTextBesideIcon);/設(shè)置按鈕風(fēng)格，同時顯示文字和圖標(biāo)ui-vLayout-addWidget(btn); /將按鈕添加到布局中 vToolBtn.push_back(btn); /將 9 個按鈕放入到布局中2.5.2 替換，改為不同的資源再次運行，效果如圖3 設(shè)計聊天窗口3.1 界面雙擊 widget.ui 文件進(jìn)入設(shè)計模式，界面寬度屬性分別設(shè)置為 730 和 450，向界面中拖入并且進(jìn)行設(shè)置，最終效果如圖3.2 控件類型和屬性設(shè)置3.2.1 各個控件設(shè)置如上圖中標(biāo)注的 18，下表中為上圖的屬性設(shè)置以及控件類型3.2.2 Too

6、lBtn 詳細(xì)設(shè)置其中前三個按鈕，選中checkable 屬性；其中所有的 ToolBtn粗、傾斜、下劃線、更改字體顏色、保存屬性中的toolTIp 依次更改為 加和 清空3.2.3 字體大小下拉框設(shè)置界面上，點擊5 號控件設(shè)置字體大小，設(shè)置區(qū)間為 822（與騰訊+ 號按鈕添加新項目如圖完全相同），雙擊該currentIndex 屬性設(shè)置為 4，即默認(rèn)為 12 號字3.2.4 TableWidget 設(shè)置顯示用戶列表的 TableWidget 控件，將 selectionM屬性選擇為 SingleSelection（帶有選中效果），將 selectBehavior 選擇為 SelectRows

7、（選中整行），取消選中的 showGrid（表格顯示）雙擊 TableWidget，添加“用戶名”列，如圖至此，所有彈出的聊天信息窗口全部設(shè)計完畢4 關(guān)聯(lián)按鈕與聊天窗口4.1 添加按鈕點擊事件下一步就是要關(guān)聯(lián)起聊天的列表窗口和具體的聊天信息窗口了，也就是點擊按鈕彈出窗口。4.2 修改彈出框的構(gòu)造函數(shù)！ Widget 文件中的 構(gòu)造改為 explicit Widget(QWidget *parent ,QString usrname); 參數(shù) 2用于傳入用戶名，讓具體的彈出框知道自己的用戶名是什么4.3 測試運行代碼，點擊窗口，彈出響應(yīng)的框4.6 解決一個窗口多次彈出的 bug在 dialogL

8、ist.h 中加入標(biāo)示QVectorisShow; 代表是否打開窗口的標(biāo)識，false 未打開，true 打開/添加點擊事件for(i = 0 ; i vToolBtn.size();i+)connect(vToolBtni,&QToolButton:clicked,this,=()/qDebug() text()代表告訴聊天窗口 人物的姓名Widget *chatWidget = new Widget(0,vToolBtni-text(); chatWidget-setWindowTitle(vToolBtni-text(); chatWidget-setWindowIcon(vToolBt

9、ni-icon(); chatWidget-show(););dialogList.cpp 構(gòu)造中 將 9 個標(biāo)志位都置為 false修改點擊事件，根據(jù)打開的標(biāo)志位來判斷然后在 widget 函數(shù)中關(guān)閉的信號，和重寫關(guān)閉方法然后實現(xiàn)重寫的關(guān)閉方法，發(fā)送關(guān)閉信號點擊事件中再添加一行代碼void Widget:closeEvent(QCloseEvent * e)emit this-widgetClose(); /發(fā)送關(guān)閉當(dāng)前窗口的自定義信號 QWidget:closeEvent(e);signals:void widgetClose();protected:void closeEvent(QCl

10、oseEvent *);/九個標(biāo)識位設(shè)置for(i = 0 ; i uName = usrname; /獲取用戶名 udpSocket = new QUdpSocket(this); port = 23333;udpSocket-bind(port,QUdpSocket:ShareAddress |QUdpSocket:ReuseAddressH);/采用 ShareAddress 模式(即允許其它的服務(wù)連接到相同的地址和端口，特別是用在多客戶端監(jiān)聽同一個服務(wù)器端口等時特別有效)，和 ReuseAddressH模式(重新連接服務(wù)器)信號connect(udpSocket,&QUdpSocket

11、:readyRead,this,&Widget:ReceiveMessage);sndMsg(UsrEnter);/有新用戶加入發(fā)送消息函數(shù)sndMsg接受消息 ReceiveMessagevoid Widget:ReceiveMessage()void Widget:sndMsg(MsgType type)QByteArray data;QDataStream out(&data,QIODevice:WriteOnly);out type msgTxtEdit-toPlaext() = )QMessageBox:warning(0,警告,發(fā)送內(nèi)容不能為空,QMessageBox:Ok); r

12、eturn;out writeDatagram(data,data.length(),QHostAddress:Broadcast,port);獲取用戶名獲取聊天信息/獲取用戶名QString Widget:getUsr()return uName;QByteArray datagram;datagram.resize(udpSocket-pendingDatagramSize(); udpSocket-readDatagram(datagram.data(),datagram.size(); QDataStream in (&datagram,QIODevice:ReadOnly);msgT

13、ype;in msgType; /用戶類型獲取QString usrName,msg; /用戶名、信息QString time = QDateTime:currentDateTime().toString(yyyy-MM-dd hh:mm:ss);switch (msgType) case Msg:in usrName msg;ui-msgBrowser-setTextColor(Qt:blue);ui-msgBrowser-setCurrentFont(QFont(Times New Roman,12); ui-msgBrowser-append( + usrName + + time);u

14、i-msgBrowser-append(msg); break;case UsrEnter:in usrName ; usrEnter(usrName); break;case UsrLeft:in usrName; usrLeft(usrName,time); break;default:break;新用戶進(jìn)入用戶離開/用戶離開void Widget:usrLeft(QString usrname,QString time)rowNum = ui-usrTblWidget-findItems(usrname, Qt:MatchExactly).()-row();ui-usrTblWidget

15、-removeRow(rowNum); ui-msgBrowser-setTextColor(Qt:gray);/處理新用戶加入void Widget:usrEnter(QString usrname)bool isEmpty =ui-usrTblWidget-findItems(usrname,Qt:MatchExactly).isEmpty(); if(isEmpty)QTableWidgetItem *usr = new QTableWidgetItem(usrname);ui-usrTblWidget-insertRow(0);ui-usrTblWidget-setItem(0,0,u

16、sr);ui-msgBrowser-setTextColor(Qt:gray);ui-msgBrowser-setCurrentFont(QFont(Times New Roman,10); ui-msgBrowser-append(tr(%1！).arg(usrname);ui-usrNumLbl-setText(tr(人 數(shù)：%1).arg(ui-usrTblWidget-rowCount();/已經(jīng)的各個端點也要告知新加入的端點他們自己的信息，若不這樣做，在新端點用戶列表中就無法顯示其他已經(jīng)的用戶sndMsg(UsrEnter);/獲取聊天信息QString Widget:getMsg(

17、)QString msg = ui-msgTxtEdit-toHtml(); ui-msgTxtEdit-clear();ui-msgTxtEdit-setFocus(); return msg;重寫離開Eventvoid closeEvent(QCloseEvent *)發(fā)送按鈕和離開按鈕信號槽連接至此可以測試聊天功能6 輔助功能6.1 字體設(shè)置connect(ui-boBox:currentFontChanged,this,=(const QFont &f) ui-msgTxtEdit-setCurrentFont(f);ui-msgTxtEdit-setFocus(););connect

18、(ui-sendBtn,&QPushButton:clicked,this,=() sndMsg(Msg););connect(ui-exitBtn,&QPushButton:clicked,this,=()this-close(););void Widget:closeEvent(QCloseEvent *e)emit this-widgetClose(); sndMsg(UsrLeft); udpSocket-close(); udpSocket-destroyed(); QWidget:closeEvent(e);ui-msgBrowser-setCurrentFont(QFont(Ti

19、mes New Roman, 10);ui-msgBrowser-append(QString(%1 于 %2 離開！).arg(usrname).arg(time); ui-usrNumLbl-setText(QString(人數(shù)：%1).arg(ui-usrTblWidget-rowCount();6.2字號設(shè)置6.3加粗6.4傾斜6.5 下劃線connect(ui-underlineTBtn,&QToolButton:clicked,this,=(bool checked)connect(ui-italicTBtn,&QToolButton:clicked,this,=(bool che

20、cked) ui-msgTxtEdit-setFontItalic(checked);ui-msgTxtEdit-setFocus(););connect(ui-boldTBtn,&QToolButton:clicked,this,=(bool checked) if(checked)ui-msgTxtEdit-setFontWeight(QFont:Bold);elseui-msgTxtEdit-setFontWeight(QFont:Normal);ui-msgTxtEdit-setFocus(););void(QComboBox:*cbxSingal)(constQString&text)= boBox:currentIndexChanged;connect(ui-sizeCbx,cbxSingal,this,=(const QString &text) ui-msgTxtEdit-setFontPoSize(text.toDouble();ui-msgTxtEdit-setFocus(););6.6 設(shè)置文本顏色6.7 保存connect(ui-saveBtn,&QToolButton:c