Qt-Day08-学习笔记

1. 绘图事件处理

//他是系统程序自动调用的,进行实时绘制界面
void Widget::paintEvent(QPaintEvent *event)        //窗口绘制的一个虚函数
{
    QPainter painter(this);                             //一定要知名是在哪里进行绘制
    painter.setRenderHints(QPainter::Antialiasing);     //抗锯此类型
    painter.setBrush(Qt::yellow);                       //绘制背景颜色
    painter.setPen(Qt::black);                          //绘制边框线的颜色
    painter.drawRect(50,50,200,100);                    //绘制矩形
    painter.drawEllipse(50,50,200,100);                 //绘制椭圆

    /***********绘制文本**********/
//    DrawText();
//    DrawLine();
//    DrawRect();
//    DrawArc();
//    DrawEllipse();
//    DrawPolygon();
//    DrawPixMap();
}

1.2. 绘制文本

void Widget::DrawText()
{
    QPainter painter(this);                 //绘图工具 一定要指明在那个类里面进行绘制
    //设置画笔的颜色
    painter.setPen(QColor(110,160,230));
    //设置字体：微软雅黑 字体的大小 50
    QFont font;
    font.setFamily("微软雅黑");             //设置字体的样式是微软雅黑
    font.setPointSize(50);                 //点的大小
    font.setItalic(true);                  //斜贴
    //加载绘制的字体的样式
    painter.setFont(font);
    //绘制字体
     const QRectF rectangle = QRectF(0, 0, 400, 400);
    painter.drawText(rectangle,Qt::AlignCenter,"爱你");
    //painter.drawText(100,100,100,100,0,"QT");
}

1.3. 画线

void Widget::DrawLine()    //绘制直线
{
    QPainter painter(this);              //绘图工具,一定要指明在哪个类里面进行绘制
    //设置画笔的颜色
    painter.setPen(Qt::black);
    //设置抗锯齿
    painter.setRenderHint(QPainter::Antialiasing,true);
    //绘制线条
    painter.drawLine(QPointF(0,height()),QPointF(width()/2,height()/2));
}

1.4. 绘制矩形

void Widget::DrawRect()         //绘制矩形
{
    QPainter painter(this);
    //设置抗锯齿
    painter.setRenderHint(QPainter::Antialiasing,true);
    //设置边框的颜色 以及边框线的宽度
    painter.setPen(QPen(QColor(110,160,230),5));
    //设置背景颜色
    painter.setBrush(QColor(255,160,90));
    //画矩形
    painter.drawRect(50,250,200,150);
}

1.5. 绘制弧线

void Widget::DrawArc()        //绘制弧线
{
    QPainter painter(this);
    //设置一个反走样
    painter.setRenderHint(QPainter::Antialiasing,true);
    //矩形
    QRectF rect(50,450,80,90);
    //起始的角度 狐的角度
    int startAngle = 60 * 36;
    //跨越的度数 弧长
    int spanAngle = 12*63;

    painter.setPen(QPen(QColor(110,160,230),5));
    painter.drawArc(rect,startAngle,spanAngle);
}

1.6. 绘制椭圆

void Widget::DrawEllipse()    //绘制椭圆
{
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing,true);
    painter.setPen(QPen(QColor(110,160,230),5));
    //painter.drawEllipse(QPointF(120,60),50,20);//绘制椭圆
    painter.drawEllipse(120,500,20,50);

    painter.setBrush(QColor(255,160,90));
    //painter.drawEllipse(QPointF(120,180),50,50);//绘制圆
    painter.drawEllipse(120,600,50,50);
}

1.7. 绘制多边形

void Widget::DrawPolygon()    //绘制多边形
{
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing,true);
    painter.setPen(QPen(QColor(110,160,230),2));
    //设置各个点位的坐标
    static const QPointF point[4] = {QPointF(30,40),QPointF(60,150),
                                     QPointF(150,160),QPointF(250,130)};
    //绘制多边形
    painter.drawPolygon(point,4);
}

1.8. 显示图片

void Widget::DrawPixMap()
{
    QPixmap pixmap;
    pixmap.load(":/bk.png");
    int width = pixmap.width();//获取图片的宽
    int height = pixmap.height();//获取图片的高
    QPainter painter(this);
    painter.drawPixmap(0,0,400,400,pixmap);
}

2. 画刷

2.1. 渐变填充

