零基础开始QT绘图（6）

阿里云国内75折回扣微信号：monov8

阿里云国际，腾讯云国际，低至75折。AWS 93折免费开户实名账号代冲值优惠多多微信号：monov8 飞机：@monov6

前面我们开始提到了GraphicView的使用也提到GraphicsItem的使用并且开始了自定义GraphicsItem的编写而且上次我们的GraphicsItem也是可以拖动了但这离我们需要的效果还有一定的距离。
所以这次我们进一步优化它主要在这两个方面

1、选择样式

我们想在鼠标选择的时候不显示那个虚线框而是我们自定义的其他样式比如点选的时候带黄色蒙版的样式。如下图效果
在这里插入图片描述
很明显我们可以看到自定义的myitem选中后的样式已经明显与众不同了。如何做到呢?上代码

void buttonGraphicsItem::paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget)  {
  Q_UNUSED(widget)
    QStyleOptionGraphicsItem op;

 painter->setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing|QPainter::SmoothPixmapTransform);
    QRectF recf=boundingRect();
    QRectF board=QRectF(0,-2,120,40);
    QPen pen(Qt::red);
    QColor clr=QColor(Qt::blue);
    clr.setAlpha(20);
    QBrush brush(clr);
    painter->setPen(pen);
    painter->setBrush(brush);
    painter->drawRoundedRect(board,10,10);

    painter->setPen(QPen(Qt::black));
    if(!m_title.isEmpty())
        painter->drawText(QPointF(board.center().rx()-16,board.center().ry()+4),m_title);

    // 选中时绘制
    if (option->state & QStyle::State_Selected) {
       qreal itemPenWidth = pen.widthF();
       const qreal pad = itemPenWidth / 2;
       
       // 绘制实线
       painter->setPen(Qt::NoPen);//QPen(color, penWidth, Qt::SolidLine)
       painter->setBrush(Qt::NoBrush);
       painter->drawRect(recf.adjusted(pad, pad, -pad, -pad));

       //绘制透明遮盖层
        QColor clor=QColor(Qt::yellow);
        clor.setAlpha(25);
        QBrush brusher(clor);
        painter->setBrush(brusher);
        painter->drawRect(recf.adjusted(pad, pad, -pad, -pad));
           }
   }

其实只需要在我们已经定义好的graphicsitems中重写paint。在里面按照boundingRect的大小来绘制一个透明度小于100的rect即可。
这里要注意item的正常显示的图形是比boundingRect要小这个量是要预留出来的。我这里的board就是比boundingRect内缩了20个单位的item绘图区域。

2、文字输入

我们如果想让我们的items都有文字输入功能怎么办呢?在上面的代码中我们已经看到了绘制文字的语句关键是如何接受到外面来的文字

 painter->setPen(QPen(Qt::black));
    if(!m_title.isEmpty())
        painter->drawText(QPointF(board.center().rx()-16,board.center().ry()+4),m_title);

我的思路是这样的也许你们会有更好的思路首先实现item的mouseclick 通过doubleclick双击后捕获它弹出对话框修改它。当然你也可以将文字修改问graphicsTextitems通过焦点捕获来实现看起来更直观这个在后面的博文中会有这种实现方式我们来看看效果
在这里插入图片描述
关键代码重写双击函数

void  buttonGraphicsItem::mouseDoubleClickEvent(QGraphicsSceneMouseEvent *event){

    bool ok;
    QString strlabel=QInputDialog::getText(nullptr,"input label","please input the label text:",QLineEdit::Normal,"myItem",&ok);
    if (ok && !strlabel.isEmpty())
         m_title =strlabel;

     QGraphicsItem::mouseDoubleClickEvent(event);
}