Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. Design a custom dial
Forum Updated to NodeBB v4.3 + New Features

Design a custom dial

Scheduled Pinned Locked Moved Unsolved General and Desktop
15 Posts 3 Posters 8.3k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • R Offline
    R Offline
    rapid84
    wrote on last edited by
    #1

    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/

    1 Reply Last reply
    0
    • mrjjM Offline
      mrjjM Offline
      mrjj
      Lifetime Qt Champion
      wrote on last edited by
      #2

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

      1 Reply Last reply
      0
      • R Offline
        R Offline
        rapid84
        wrote on last edited by
        #3

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

        mrjjM 1 Reply Last reply
        0
        • R rapid84

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

          mrjjM Offline
          mrjjM Offline
          mrjj
          Lifetime Qt Champion
          wrote on last edited by
          #4

          @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)

          1 Reply Last reply
          0
          • R Offline
            R Offline
            rapid84
            wrote on last edited by
            #5

            @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.

            mrjjM 1 Reply Last reply
            0
            • R 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.

              mrjjM Offline
              mrjjM Offline
              mrjj
              Lifetime Qt Champion
              wrote on last edited by mrjj
              #6

              @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)

              R 1 Reply Last reply
              0
              • mrjjM 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)

                R Offline
                R Offline
                rapid84
                wrote on last edited by
                #7

                @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.

                mrjjM 1 Reply Last reply
                0
                • R 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.

                  mrjjM Offline
                  mrjjM Offline
                  mrjj
                  Lifetime Qt Champion
                  wrote on last edited by
                  #8

                  @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/
                  R 1 Reply Last reply
                  0
                  • mrjjM 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/
                    R Offline
                    R Offline
                    rapid84
                    wrote on last edited by
                    #9

                    @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.

                    mrjjM 1 Reply Last reply
                    0
                    • R 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.

                      mrjjM Offline
                      mrjjM Offline
                      mrjj
                      Lifetime Qt Champion
                      wrote on last edited by
                      #10

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

                      R 1 Reply Last reply
                      0
                      • mrjjM mrjj

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

                        R Offline
                        R Offline
                        rapid84
                        wrote on last edited by rapid84
                        #11

                        @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?

                        1 Reply Last reply
                        0
                        • mrjjM Offline
                          mrjjM Offline
                          mrjj
                          Lifetime Qt Champion
                          wrote on last edited by
                          #12

                          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 :)

                          R 1 Reply Last reply
                          0
                          • mrjjM 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 :)

                            R Offline
                            R Offline
                            rapid84
                            wrote on last edited by rapid84
                            #13

                            @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();
                            
                            jsulmJ 1 Reply Last reply
                            2
                            • R 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();
                              
                              jsulmJ Offline
                              jsulmJ Offline
                              jsulm
                              Lifetime Qt Champion
                              wrote on last edited by
                              #14

                              @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.

                              https://forum.qt.io/topic/113070/qt-code-of-conduct

                              R 1 Reply Last reply
                              0
                              • jsulmJ 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.

                                R Offline
                                R Offline
                                rapid84
                                wrote on last edited by
                                #15

                                @jsulm

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

                                1 Reply Last reply
                                0

                                • Login

                                • Login or register to search.
                                • First post
                                  Last post
                                0
                                • Categories
                                • Recent
                                • Tags
                                • Popular
                                • Users
                                • Groups
                                • Search
                                • Get Qt Extensions
                                • Unsolved