написание виджета датчика с использованием 2 изображений в qt

Я пишу виджет датчика, используя QT, который состоит из двух отдельных изображений, одно как фон, а другое как игла. Я переопределяю функцию paintEvent следующим образом:

void myGaugeWidget::paintEvent(QPaintEvent *pe)
{
    QPainter painter(this);
    QPixmap bkgImage(bkgImgPath);
    painter.drawPixmap(0, 0, width(), height(), bkgImage);

    const double thetaDeg = 30.0;
    QPixmap needle(needles[i].imgPath);
    int needleWidth = 200;
    int needleHeight = 200;

    int anchorX = 20;
    int anchorY = 30;
    const int centerX = width()/2;
    const int centerY = height()/2;

    QTransform rm =  QTransform().translate(-anchorX,- anchorY).rotate(thetaDeg).translate(centerX,centerY);
    needle = needle.transformed(rm);
    painter.drawPixmap(0,0, needle);
}

этот код правильно вращает мою иглу, но ее положение неверно. Кто-нибудь может мне помочь? Спасибо.


qt paintevent
person A.Ajorian    schedule 08.03.2018    source источник
comment
Вы можете предоставить 2 изображения, чтобы увидеть, в чем проблема, а также показать изображение возникшей проблемы.   -  person eyllanesc    schedule 08.03.2018

Ответы (1)


arrow_upward
1
arrow_downward

Скорее всего, это будет зависеть от ваших изображений и размера виджета. Я попробовал ваш код, и мне кажется, что QTransform().translate() ничего не делает в QPixmap. Пробовал давать крайние значения для translate() и убрал rotate() - изображение не двигается.

У меня уже есть собственная реализация для датчика. Это с преобразованием художника вместо изображения. Мои изображения имеют размеры:

Фон датчика: 252x252 (имеются некоторые внешние эффекты размытия вокруг границ круга, что делает фоновое изображение больше, чем кажется)

Игла: 7x72 (размеры изображения охватывают границы самой иглы)

Центр вращения иглы (относительно фона): 126, 126 (размер фона разделить на 2)

Изображение иглы направлено вверх

Для этой установки вот мой paintEvent() с некоторыми пояснениями:

void myGaugeWidget::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing);
    
    //draw the background which is same size as the widget. 
    painter.drawPixmap(0, 0, bg.width(), bg.height(), bg);
    
    //Calculate the angle of rotation. 
    //The gauge I am using has a cutout angle of 120 degrees at the bottom (symmetric)
    float needleAngle = -120/*offset for start rotation*/ + ((value-minValue)*240/*total sweep of the gauge*//(maxValue-minValue));
    painter.save();

    //translate the painter to the roation center and then perform the rotation
    painter.translate(126, 126);
    painter.rotate(needleAngle);

    //translate the rotated canvas to adjust for the height of the needle. 
    //If you don't do this, your needle's tip will be at the rotation center
    painter.translate(0, -72);

    //draw the needle and adjust for the width with the x value
    painter.drawPixmap(-needle.width()/2, 0, needle.width(), needle.height(), needle);
    painter.restore();
}
person Aditya    schedule 08.03.2018