Qt Widgetsにおける2Dグラフィックス変換: QGraphicsScale, QTransform, QGraphicsItem::setScaleを比較解説


QGraphicsScaleクラスは、2Dグラフィックスアイテムを水平方向に拡大縮小するための機能を提供します。xScaleプロパティは、この水平方向の拡大縮小係数を制御します。

使用方法

xScaleプロパティに値を設定することで、アイテムの幅が設定した倍率で拡大縮小されます。

QGraphicsScale scale;
scale.setXScale(2.0); // アイテムの幅を2倍に拡大

負の値を設定すると、アイテムが水平方向に反転されます。

scale.setXScale(-1.0); // アイテムを水平方向に反転

デフォルト値

xScaleプロパティのデフォルト値は1.0です。つまり、アイテムは元の幅のまま表示されます。

関連プロパティ

  • origin: 拡大縮小の中心点を設定します。
  • yScale: 垂直方向の拡大縮小係数を制御します。

シグナル

xScaleChangedシグナルは、xScaleプロパティの値が変更されたときに発行されます。

connect(&scale, &QGraphicsScale::xScaleChanged, this, &MyClass::onXScaleChanged);

次の例では、QGraphicsScaleを使用して、矩形アイテムを水平方向に2倍に拡大し、反転します。

#include <QApplication>
#include <QGraphicsScene>
#include <QGraphicsView>
#include <QGraphicsRectItem>
#include <QGraphicsScale>

int main(int argc, char *argv[]) {
  QApplication app(argc, argv);

  // シーンを作成
  QGraphicsScene scene;

  // 矩形アイテムを作成
  QGraphicsRectItem *rectItem = new QGraphicsRectItem(0, 0, 100, 50);
  scene.addItem(rectItem);

  // スケールを作成
  QGraphicsScale scale;
  scale.setXScale(2.0); // アイテムを水平方向に2倍に拡大
  scale.setOrigin(rectItem->boundingRect().center()); // 拡大縮小の中心をアイテムの中心にする
  rectItem->setTransform(scale); // アイテムにスケールを適用

  // ビューを作成
  QGraphicsView view(&scene);
  view.show();

  return app.exec();
}
  • QGraphicsItemクラスのsetScaleメソッドを使用して、アイテムを拡大縮小することもできます。
  • QGraphicsScaleは、QGraphicsTransformクラスを使用して実装されています。


矩形アイテムを水平方向に2倍に拡大し、反転する

#include <QApplication>
#include <QGraphicsScene>
#include <QGraphicsView>
#include <QGraphicsRectItem>
#include <QGraphicsScale>

int main(int argc, char *argv[]) {
  QApplication app(argc, argv);

  // シーンを作成
  QGraphicsScene scene;

  // 矩形アイテムを作成
  QGraphicsRectItem *rectItem = new QGraphicsRectItem(0, 0, 100, 50);
  scene.addItem(rectItem);

  // スケールを作成
  QGraphicsScale scale;
  scale.setXScale(2.0); // アイテムを水平方向に2倍に拡大
  scale.setOrigin(rectItem->boundingRect().center()); // 拡大縮小の中心をアイテムの中心にする
  rectItem->setTransform(scale); // アイテムにスケールを適用

  // ビューを作成
  QGraphicsView view(&scene);
  view.show();

  return app.exec();
}

マウスホイールでアイテムを拡大縮小する

#include <QApplication>
#include <QGraphicsScene>
#include <QGraphicsView>
#include <QGraphicsRectItem>
#include <QGraphicsScale>

int main(int argc, char *argv[]) {
  QApplication app(argc, argv);

  // シーンを作成
  QGraphicsScene scene;

  // 矩形アイテムを作成
  QGraphicsRectItem *rectItem = new QGraphicsRectItem(0, 0, 100, 50);
  scene.addItem(rectItem);

  // スケールを作成
  QGraphicsScale scale;
  rectItem->setTransform(scale); // アイテムにスケールを適用

  // ビューを作成
  QGraphicsView view(&scene);
  view.setMouseTracking(true); // マウス追跡を有効にする

  // マウスホイールイベントのハンドラを設定
  QObject::connect(&view, &QGraphicsView::wheelEvent, &view, &QGraphicsView::wheelEvent);

  view.show();

  return app.exec();
}

