目錄

一：自定義圖元控件

二：定時器的使用

三：動畫效果

四：核心源碼

五：項目完整源碼分享

---

一：自定義圖元控件

視圖類，命名，繼承QObject信號槽機制?

圖元類，命名，繼承QObject信號槽機制?

二：定時器的使用

三：動畫效果

圖元動畫顯示結果如下

利用定時器

advance

控制圖元進行移動

圖元相互靠近?

圖元互相遠離?

圖元 碰撞檢測

四：核心源碼

myview.h .cpp【視圖類】

#ifndef MYVIEW_H #define MYVIEW_H#include <QObject> #include<QGraphicsView> //視圖 #include<QGraphicsScene> //場景 #include"myitem.h" #include<QTimer>//定時器class myView : public QGraphicsView//派生出自己的視圖類 {Q_OBJECT public:explicit myView();QGraphicsScene *myScene;//視圖中放置場景myItem *item1;myItem *item2;QTimer *timer;signals:public slots:void timeSlot(); };#endif // MYVIEW_H #include "myview.h" #include<QDebug>myView::myView() {this->resize(800,800);QGraphicsScene *myScene = new QGraphicsScene;this->setScene(myScene); //視圖中添加場景item1 = new myItem(":/image/050302.png",1,1);//圖元1類型item2 = new myItem(":/image/050302.png",2,1);//圖元2類型item1->setPos(100,this->height()/2);item2->setPos(500,this->height()/2);myScene->addItem(item1); //場景中放置圖元myScene->addItem(item2); //場景中放置圖元timer = new QTimer(this);//connect(timer,SIGNAL(timeout()),this,SLOT(timeSlot()));//讓場景中的圖元得到控制connect(timer,SIGNAL(timeout()),myScene,SLOT(advance()));timer->start(1000);}void myView::timeSlot() {qDebug()<<"timeSlot";}

myitem.h .cpp 【圖元類】

#ifndef MYITEM_H #define MYITEM_H#include <QObject> #include<QGraphicsItem>//圖元class myItem : public QObject,public QGraphicsItem {Q_OBJECT public:explicit myItem(QObject *parent = 0);myItem(QString filename,int iType,bool isStatus);//碰撞檢測函數QRectF boundingRect() const;//虛函數函數字體是斜體字//圖元繪制函數void paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget);QPixmap image; //圖元圖片int iType; //圖元類型bool isStatus; //圖元狀態signals:public slots:void advance(int phase);//純虛函數 -- 需要實現 };#endif // MYITEM_H #include "myitem.h" #include<QPainter> #include<QDebug> #include"indexwin.h"myItem::myItem(QObject *parent) : QObject(parent) {}myItem::myItem(QString filename, int iType, bool isStatus) {image.load(filename);this->iType = iType;this->isStatus = isStatus;}//碰撞 特效 需要的類 //返回值：一個矩形 QRectF myItem::boundingRect() const {return QRectF(0-image.width()/2,0-image.height()/2,image.width(),image.height());}void myItem::paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget) {painter->drawPixmap(0-image.width()/2,0-image.height()/2,image.width(),image.height(),image);}void myItem::advance(int phase) {qDebug()<<"advance";if(this->iType ==1){//碰撞會將圖元加到鏈表//鏈表數量大于0就是發生碰撞了if(collidingItems().count()>0){qDebug()<<"碰撞了";// 跳轉界面// IndexWin *p = new IndexWin;// p->show();}//坐標相對于場景進行變化 方向 位置this->setPos(mapToScene(2,0));//-2向左移動}if(this->iType ==2){//坐標相對于場景進行變化 方向 位置this->setPos(mapToScene(-2,0));//2向右移動}}

五：項目完整源碼分享

indexwin.h .cpp【布局管理的學習】