void Widget::paintEvent(QPaintEvent *event)     //绘制界面
{
    event->rect();
    //QLinearGradientGradual();           //线性渐变:在开始点和结束点之间插入颜色
    QRadialGradientGradual();         //辐射渐变:在焦点和环绕他的圆环间插入颜色(以圆心为中心显示渐变)
    //QConicalGradientGradul();         //锥形渐变:在圆心周围插入颜色(围绕一个中心点显示渐变)
}

• 线性渐变：在开始点和结束点之间插入颜色

void Widget::QLinearGradientGradual()           //从起点到终点渐变
{
    QPainter painter(this);//绘图工具 一定要指明再那个类里面进行绘制

    //抗锯齿
    painter.setRenderHint(QPainter::Antialiasing,true);

    //设置颜色
    QLinearGradient linear(QPointF(50,50),QPointF(490,375));//起点到终点
    linear.setColorAt(0,Qt::black);
    linear.setColorAt(1,Qt::white);

    //设置他的显示模式
    linear.setSpread(QGradient::PadSpread);

    //设置画笔颜色。宽度
    painter.setPen(QPen(QColor(0,160,230),2));

    //设置填充（画图的背景）
    painter.setBrush(linear);

    //绘制矩形
    painter.drawRect(QRectF(50,50,490,375));
}

• 辐射渐变：在焦点和环绕它的圆环间插入颜色
  需要指定圆心和半径，确定一个圆，在指定一个焦点

void Widget::QRadialGradientGradual()           //以圆心为中心显示渐变
{
    QPainter painter(this);//绘图工具 一定要指明再那个类里面进行绘制

    //抗锯齿
    painter.setRenderHint(QPainter::Antialiasing,true);

    //设置渐变色
    QRadialGradient radial(110,110,50,130,130);
    radial.setColorAt(0,Qt::black);
    radial.setColorAt(1,Qt::white);

    //设置他的显示模式
    radial.setSpread(QGradient::ReflectSpread);

    //设置画笔颜色。宽度
    painter.setPen(QPen(QColor(0,160,230),2));

    //设置填充（画图的背景）
    painter.setBrush(radial);

    //绘制矩形
    painter.drawRect(QRectF(50,50,490,375));
}

• 锥形渐变：在圆心周围插入颜色
  指定一个中心点和角度，然后按照逆时针从给定角度开始环绕中心点插入颜色。

在这里插入代码片

void Widget::QConicalGradientGradul() //围绕一个中心点显示渐变
{
QPainter painter(this);//绘图工具 一定要指明再那个类里面进行绘制

//抗锯齿
painter.setRenderHint(QPainter::Antialiasing,true);

//设置渐变色
QConicalGradient conical(110,110,45);
conical.setColorAt(0,Qt::black);
conical.setColorAt(1,Qt::white);

//设置他的显示模式
conical.setSpread(QGradient::ReflectSpread);

//设置画笔颜色。宽度
painter.setPen(QPen(QColor(0,160,230),2));

//设置填充（画图的背景）
painter.setBrush(conical);

//绘制矩形
painter.drawRect(QRectF(50,50,490,375));

}

3. 绘制图像

void Widget::paintEvent(QPaintEvent *event) //绘制界面
{
    event->rect();
    paint();
    //paintTranslation();
    //paintRotate();
    //paintZoom();
    //paintTwist();
}

图形渐变常用五个接口

• translate（qreal dx, qreal dy）：平移-沿x轴移动坐标系dx，沿y轴移动dy
• scale(qreal sx, qreal sy):缩放-按sx水平和sy垂直缩放坐标系
• rotate(qreal angle, Qt::Axis axis = Qt::ZAxis):旋转-将坐标系绕指定轴逆时针旋转给定角度
• shear(qreal sh, qreal sv)扭曲-水平剪切sh和垂直剪切sv坐标系。
• reset（）：重置为单位矩阵

3.1. 默认加载图片

void Widget::paint() //默认加载图片
{
    QPainter painter(this);//绘图工具

    painter.setRenderHint(QPainter::Antialiasing,true);//ture真false假

    painter.drawPixmap(QRect(0,0,700,400),QPixmap(":/1.jpg"));
}

3.2. 图片平移

void Widget::paintTranslation() //图片平移
{
    //绘图工具
    QPainter painter(this);

    //抗锯齿
    painter.setRenderHint(QPainter::Antialiasing,true);//ture真false假

    //定义平移
    QTransform transform;

    //实现平移 120,20就是平移起始位置
    transform.translate(120,20);
    painter.setTransform(transform);

    painter.drawPixmap(QRect(0,0,200,200),QPixmap(":/1.jpg"));
}