void QGraphicsView::wheelEvent(QWheelEvent *event) {
  // スケールを取得
  QGraphicsScale *scale = static_cast<QGraphicsScale *>(itemAt(event->pos())->transform());

  // 現在の拡大縮小係数を取得
  qreal currentScale = scale->xScale();

  // マウスホイールの回転方向に応じて拡大縮小係数を調整
  if (event->delta() > 0) {
    currentScale *= 1.1;
  } else {
    currentScale *= 0.9;
  }

  // 拡大縮小係数を設定
  scale->setXScale(currentScale);
}

このコードは、マウスホイールを使ってアイテムを拡大縮小します。

#include <QApplication>
#include <QGraphicsScene>
#include <QGraphicsView>
#include <QGraphicsRectItem>
#include <QGraphicsScale>
#include <QGestureEvent>

int main(int argc, char *argv[]) {
  QApplication app(argc, argv);

  // シーンを作成
  QGraphicsScene scene;

  // 矩形アイテムを作成
  QGraphicsRectItem *rectItem = new QGraphicsRectItem(0, 0, 100, 50);
  scene.addItem(rectItem);

  // スケールを作成
  QGraphicsScale scale;
  rectItem->setTransform(scale); // アイテムにスケールを適用

  // ビューを作成
  QGraphicsView view(&scene);
  view.setGestureHandling(QGraphicsView::AllGestures); // すべてのジェスチャーを有効にする

  // ピンチジェスチャーイベントのハンドラを設定
  QObject::connect(&view, &QGraphicsView::gestureEvent, &view, &QGraphicsView::gestureEvent);

  view.show();

  return app.exec();
}

void QGraphicsView::gestureEvent(QGestureEvent *event) {
  // ピンチジェスチャーかどうかを確認
  if (QGesture *pinchGesture = QPinchGesture(event)) {
    // スケールを取得


QGraphicsScale以外にも、アイテムを水平方向に拡大縮小する方法はいくつかあります。

方法

  1. QTransformクラスを使用する

QTransformクラスは、2Dグラフィックス変換を表現するために使用できます。QGraphicsItemクラスのsetTransformメソッドを使用して、アイテムにQTransformオブジェクトを設定することで、アイテムを拡大縮小することができます。

QTransform transform;
transform.scale(2.0, 1.0); // アイテムを水平方向に2倍に拡大
rectItem->setTransform(transform);
  1. QGraphicsItem::setScaleメソッドを使用する

QGraphicsItemクラスのsetScaleメソッドは、アイテムの水平方向と垂直方向の拡大縮小係数を同時に設定します。

rectItem->setScale(2.0, 1.0); // アイテムを水平方向に2倍に拡大
  1. アニメーションを使用する

QPropertyAnimationクラスを使用して、xScaleプロパティをアニメーション化することで、アイテムを滑らかに拡大縮小することができます。

QPropertyAnimation *animation = new QPropertyAnimation(rectItem, "xScale");
animation->setDuration(500); // アニメーションの時間を500ミリ秒に設定
animation->setStartValue(1.0); // 開始値を1.0に設定
animation->setEndValue(2.0); // 終了値を2.0に設定
animation->start();

利点と欠点

  • アニメーション
    • 利点: 滑らかな拡大縮小を実現できる。
    • 欠点: コード量が多くなる。
  • QGraphicsItem::setScaleメソッド
    • 利点: シンプルで使いやすい。
    • 欠点: 垂直方向の拡大縮小係数も同時に設定する必要がある。
  • QTransformクラス
    • 利点: 非常に柔軟性が高く、さまざまな種類の変換を適用できる。
    • 欠点: QGraphicsScaleクラスよりも複雑で、コード量が多くなる。
  • QGraphicsScaleクラス
    • 利点: 使いやすく、直感的なAPIを提供している。
    • 欠点: 他の方法に比べて柔軟性に欠ける。

選択

どの方法を選択するかは、要件によって異なります。シンプルで使いやすい方法が必要であれば、QGraphicsScaleクラスまたはQGraphicsItem::setScaleメソッドを使用します。より柔軟性が必要であれば、QTransformクラスを使用します。滑らかな拡大縮小が必要であれば、アニメーションを使用します。