Qt之GraphicsView框架

一、什么是GraphicsView框架。

这里介绍比较详细：https://www.oschina.net/question/234345_48825

http://blog.51cto.com/9291927/1879128

二、QWidget框架、GraphicsView框架、QML（QtQuick）框架之间的区别

这里介绍比较详细：

1、https://blog.csdn.net/nrc_douningbo/article/details/5571149

2、https://www.cnblogs.com/findumars/p/4689751.html

二、如何在GraphicsView框架下进行编程

1、从上面的介绍中可以知道，有2个选择：

1）先基于QWidget完成界面绘制，然后将其添加到GraphicsView框架下进行管理。

2）基于GraphicsView框架下的图元类来开发界面。

2、基于QWidget的。

1）要将QWidget加入到GraphicsView框架下并管理这个QWidget，需要一个代理控件类QGraphicsProxyWidget。

2）还需要介绍一个QGraphicsItem类。它是QGraphicsScene中所有图形项的基类。它可以定义项目的几何形状、碰撞检测、绘制实现以及接收事件并处理。

MainWindow::MainWindow(QWidget *parent)
    : QGraphicsView(parent)
{
    QGraphicsScene *scenen = new QGraphicsScene;
    QGraphicsProxyWidget *proxy = nullptr;
    //初始化布局
    QWidget *widget = initQWidget();
    //有两种方式添加
    //1、通过代理
//    proxy = new QGraphicsProxyWidget;
//    proxy->setWidget(widget);
//    scenen->addItem(proxy);
    //2、通过场景
    proxy = scenen->addWidget(widget);

    setScene(scenen);

    //以下可以通过代理对我们添加的控件进行各种操作主要是QGraphicsItem的带的各种属性
    proxy->setOpacity(0.3);//设置不透明度
    proxy->setPos(50,50);
    proxy->setRotation(-20);
}

MainWindow::~MainWindow()
{

}

QWidget *MainWindow::initQWidget()
{
    QWidget *widget = new QWidget;

    QFormLayout *formLayout = new QFormLayout;
    formLayout->addRow("用户名:",new QLineEdit);
    formLayout->addRow("密码:",new QLineEdit);

    QCheckBox *box = new QCheckBox("记住密码");
    box->setCheckable(true);
    box->setChecked(true);

    QPushButton *login = new QPushButton("登录");
    QPushButton *cancel = new QPushButton("取消");
    QHBoxLayout *buttonLayout = new QHBoxLayout;
    buttonLayout->addWidget(login);
    buttonLayout->addWidget(cancel);

    QVBoxLayout *mainLayout = new QVBoxLayout;
    mainLayout->addLayout(formLayout);
    mainLayout->addWidget(box);
    mainLayout->addLayout(buttonLayout);

    widget->setLayout(mainLayout);
    return widget;
}

3、基于GraphicsView的自带图元。

1）主要用到QGraphicsItem类及其子类：

QGraphicsEllipseItem 椭圆图元

QGraphicsLineItem 直线图元

QGraphicsPathItem 路径图元

QGraphicsPixmapItem 图像图元

QGraphicsPolygonItem 多边形图元

QGraphicsRectItem 矩形图元

QGraphicsSimpleTextItem 简单文本图元

QGraphicsTextItem 文本浏览图元

用户可以继承QGraphicsItem实现自定义的图元。

QGraphicsItem图元主要特性如下：（如果要实现下面的效果，继承该图元然后实现相关的事件函数即可）

A、支持鼠标按下、移动、释放、双击、悬停、滚动和右键菜单事件。

B、支持键盘输入焦点和按键事件

C、支持拖拽事件

D、支持分组，使用父子关系和QGraphicsItemGroup

E、支持碰撞检测

MainWindow::MainWindow(QWidget *parent)
    : QGraphicsView(parent)
{
    QGraphicsScene *scene = new QGraphicsScene;
    //椭圆
    QGraphicsEllipseItem *ellipseItem = new QGraphicsEllipseItem(0,0,100.0,50.0);
    scene->addItem(ellipseItem);
//    //直线
    QGraphicsLineItem *lineItem = new QGraphicsLineItem(QLineF(QPointF(10.0,10.0),QPointF(100.0,100.0)));
    QPen pen = lineItem->pen();
    pen.setColor(Qt::red);
    pen.setWidthF(10.0);
    lineItem->setPen(pen);
    scene->addItem(lineItem);
    //路径
    QGraphicsPathItem *pathItem = new QGraphicsPathItem;
    QPainterPath path;
    path.addRect(20, 20, 60, 60);
    path.moveTo(0, 0);
    path.cubicTo(99, 0,  50, 50,  99, 99);
    path.cubicTo(0, 99,  50, 50,  0, 0);
    pathItem->setPath(path);
    scene->addItem(pathItem);
    //图片
    QPixmap pixmap(30,30);
    pixmap.fill(Qt::blue);
    QGraphicsPixmapItem *pixmapItem = new QGraphicsPixmapItem(pixmap);
    scene->addItem(pixmapItem);

    //......等等图元

    setScene(scene);
}

Qt之GraphicsView框架

猜你喜欢