首页
登录 | 注册

Qt学习之路-简易画板2(自由涂鸦)

我个人觉得Designer不适合新手学习所以就自己写代码吧。先讲最简单的,实现画笔工具。首先创建一个主窗口

现在先不管主窗口,然后创建一个画板组件,新建一个C++类名字为PaintWidget基于QWidget类。

下面是代码

画板组件头文件代码:

//先理解画笔,不使用双缓冲绘图
#ifndef PAINTWIDGET_H
#define PAINTWIDGET_H

#include 
#include 
#include 
class PaintWidget : public QWidget
{
    Q_OBJECT
public:
    explicit PaintWidget(QWidget *parent = 0);//------------构造函数
   

public  slots:


protected:
    void paintEvent(QPaintEvent *);//-----------------------重绘事件(重点:由update()函数触发)
    void mousePressEvent(QMouseEvent *);//------------------鼠标按下事件
    void mouseMoveEvent(QMouseEvent *);//-------------------鼠标移动事件(重点理解)
    void mouseReleaseEvent(QMouseEvent *);//----------------鼠标释放事件

    void paint(QImage &theImage);//-------------------------画图工具
signals:

private:

    QImage image;//-----------------------------------------一块画布
    QRgb backColor;//---------------------------------------画布背景色
    QPoint lastPoint;//-------------------------------------前一个点,因为线是由无数点组成的
    QPoint endPoint;//--------------------------------------后一个点(结束点)
    bool isDrawing;//---------------------------------------判断是否在绘图也就是判断鼠标是否操作
};
#endif

画板组件cpp文件代码:

#include "paintwidget.h"
#include 
#include 
PaintWidget::PaintWidget(QWidget *parent) :
    QWidget(parent)
{
    isDrawing = false;//---------------------------------------------------未开时绘图,这是双缓冲用的,现在可以不用考虑
    image = QImage(700,500,QImage::Format_RGB32);//------------------------画板大小700,500,用32位色(就是平时用的都有)
    backColor = qRgb(255,255,255);
   
    image.fill(backColor);//-----------------------------------------------RGB(255,255,255)为白色,image画布被填充为白色
}

void PaintWidget :: paintEvent(QPaintEvent *){//---------------------------可理解为是一个绘图终端函数,在本程序中只通过update()触发,调用结束后
                                              //---------------------------这也是一个状态函数,只要没关闭mainwindow,一直待机等待update()触发
   
    QPainter painter(this);//----------------------------------------------QPainter是绘图操作,父亲是paintwidget类而paintwidget的父亲又是mainwindow
                           //----------------------------------------------既关闭mainwindow就关闭paintwidget就关闭了painter
   
    painter.drawImage(0,0,image);//----------------------------------------把图画在image上
}

void PaintWidget :: mousePressEvent(QMouseEvent *event){
    if(event->button() == Qt::LeftButton){//-------------------------鼠标按下且为左键
        lastPoint = event->pos();//----------------------------------设置起点为鼠标按下的点
        endPoint = event->pos();//-----------------------------------设置终点为鼠标按下的点
        isDrawing = true;//------------------------------------------开始绘图了
    }
}

void PaintWidget :: mouseMoveEvent(QMouseEvent *event){ //重点理解部分

    if(event->buttons() & Qt::LeftButton){//-------------------------鼠标按下左键并移动
        endPoint = event->pos();//-----------------------------------鼠标每移动一次都刷新终点
        
        paint(image);        //--------------理解清楚这个函数--------仔细看看void paint (QImage &theImage)函数
                            //---------------------------------------最后会通过update()函数调用void paintEvent(QPaintEvent *)重绘函数
                            //---------------------------------------再仔细看看void paintEvent(QPaintEvent *)重绘函数会把图画在image画布上
                            //---------------------------------------我觉得理解了这个就理解得差不多了
 }
}
void PaintWidget :: mouseReleaseEvent(QMouseEvent *event){
     isDrawing = false;//--------------------------------------------绘图完毕
    paint(image);//--------------------------------------------------把最后一点画在image画布上,可参考上面注释
}


void PaintWidget :: paint (QImage &theImage){//------------------(画图函数)调用这个函数就是调用重绘函数,把图画在image上
    QPainter p(&theImage); //------------------------------------把图画在theImage(theImage是painterDevice类型参数,由于是引用,其实就是画在image上)
    QPen apen;
    apen.setWidth(5);//------------------------------------------画笔线条宽度设置为5
    p.setPen(apen);//--------------------------------------------设置画笔线条宽度,也可以不设置,既把这两句注释掉,线条默认宽度为1
    p.drawLine(lastPoint,endPoint);//----------------------------画线,由于鼠标移动事件会调用此函数,因此lastPoint和endPoint相距近似为0
                                    //---------------------------因此可近似看成画点,点连起来就是画笔的痕迹了

    lastPoint = endPoint;//--------------------------------------把终点复制给起点
    update();//--------------------------------------------------刷新
}

主窗口头文件代码:

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include 
#include "paintwidget.h"
#include //滚动条


class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();

protected:
signals:
    
private slots:
    
private:

    PaintWidget *area;//-----------------------------------创建一个画板组件
    QScrollArea *scrollArea;//-----------------------------创建一个滚动条
};

#endif // MAINWINDOW_H

主窗口cpp文件代码:

#include "mainwindow.h"
#include 
#include 
MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent)
{
    this->setWindowTitle(tr("Drawing Board"));

    area = new PaintWidget;
    resize(700,500);
    scrollArea = new QScrollArea;
    scrollArea->setBackgroundRole(QPalette::Dark);
    scrollArea->setWidget(area);
    scrollArea->widget()->setMinimumSize(800,600);
    setCentralWidget(scrollArea);

}

MainWindow::~MainWindow()
{

}

OK,大功告成,运行就可以使用画笔功能了。后面再讲双缓冲画矩形,直线,椭圆。


本文网址:http://www.bnee.net/article/50318.html

相关文章


2019 bnee小站 webmaster#bnee.net
12 q. 0.021 s.
湘ICP备19013596号-2