3.3. 图片旋转

void Widget::paintRotate() //旋转
{
    //绘图工具
    QPainter painter(this);

    //抗锯齿
    painter.setRenderHint(QPainter::Antialiasing,true);//ture真false假

    //定义平移
    QTransform transform;

    //实现平移 120,20就是平移起始位置
    transform.translate(120,20);
    //旋转
    transform.rotate(45,Qt::YAxis);
    painter.setTransform(transform);

    painter.drawPixmap(QRect(0,0,200,200),QPixmap(":/1.jpg"));
}

3.4. 图片缩放

void Widget::paintZoom() //缩放
{
    //绘图工具
    QPainter painter(this);

    //抗锯齿
    painter.setRenderHint(QPainter::Antialiasing,true);//ture真false假

    //定义平移
    QTransform transform;

    //实现平移 120,20就是平移起始位置
    transform.translate(120,20);
    //旋转
    transform.rotate(45,Qt::YAxis);
    //缩放
    transform.scale(0.5,0.5);
    painter.setTransform(transform);

    painter.drawPixmap(QRect(0,0,200,200),QPixmap(":/1.jpg"));
}

3.5. 图片扭曲

void Widget::paintTwist() //扭曲
{
    //绘图工具
    QPainter painter(this);

    //抗锯齿
    painter.setRenderHint(QPainter::Antialiasing,true);//ture真false假

    //定义平移
    QTransform transform;

    //扭曲
    transform.shear(0.5,0);
    painter.setTransform(transform);

    painter.drawPixmap(QRect(0,0,200,200),QPixmap(":/1.jpg"));
}

4. 文本绘制

drawtext()绘制文本
当文本过长时我们运用到"QTextOption"来进行换行
文本过长，但是我们有不想换行，然后我们用省略号。。。我们就会用到QFontMetrics来实现
QFont设置文本的带笑傲，字体间距等一系列的效果

 //旋转
    QTransform transform;
    transform.rotate(45);

    QFont font;
    //设置字体的样式
    font.setFamily("微软雅黑");
    //设置大小 字体的大小是双数
    font.setPointSize(22);
    //设置斜体
    font.setItalic(true);
    //设置下划线
    font.setUnderline(true);
    //设置上划线
    font.setOverline(true);
    //设置字母大小
    font.setCapitalization(QFont::SmallCaps);
    //设置字体间距
    font.setLetterSpacing(QFont::AbsoluteSpacing,20);

    //使用字体
    painter.setFont(font);

    //转换一下
    painter.setTransform(transform);

    painter.drawText(rect(),"爱你哟么么哒");

5. 鼠标点击事件

virtual void mousePressEvent(QMouseEvent *event);           //鼠标点击事件
virtual void mouseReleaseEvent(QMouseEvent *event);         //鼠标松开事件
virtual void mouseDoubleClickEvent(QMouseEvent *event);     //鼠标双击事件
virtual void mouseMoveEvent(QMouseEvent *event);            //鼠标双击事件
bool event(QEvent *event);                                  //做于事件分发

void Widget::mousePressEvent(QMouseEvent *event)            //鼠标点击事件
{
//    if(event->buttons()== Qt::LeftButton)
//    {
//        qDebug()<<"点击左边按钮"<<endl;
//    }
//    else if(event->buttons()== Qt::RightButton)
//    {
//        qDebug()<<"点击右边按钮"<<endl;
//    }
}

void Widget::mouseReleaseEvent(QMouseEvent *event)          //鼠标松开事件
{
//    if(event->buttons()== Qt::LeftButton)
//    {
//        qDebug()<<"松开左边按钮"<<endl;
//    }
//    else if(event->buttons()== Qt::RightButton)
//    {
//         qDebug()<<"松开右边按钮"<<endl;
//    }
}

void Widget::mouseDoubleClickEvent(QMouseEvent *event)      //鼠标双击事件
{

}

void Widget::mouseMoveEvent(QMouseEvent *event)             //鼠标双击事件
{

}

bool Widget::event(QEvent *event)
{
    if(event->type() == QEvent::KeyPress)
    {
        //将QEvent对象转换为真正qkeyevent对象
        QKeyEvent *keyEvent = static_cast<QKeyEvent *>(event);
        if(keyEvent->key() == Qt::Key_0)
        {
            qDebug()<<"您触发我"<<endl;
            return true;
        }
    }
    //按照原来的流程来进行事件分发
    return QWidget::event(event);
}