Qt 进阶 06｜图形视图框架 QGraphicsScene/QGraphicsView 图元与交互

一、框架三大核心组件

图形视图（Graphics View）用于2D 大型图形、流程图、组态、矢量绘图，三层结构：

1. QGraphicsScene 场景：存放所有图元，数据层，管理元素集合；
2. QGraphicsView 视图：可视化窗口，展示场景内容，支持缩放、平移；
3. QGraphicsItem 图元：最小绘制单元（矩形、文字、图片、自定义图形）。

二、基础使用流程

1. 创建场景 Scene
2. 创建各类图元 Item，添加到场景
3. 视图 View 绑定场景，显示内容

三、基础示例代码

cpp

运行

// 1. 创建场景 QGraphicsScene *scene = new QGraphicsScene(this); scene->setSceneRect(0,0,500,300); // 场景大小 // 2. 添加内置图元 scene->addRect(20,20,80,60, QPen(Qt::blue), QBrush(Qt::cyan)); // 矩形 scene->addText("Graphics View 测试"); // 文字 scene->addEllipse(150,50,60,60); // 圆形 // 3. 视图绑定场景 ui->graphicsView->setScene(scene); ui->graphicsView->setDragMode(QGraphicsView::RubberBandDrag); // 框选模式

四、图元交互（选中、拖拽）

给图元开启交互属性：

cpp

运行

QGraphicsRectItem *rectItem = scene->addRect(100,100,70,50); rectItem->setFlags(QGraphicsItem::ItemIsSelectable | QGraphicsItem::ItemIsMovable); // ItemIsSelectable：可选中 // ItemIsMovable：可拖拽移动

五、常用功能

• 视图缩放：ui->graphicsView->scale(1.2,1.2);
• 清空场景：scene->clear();
• 自定义图元：继承QGraphicsItem重写paint()和boundingRect()。

小结

Graphics View 适合海量 2D 图形、流程图、组态软件开发；区分场景坐标和视图坐标是开发重点。