Design a custom dial

rapid84

Hi,
I want to customize a dial in qt and i need a reference example. I need to customize its shape like that:

http://dronecolony.com/2012/12/11/customized-qdial-with-qss-support/

mrjj

Hi
What is wrong with the sample you found?
Its seems to be complete custom widget.

rapid84

i just need to change the image of dial. I think this widget has lots of properties that i dont need.

mrjj

@rapid84
I dont think that the QDial uses style sheet so you cant change the
image without sub classing it and creating your own paint.
(as sample does)

rapid84

@mrjj

I have imported the "skinneddial.h" and "skinneddial.cpp" to my project but i am having trouble with how to use them to create a custom dial.

mrjj

@rapid84
you must new a version and place it on the main window.

#include "skinneddial.h"
SkinnedDial* myDial = new SkinnedDial();

you will also need to provide 2 images
dial-back.png
dial-needle.png
via a stylesheet.
SkinnedDial {
qproperty-backgroundImage: url(:dial-back.png);
qproperty-needleImage: url(:dial-needle.png);
qproperty-maxAngle: 140;
}
Note these images must be placed in a resource file
http://www.bogotobogo.com/Qt/Qt5_Resource_Files.php
( too see how to add one)

rapid84

@mrjj
I have 2 questions about it:

how can we set the maximum value to 100 ( now it can be set up to 99)
if the needle released on outside area of the dial ( somewhere outside needle), the value pointer goes to min level but it does not send any value.

mrjj

@rapid84
Hi it seems not to cap at 100? so not not sure why you cannot set it
myDial->setMaximum(100);
myDial->setMinimum(-100);
" The SkinnedDial class makes an assumption that the center of the dial is at the value of 0, and
that negative values are on the left side of the dial, and the positive values are on the right
side. SkinnedDial requires that the minimum be < 0 and the maximum be > 0 and that there be
an equivalent distance on both side of the dial. "

the needle released on outside area of the dial ..
Seems to be a bug. its mentioned in comments and there is a new Paintevent
function that should not reset when release outside.
http://dronecolony.com/2012/12/11/customized-qdial-with-qss-support/

rapid84

@mrjj

i have tried his edited function -> "void SkinnedDial::paintEvent(QPaintEvent *pe)" but it has errors. his original .h and .cpp files can not be downloaded. Maybe i will need another source file for custumizing dial.

mrjj

@rapid84
well if errors are not fixable then maybe you need other.
The basic idea is the same, creating a new paint function.

rapid84

@mrjj

Someone mentioned about commenting the line

if( curVal != m_cacheVal || cacheHit == false )

But the author said that "it will re-render that image and re-size it 30 times per second, which may consume more CPU than you’d like ". He then did qdebug and said that it works only once. I did qdebug too and it really works only once . Is this right measurement?

mrjj

Yes. it sounds fine. If you checked yourself with qDebug and it seems ok , then just try use it.
Also, you should pretty fast notice if it burns cpu :)

rapid84

@mrjj

I didn't noticed any diffrence with qDebug and i have measured cpu temperature with a thermocouple, it is temperature is always same ( about 40 centigrade). So i will use it .

The maximum value can be set with stylesheet like this:

qproperty-maximum:100

By the way i have save and read its value to a file. While writing it store its maximum value "100"( i have checked from txt file) but while reading it read it as "99" ?? . writing and reading functions are below:

writing function:

    QString filename = "data.txt";
    QFile file(filename);
    file.open(QIODevice::WriteOnly|QIODevice::Text);
    QTextStream out(&file);   
    QString s = QString::number(ui->widget->value());
    out<<s<<endl;   
    file.close();

reading function:

    QString filename1 = "data.txt";
    QFile file1(filename1);
    file1.open(QIODevice::ReadOnly|QIODevice::Text);
    QTextStream in(&file1);
    QString str1 = in.readLine();        
    ui->widget->setValue(str1.toInt());
    file1.close();

jsulm

@rapid84 You should not measure CPU temperature you should measure CPU load. For example using the "top" command on Linux or "Task Manager" on Windows.

rapid84

@jsulm

I have used top cmd and cpu loads shows always the same value in each case. so there is no difference.