qt graphics view 坐标系

qt graphics view 坐标系

参考:https://blog.youkuaiyun.com/qq_40732350/article/details/90116319

场景类:QGraphicsScene类
视图类:QGraphicsView类
图元类:QGraphicsItem类

在这里插入图片描述

1.场景坐标

场景坐标是所有图元的基础坐标系统。场景坐标系统描述了顶层的图元,每个图元都有场景坐标和相应的包容框。场景坐标的原点在场景中心,坐标原点是x轴正方向向右,y轴正方向向下。

QGraphicsScene类的坐标系以中心为原点(0,0),如图所示。

graphics view 有3个有效的坐标系

场景坐标(graphics scene)

场景坐标是所有图元的基础坐标系统。场景坐标系统描述了顶层的图元,每个图元都有场景坐标和相应的包容框。
场景坐标的原点在场景中心,坐标原点是x轴正方向向右,y轴正方向向下。

QGraphicsScene类的坐标系以中心为原点(0,0),如图所示。
在这里插入图片描述

视图坐标(graphics view)

视图坐标是窗口部件的坐标。视图坐标的单位是像素。

QGraphicsView视图的左上角是(0,0),x轴正方向向右,y轴正方向向下。
所有的鼠标事件最开始都是使用视图坐标。
QGraphicsView类继承自QWidget类,因此它与其他的QWidget类一样,以窗口的左上角作为自己坐标系的原点,如图所示。

在这里插入图片描述

图元坐标

图元使用自己的本地坐标,这个坐标系统通常以图元中心为原点,这也是所有变换的原点。图元坐标方向是x轴正方向向右,y轴正方向向下。创建图元后,只需注意图元坐标就可以了,QGraphicsScene和QGraphicsView会完成所有的变换。

QGraphicsItem类的坐标系,若在调用QGraphicsItem类的paint()函数重绘图元时,则以此坐标系为基准,如图7.4所示。
在这里插入图片描述
在这里插入图片描述
scene = new QGraphicsScene(-400, -300, 800, 600);
在这里插入图片描述
scene = new QGraphicsScene(-400, -300, 800, 600);

scene 是一张画布,一张纸,
这张纸的左上角的坐标,在scene坐标系中,定义为-400,-300,
这张纸的长宽为800,600
这样 就能确定 scene场景的坐标系的 原点位置。

测试程序

#include "tstwidget.h"
#include "ui_tstwidget.h"
#include <QLayout>
#include <QDebug>


TstWidget::TstWidget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::TstWidget)
{
    ui->setupUi(this);

    _graphicsSence = new QGraphicsScene(this);
    _graphicsView = new QGraphicsView(this);

    _graphicsView->setAlignment(Qt::AlignCenter);
    //_graphicsView->setAlignment(Qt::AlignLeft|Qt::AlignTop);
    _graphicsView->setScene(_graphicsSence);

    QHBoxLayout *_topLayout = new QHBoxLayout;
    _topLayout->addWidget(_graphicsView);
    this->setLayout(_topLayout);

    initGraphicsView();

    this->resize(500,500);
}

void TstWidget::initGraphicsView()
{
    QPen pen;
    pen.setColor(QColor(255, 0, 0));
    pen.setWidth(2);
    //_graphicsSence->setSceneRect(-100,-100,100,100);
    //_graphicsSence->addRect(-100,-100,100,100);
    qDebug()<< _graphicsSence->sceneRect() <<endl;
    //_graphicsView->setAlignment(Qt::AlignLeft | Qt::AlignTop);
    _graphicsSence->addRect(0, 0, 100, 100, pen);

//    _graphicsSence->addRect(50, 50, 50, 50);
//    _graphicsSence->addRect(0, 0, 50, 50);

//    _graphicsSence->addRect(-100,-50,200,100);
    _graphicsSence->addLine(0,0,200,200);

}

TstWidget::~TstWidget()
{
    delete ui;
}

.h头文件

#ifndef TSTWIDGET_H
#define TSTWIDGET_H

#include <QWidget>
#include <QGraphicsItem>
#include <QGraphicsView>
#include <QLayout>

namespace Ui {
class TstWidget;
}

class TstWidget : public QWidget
{
    Q_OBJECT

public:
    explicit TstWidget(QWidget *parent = nullptr);
    ~TstWidget();

private:
    Ui::TstWidget *ui;

    QGraphicsScene* _graphicsSence;
    QGraphicsView* _graphicsView;
    QHBoxLayout *_topLayout;
    void initGraphicsView();
};

#endif // TSTWIDGET_H


scene 的坐标原点与view的坐标原点之间的关系

如果设置为
_graphicsView->setAlignment(Qt::AlignLeft | Qt::AlignTop);
没有下面这句话
_graphicsSence->setSceneRect(-100,-100,100,100)

那么scene 的坐标原点与view的坐标原点重合

如果有那句话,
那么view的坐标原点是 scene 的(-100,-100)

如果设置为_graphicsView->setAlignment(Qt::AlignCenter)
会尽量将scene中的item作为一个组合整体。
然后找到这个组合整体的重心,放在view窗体的中心。
scene的原点,相对偏移。

### 如何在 Qt5 中使用 `graphicsView` 绘制极坐标图 #### 创建极坐标图表实例 为了创建极坐标图表,首先需要引入必要的头文件,并初始化一个 `QPolarChart` 实例。这可以通过包含 `<QtCharts/QPolarChart>` 和其他必需的模块来完成。 ```cpp #include <QtWidgets> #include <QtCharts/QPolarChart> #include <QtCharts/QLineSeries> int main(int argc, char *argv[]) { QApplication a(argc, argv); QWidget window; QVBoxLayout *layout = new QVBoxLayout(&window); // 构建极坐标图表对象 QtCharts::QPolarChart *chart = new QtCharts::QPolarChart(); ``` #### 添加数据系列至图表 接下来定义要展示的数据序列,并将其添加到之前创建的极坐标图表中。这里以折线为例说明: ```cpp // 定义一条新的折线序列 QtCharts::QLineSeries *series0 = new QtCharts::QLineSeries(); // 向该序列中加入一些测试点 series0->append(1, 8); // (角度, 半径) series0->append(2, 2); series0->append(3, 3); series0->append(7, 4); series0->append(10, 6); chart->addSeries(series0); ``` #### 设置图形视图属性 为了让图表能够正确显示出来,还需要配置关联的 `QGraphicsView` 控件的相关参数,例如调整大小策略以及设定背景颜色等。 ```cpp // 将图表设置给图形视图控件 QGraphicsView *view = new QGraphicsView(chart); view->setRenderHint(QPainter::Antialiasing); layout->addWidget(view); window.setLayout(layout); window.resize(800, 600); window.show(); ``` #### 显示窗口并运行应用程序 最后一步就是准备好整个应用环境之后调用 `exec()` 函数启动消息循环等待用户交互操作直到程序结束为止。 ```cpp return a.exec(); } ``` 上述代码片段展示了如何利用 QtGraphics View Framework 结合 QPolarChart 类型构建一个基本的极坐标图表[^4]。需要注意的是,在实际项目里可能还会涉及到更多细节上的优化工作,比如自定义样式表、处理鼠标键盘事件等等。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值