图形视图框架Qt_C++

1. 图形效果

图形效果（graphics effect），QGraphicsEffect类是所有图形效果的基类。

源对象（图形项）和目标设备（视图的视口）之间挂接了渲染管道和一些操作来实现。

图像效果可以实施在任何一个图形像或者非顶层窗口的任何窗口部件上，只须先创建一个图形效果对象，然后调用setGraphicsEffect()函数来使用这个图形效果即可，如果想停止使用该效果，可以调用setEnabled(false)。

QT标准图形效果

图形效果类	介绍
QGraphicsBulrEffect	该类提供了一个模糊效果，该效果一般用来减少源对象细节的显示。可以用setBlurRadius()函数来修改细节等级，默认的模糊半径是5像素；还可以使用setBlurHints()来指定模糊怎样执行。
QGraphicsColorizeEffect	该类提供了一个染色效果，该效果用来为源对象进行染色。可以使用setColor()函数修改颜色，默认是浅蓝色QColor(0,0,192)；还可以使用setStrength()来修改效果的强度，强度在0.0~1.0之间，默认1.0。
QGraphicsDropShadowEffect	该类提供了一个阴影效果，该效果可以为源对象提供一个阴影。可以使用setColor()来修改阴影的颜色，默认是透明的黑灰色QColor(63,63,63,180)；可以使用setOffset()来改变阴影的偏移值，默认为右下方8像素；还可以使用setBlurRadius()来改变阴影的模糊半径，其默认值为1
QGraphicsOpacityEffect	该类提供了一个透明效果，该效果可以使源对象透明。可以使用setOpacity()函数来修改透明度，其值在0.0~1.0之间，0.0表示完全透明，1.0表示完全不透明

1.1代码

//添加在myitem.cpp文件中添加头文件#include 
//键盘按下事件处理函数，判断是否是向下方向键，如果是，则向下移动图形项
void MyItem::keyPressEvent(QKeyEvent *event)
{
//    if(event->key()==Qt::Key_Down)
//        moveBy(0,10);

    //图像效果
    switch (event->key()) {
    case Qt::Key_1:{
        //QGraphicsBlurEffect模糊效果
        QGraphicsBlurEffect *blurEffect=new QGraphicsBlurEffect;
        blurEffect->setBlurHints(QGraphicsBlurEffect::QualityHint);//模糊怎样执行
        blurEffect->setBlurRadius(8);//模糊半径为8像素
        setGraphicsEffect(blurEffect);
        break;
    }
    case Qt::Key_2:{
        //QGraphicsColorizeEffec染色效果
        QGraphicsColorizeEffect *colorizeEffect=new QGraphicsColorizeEffect;
        colorizeEffect->setColor(Qt::white);//修改颜色
        colorizeEffect->setStrength(0.6);//修改效果强度
        setGraphicsEffect(colorizeEffect);
        break;
    }
    case Qt::Key_3:{
        //QGraphicsDropShadowEffect阴影效果
        QGraphicsDropShadowEffect *dropShadowEffect=new QGraphicsDropShadowEffect;
        dropShadowEffect->setColor(QColor(63,63,63,100));//修改阴影的颜色
        dropShadowEffect->setBlurRadius(2);//改变阴影的模糊半径
        dropShadowEffect->setOffset(0);//改变阴影的偏移值
        setGraphicsEffect(dropShadowEffect);
        break;
    }
    case Qt::Key_4:{
        QGraphicsOpacityEffect *opacityEffect=new QGraphicsOpacityEffect;
        opacityEffect->setOpacity(0.4);//修改透明度
        setGraphicsEffect(opacityEffect);
        break;
    }
    case Qt::Key_5:{
        graphicsEffect()->setEnabled(false);
        break;
    }

    }
}

2.动画、碰撞检测和图形项组

2.1动画

QGraphicsItemAnimation类可以很容易地实现图形项的动画效果（该类已过时）。

创建一个继承自QObject和QCraphicsItem的自定义图形项，然后创建它自己的定时器来实现动画。QGraphicsScene::advance()来推进场景。

