Qt （高仿Visio）流程图组件开发（二） 基本图元绘制 图元间连线绘制

---

本系列目录

Qt （高仿Visio）流程图组件开发（一） 效果展示及基本开发框架构思
Qt （高仿Visio）流程图组件开发（二） 基本图元绘制 图元间连线绘制
Qt （高仿Visio）流程图组件开发（三） 图元基类如何定义，流程图多种图元类型实现
Qt （高仿Visio）流程图组件开发（四） 流程图 图元对齐 磁吸线功能
Qt （高仿Visio）流程图组件开发（五） 流程图 双击编辑图元内容实现
Qt （高仿Visio）流程图组件开发（六） 流程图 线图元 如何绘制曲线 连接线移除视口后无法显示
Qt （高仿Visio）流程图组件开发（七） 流程图 简单操作界面搭建
Qt （高仿Visio）流程图组件开发（八） 流程图 鼠标拖动图元到场景（QGraphicsScene）创建
Qt （高仿Visio）流程图组件开发（九） 流程图 代码展示

---

前言

  本文主要讲解简单的实现，如何绘制图元，图元之间如何连线，拖动图元线跟随图元动，线的位置判断等等。只是经验分享，描述内容并不绝对，如有误差欢迎指正。

---

一、如何绘制图元

  所有的图元都可以看作“放置在”场景（QGraphicsScene）上，调用接口addItem(QGraphicsItem *item)，即可在场景添加一个图元。

	QGraphicsView* m_view = new QGraphicsView(this);
	QGraphicsScene* m_scene = m_view->scene();
	QGraphicsRectItem* rect_item = new QGraphicsRectItem();
	m_scene->addItem(rect_item);

  但是这只适用于简单的图元绘制，并不能满足我们绘制特殊图元的需求，例如样式，选中态，文本显示等等，所以我们需要通过重写图元类来绘制特殊图元。这里以流程图中的“流程”图元为例就行讲解。下面两个虚函数是我认为重写一个图元类比较主要的部分。

	public:

	virtual QRectF boundingRect() const;

	virtual void paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget = Q_NULLPTR);

   boundingRect() 函数主要用来确定绘制图元的形状生效范围，这个会影响到之后的选中功能。
   paint()函数主要来绘制图元的形状、内容、交互状态，但是只涉及其本身的绘制，与其他图元无关。
   图元类只关注自身相关的操作，对与全局的一些操作，例如：菜单、移动、选中、删除等等并不在该类下处理。“流程”图元实现如下：

QRectF FlowchartGraphicsRectItem::boundingRect() const
{
   
   
	QRectF rect = QGraphicsRectItem::boundingRect().adjusted(-3, -3, 3, 3);
	return rect;
}

void FlowchartGraphicsRectItem::paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget /*= Q_NULLPTR*/)
{
   
   
	painter->setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing);

	painter->save();
	painter->setPen(item_infor_->item_style_.pen_);
	painter->setBrush(item_infor_->item_style_.brush_);
	painter->drawRect(this->boundingRect());
	painter