Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. [SOLVED] QML Dial draw circle
Forum Updated to NodeBB v4.3 + New Features

[SOLVED] QML Dial draw circle

Scheduled Pinned Locked Moved QML and Qt Quick
10 Posts 2 Posters 5.2k Views
  • 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.
  • B Offline
    B Offline
    BlackMamba
    wrote on 21 Nov 2016, 01:46 last edited by BlackMamba
    #1

    Hello,
    I want to subclass the QML class Dial like explained here :
    http://doc.qt.io/qt-5/qtquickcontrols2-customize.html#customizing-dial

    Unfortunately, they don't show how to rewrite the method to draw the arc between the Minimum value and the current value like that :
    alt text

    Any idea?
    THanks

    R 1 Reply Last reply 21 Nov 2016, 09:33
    0
    • B BlackMamba
      21 Nov 2016, 01:46

      Hello,
      I want to subclass the QML class Dial like explained here :
      http://doc.qt.io/qt-5/qtquickcontrols2-customize.html#customizing-dial

      Unfortunately, they don't show how to rewrite the method to draw the arc between the Minimum value and the current value like that :
      alt text

      Any idea?
      THanks

      R Offline
      R Offline
      Roumed
      wrote on 21 Nov 2016, 09:33 last edited by
      #2

      @BlackMamba

      Attached image is not found at this moment.

      1 Reply Last reply
      0
      • B Offline
        B Offline
        BlackMamba
        wrote on 21 Nov 2016, 09:52 last edited by
        #3

        @Roumed
        Thanks, didn't see that. I reuploaded the screenshot.

        R 1 Reply Last reply 21 Nov 2016, 10:01
        0
        • B BlackMamba
          21 Nov 2016, 09:52

          @Roumed
          Thanks, didn't see that. I reuploaded the screenshot.

          R Offline
          R Offline
          Roumed
          wrote on 21 Nov 2016, 10:01 last edited by Roumed
          #4

          @BlackMamba
          I think, the best solution is to use a Canvas and draw your arc with it.
          Bad solution is to use Rectangle inside some Item('s) that clip that form of the sector you need and one more Rectangle above to make a ring.

          B 1 Reply Last reply 21 Nov 2016, 15:28
          0
          • R Roumed
            21 Nov 2016, 10:01

            @BlackMamba
            I think, the best solution is to use a Canvas and draw your arc with it.
            Bad solution is to use Rectangle inside some Item('s) that clip that form of the sector you need and one more Rectangle above to make a ring.

            B Offline
            B Offline
            BlackMamba
            wrote on 21 Nov 2016, 15:28 last edited by
            #5

            @Roumed Thank you for your answer. Could you please provide a little more details of the methods to use for the Canvas?

            R 1 Reply Last reply 21 Nov 2016, 16:58
            0
            • B BlackMamba
              21 Nov 2016, 15:28

              @Roumed Thank you for your answer. Could you please provide a little more details of the methods to use for the Canvas?

              R Offline
              R Offline
              Roumed
              wrote on 21 Nov 2016, 16:58 last edited by
              #6

              @BlackMamba I can give a similar thing.
              You can look at PieMenu.
              It's background is a half of circle. So it's implementation contains drawing at canvas.
              See here: qt/qtquickcontrols/src/extras/Styles/Flat/PieMenuStyle.qml

              B 1 Reply Last reply 21 Nov 2016, 17:39
              0
              • R Roumed
                21 Nov 2016, 16:58

                @BlackMamba I can give a similar thing.
                You can look at PieMenu.
                It's background is a half of circle. So it's implementation contains drawing at canvas.
                See here: qt/qtquickcontrols/src/extras/Styles/Flat/PieMenuStyle.qml

                B Offline
                B Offline
                BlackMamba
                wrote on 21 Nov 2016, 17:39 last edited by
                #7

                @Roumed Thanks so much, I will have a look tonight !

                1 Reply Last reply
                0
                • B Offline
                  B Offline
                  BlackMamba
                  wrote on 21 Nov 2016, 20:29 last edited by
                  #8

                  Doesn't look so easy. What I don't understand is that the image I showed is the standard Dial behavior in QML.
                  But when I have a look at the source code and all the files Dial.qml, I don't see the method to draw this circle ... How is that possible? Is that behavior coded in c++ ?

                  R 1 Reply Last reply 22 Nov 2016, 09:56
                  0
                  • B BlackMamba
                    21 Nov 2016, 20:29

                    Doesn't look so easy. What I don't understand is that the image I showed is the standard Dial behavior in QML.
                    But when I have a look at the source code and all the files Dial.qml, I don't see the method to draw this circle ... How is that possible? Is that behavior coded in c++ ?

                    R Offline
                    R Offline
                    Roumed
                    wrote on 22 Nov 2016, 09:56 last edited by
                    #9

                    @BlackMamba
                    Yes, it is, its ring draws in C++ at qt/qtquickcontrols2/src/imports/controls/qquickdialring.cpp and inserts as background to the control background.

                    B 1 Reply Last reply 22 Nov 2016, 12:13
                    0
                    • R Roumed
                      22 Nov 2016, 09:56

                      @BlackMamba
                      Yes, it is, its ring draws in C++ at qt/qtquickcontrols2/src/imports/controls/qquickdialring.cpp and inserts as background to the control background.

                      B Offline
                      B Offline
                      BlackMamba
                      wrote on 22 Nov 2016, 12:13 last edited by
                      #10

                      @Roumed Thanks! I successfully coded it with Canvas thanks to your help.

                      1 Reply Last reply
                      0

                      1/10

                      21 Nov 2016, 01:46

                      • Login

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