2.1.1代码

在myitem.h文件中的public部分添加函数声明：

void advance(int phase) override;

到myitem.cpp文件中进行该函数的定义：

void MyItem::advance(int phase)
{
    //在第一个阶段不进行处理
    if(!phase)
        return;
    //图形项向不同方向随机移动
    int value=qrand()%100;
    if(value<25){
        setRotation(45);
        moveBy(qrand()%10,qrand()%10);
    }else if(value<50){
        setRotation(-45);
        moveBy(-qrand()%10,qrand()%10);
    }else if(value<75){
        setRotation(30);
        moveBy(-qrand()%10,qrand()%10);
    }else{
        setRotation(-30);
        moveBy(qrand()%10,-qrand()%10);
    }
}

调用场景advance()函数就会自动调用场景中多有图形项的advance()函数，而且图形项的advance()函数会被分为两个阶段调用两次。

2.1.2代码：

在main.cpp文件中添加头文件 #include ，在主函数最后return语句前添加如下代码：

//创建定时器，当定时器溢出时会自动调用场景advance()函数
QTimer timer;
QObject::connect(&timer,&QTimer::timeout,&scene,&QGraphicsScene::advance);
timer.start(300);

2.2碰撞检测

图形视图框架提供了图形项之间的碰撞检测，碰撞检测可以使用两种方法来实现：

• 重新实现 QGraphicsItem::shape()函数来返回图形项准确的形状，然后使用默认的 collidesWithItem()函数通过两个图形项之间的交集来判断是否发生碰撞。如果图形项的形状很复杂，那么进行操作是非常耗时的。如果没有重新实现 shape()函数，那么它默认会调用boundingRect()函数返回一个简单的矩形。
• 重新实现 collidesWithItem()函数来提供一个自定义的图形项碰撞算法。

图形项选取模式

常量	描述
Qt::ContainsItemShape	选取只有形状完全包含在选择区域之中的图形项
Qt::InterscentsItemShape	选取形状完全包含在选择区域之中或者与区域的边界相交的图形项
Qt::ContainsItemBoundingRect	选取只有边界矩形完全包含在选择区域之中的图形项
Qt::IntersectsItemBoundingRect	选取边界矩形完全包含在选择区域之中或者与区域的边界相交的图形项

2.2.1代码

在myitem.h文件的public部分进行函数声明：

QPainterPath shape() const override;

在myitem.cpp文件中定义函数：

QPainterPath MyItem::shape() const
{
    QPainterPath path;
    path.addRect(-10,-10,20,20);
    return path;
}

2.3图形项组

QGraphicsItemGroup 图形项组为图形提供了一个容器，它可以将多个图形项组和在一起而将它本身以及所有的子图形项看作一个独立的图形项。使用setParentItem()来设置父图形项。在main()函数的return语句前添加：

    QGraphicsItemGroup *group=new QGraphicsItemGroup;
    group->addToGroup(item1);
    group->addToGroup(item2);
    group->setFlag(QGraphicsItem::ItemIsMovable);
    item2->setPos(30,0);
    scene.addItem(group);

3.打印和使用OpenGL进行渲染

3.1打印

图形视图框架提供渲染函数 QGraphicsScene::render() 和 QGraphicsView::render() 来完成打印功能。

• QGraphicsScene::render() ：用来打印没有变换的场景。
• QGraphicsView::render()：用来实现屏幕快照。

3.1.1代码

实现屏幕快照功能：

    QPixmap pixmap(400,300);
    QPainter painter(&pixmap);
    painter.setRenderHint(QPainter::Antialiasing);
    view.render(&painter);
    painter.end();
    pixmap.save("view.png");

3.2使用OpenGL进行渲染

使用OpenGL进行渲染时，可以使用QGraphicsView::setViewport()将QOpenGLWidget 作为 QGraphicsView的视口。

view.setViewport(new QOpenGLWidget());

屏幕快照图：

项目源码：https://gitee.com/zhiyubz/qt-graphical-view-framework