#ifndef INDEXWIN_H #define INDEXWIN_H#include <QWidget> #include<QVBoxLayout>//垂直布局 #include<QHBoxLayout>//水平布局 #include<QPushButton> #include<QLineEdit> #include<QListWidget>//制作視頻頁面列表class IndexWin : public QWidget {Q_OBJECT public:explicit IndexWin(QWidget *parent = 0);QWidget *leftwin;QWidget *topwin;QWidget *indexwin;QWidget *rightwin;QListWidget *videowinlist;//制作視頻頁面列表QLineEdit *searchEdit;QPushButton *userBtn;QPushButton *vipBtn;signals:public slots:void goNewwinSlot(); };#endif // INDEXWIN_H #include "indexwin.h" #include<QStringList> #include<QDebug> #include<QMessageBox>//彈窗 #include<QListWidget>//多個按鈕顯示，存放窗口的容器 #include<QDir>//路徑 #include<QPixmap>//放置圖片 #include<QListView>//設置圖片模式IndexWin::IndexWin(QWidget *parent) : QWidget(parent) {this->resize(1500,800);leftwin = new QWidget();topwin = new QWidget();//indexwin = new QWidget();rightwin = new QWidget();videowinlist = new QListWidget();//視頻列表//設置圖片模式--上面圖片下面名稱videowinlist->setViewMode(QListView::IconMode);//獲取視頻圖片路徑QString videopath = QDir::currentPath()+"/image";qDebug()<<videopath;QDir dir(videopath);//查找目錄QStringList moviename;moviename << "*.png";//查找.png圖片QStringList files = dir.entryList(moviename,QDir::Files|QDir::Readable,QDir::Name);qDebug()<<files; //查找.png圖片名for(int i=0;i<files.size();i++){//顯示.png圖片及名稱QListWidgetItem *newitem = new QListWidgetItem(QIcon(QPixmap(videopath+"/"+files.at(i))),files.at(i));//設置圖片尺寸newitem->setSizeHint(QSize(200,150));videowinlist->addItem(newitem);}//方法一：自定義所有控件//控件水平 頂部控件水平分布QHBoxLayout *hboxlayout = new QHBoxLayout(topwin);searchEdit = new QLineEdit();userBtn = new QPushButton();vipBtn = new QPushButton();hboxlayout->addStretch();hboxlayout->addWidget(searchEdit);hboxlayout->addWidget(userBtn);hboxlayout->addWidget(vipBtn);//方法二：動態創建所有控件//按鈕控件垂直 左邊窗口放置一個垂直布局QVBoxLayout *vboxlayout1 = new QVBoxLayout(leftwin);QStringList funBtnlist;funBtnlist<<"logo"<<"視頻"<<"動漫"<<"電影";for(int i=0;i<funBtnlist.size();i++){QPushButton *newBtn = new QPushButton(funBtnlist.at(i));//多個按鈕綁定一個槽connect(newBtn,SIGNAL(clicked(bool)),this,SLOT(goNewwinSlot()));vboxlayout1->addWidget(newBtn);}//加空白 -- 將按鈕上置vboxlayout1->addStretch();//兩個窗口垂直//右半部分的布局放置頂部窗口和主窗口QVBoxLayout *rightboxlayout = new QVBoxLayout(rightwin);rightboxlayout->addWidget(topwin);//rightboxlayout->addWidget(indexwin);rightboxlayout->addWidget(videowinlist);//左邊窗口和前面兩個窗口垂直的部分 進行水平放置 最大的布局有thisQHBoxLayout *mainlayout = new QHBoxLayout(this);mainlayout->addWidget(leftwin);//放置窗口//mainlayout->addLayout(rightboxlayout);//放置布局mainlayout->addWidget(rightwin); }void IndexWin::goNewwinSlot() {//獲取點擊按鈕的文本信息QPushButton *btn = (QPushButton *)sender();QString btnName = btn->text();qDebug()<<btn->text();//根據文本進行判斷if(btnName == "logo"){//彈窗顯示信息QMessageBox::information(NULL,"logo模塊","這是logo模塊測試");}if(btnName == "視頻"){QMessageBox::information(NULL,"電視模塊","這是電視模塊測試");}if(btnName == "動漫"){QMessageBox::information(NULL,"動漫模塊","這是動漫模塊測試");}if(btnName == "電影"){QMessageBox::information(NULL,"電影模塊","這是電影模塊測試");}}

usersdata.h .cpp【多用戶登錄的學習】

#ifndef USERSDATA_H #define USERSDATA_H #include<QString>//字符串class usersdata { public:usersdata();//默認構造usersdata(QString username,QString userpwd);//帶參構造void setUsername(QString username);QString getUsername();void setUserpwd(QString userpwd);QString getUserpwd();private:QString username;QString userpwd; };#endif // USERSDATA_H #include "usersdata.h"usersdata::usersdata() {}usersdata::usersdata(QString username, QString userpwd) {this->username = username;this->userpwd = userpwd; }void usersdata::setUsername(QString username) {this->username = username; }QString usersdata::getUsername() {return username; }void usersdata::setUserpwd(QString userpwd) {this->userpwd = userpwd; }QString usersdata::getUserpwd() {return userpwd; }

widget.h .cpp 【繪制界面 以及 信號和槽的學習】

#ifndef WIDGET_H #define WIDGET_H#include<QPushButton>//按鈕 #include<QLineEdit>//編輯框 #include<QLabel> //文本 #include<QMovie> //動態圖#include <QWidget> #include<QList> #include"usersdata.h"class Widget : public QWidget {Q_OBJECTpublic:Widget(QWidget *parent = 0);~Widget();QPushButton *loginBtn; //登錄按鈕QLineEdit *userEdit; //用戶編輯框QLineEdit *pwdEdit; //密碼編輯框QLabel *logoLab; //logo文本，放置圖片QLabel *userLab; //用戶文本QLabel *pwdLab; //密碼文本QLabel *loginLab; //登錄界面文本QLabel *gifLab; //放置動態圖文本QMovie *movie; //動態圖QList<usersdata *> userlist;//用戶鏈表//所有槽函數的定義使用 public slots:void goLoginSlot(); };#endif // WIDGET_H #include "widget.h" #include<QDebug> //輸出頭文件 #include"indexwin.h" //主界面窗口 #include<QDesktopWidget>//分辨率Widget::Widget(QWidget *parent): QWidget(parent) {//數據類的準備usersdata *user1 = new usersdata("admin","123456");usersdata *user2 = new usersdata("manager","123456");userlist.append(user1);userlist.append(user2);//窗口大小設置this->resize(500,400);//setWindowFlags(Qt::FramelessWindowHint);//無邊框//setAttribute(Qt::WA_TranslucentBackground);//背景透明QDesktopWidget w;int deskWidth = w.width();int deskHeight = w.height();qDebug()<<deskWidth<<deskHeight;//創建對象loginBtn = new QPushButton(this);userEdit = new QLineEdit(this);pwdEdit = new QLineEdit(this);logoLab = new QLabel(this);userLab = new QLabel(this);pwdLab = new QLabel(this);loginLab = new QLabel(this);gifLab = new QLabel(this);gifLab->resize(100,100); //動態圖文本大小movie = new QMovie("image/0505.gif"); //創建對象-動態圖選擇gifLab->setMovie(movie); //放置動態圖movie->start(); //動態圖顯示// loginBtn->setText("登錄");//登錄按鈕的起始位置，寬高設置loginBtn->setGeometry(200,200,100,50);//在登錄按鈕中放置圖片loginBtn->setIcon(QIcon(QPixmap(":/image/050302.png")));//圖片自適應按鈕大小loginBtn->setIconSize(QSize(100,50));//userEdit->setGeometry(200,100,250,20);//pwdEdit->setGeometry(200,150,250,20);//用戶編輯框起始位置userEdit->move(200,100);//用戶編輯框提示內容信息userEdit->setPlaceholderText("請輸入用戶名");//用戶編輯框設置輸入長度userEdit->setMaxLength(11);//密碼編輯框起始位置pwdEdit->move(200,150);//密碼編輯框提示內容信息pwdEdit->setPlaceholderText("請輸入密碼");//密碼編輯框設置輸入長度pwdEdit->setMaxLength(8);//密碼編輯框設置輸入內容密文顯示pwdEdit->setEchoMode(QLineEdit::Password);//logo文本大小//logoLab->resize(100,50);//放置logo圖片到logoLab文本中//logoLab->setPixmap(QPixmap(":/image/050301.png").scaled(logoLab->size()));//用戶名文本起始位置userLab->move(100,100);//用戶名文本內容userLab->setText("用戶名");//密碼文本起始位置pwdLab->move(100,150);//密碼文本內容pwdLab->setText("密碼");//登錄文本位置loginLab->move(250,40);//登錄文本內容loginLab->setText("登錄界面");//按鈕點擊讓窗口關閉//connect(loginBtn,SIGNAL(clicked(bool)),this,SLOT(close()));//點擊按鈕跳轉主界面connect(loginBtn,SIGNAL(clicked(bool)),this,SLOT(goLoginSlot())); }Widget::~Widget() {}void Widget::goLoginSlot() {qDebug()<<"點擊登錄";//獲取 編輯框內容QString username = userEdit->text();//qDebug()<<username;QString userpwd = pwdEdit->text();//字符串形式toLatin1轉成數組形式for(int i=0;i<userlist.size();i++){//if(strcmp(username.toLatin1(),userlist.at(i)->getUsername().toLatin1()) == 0// &&strcmp(userpwd.toLatin1(),userlist.at(i)->getUserpwd().toLatin1()) == 0)if(username.compare(username,userlist.at(i)->getUsername())==0&&userpwd.compare(userpwd,userlist.at(i)->getUserpwd())==0){qDebug()<<"登錄成功";IndexWin *p = new IndexWin;p->show();this->hide();}} }

main.cpp

#include "widget.h" #include <QApplication> #include"indexwin.h" #include<QGraphicsScene> //場景 #include<QGraphicsRectItem>//圖元 #include<QGraphicsView> //視圖 #include<QTransform> #include"myview.h"int main(int argc, char *argv[]) {QApplication a(argc, argv);myView w;w.show();return a.exec(); }

總結

以上是生活随笔為你收集整理的【Qt学习】 碰撞检测 图元绘制的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。