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. Changing the needle angle in CircularGauge
Forum Updated to NodeBB v4.3 + New Features

Changing the needle angle in CircularGauge

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
3 Posts 2 Posters 915 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.
  • E Offline
    E Offline
    edorval
    wrote on last edited by
    #1

    I am a beginner in Qt Creator, and I am trying to control the angle of the needle in CircularGauge. How would I go about changing this so that a slider can control the value shown by the gauge? My code is below:

    import QtQuick 2.6
    import QtQuick.Controls 1.4
    import QtQuick.Controls.Styles 1.4
    import QtQuick.Extras 1.4
    import QtQuick.Extras.Private 1.0
    import QtQuick.Window 2.2

    Rectangle {
    x: 0
    y: 0
    z: -2147483646
    width: 350
    height: 350
    color: "#494d53"

    CircularGauge {
        id: circgage
        x: 13
        y: 17
        width: 325
        height: 317
        visible: true
        maximumValue: 80
        z: 2147483645
        style: CircularGaugeStyle {
            needle: Rectangle {
                id: needlepointer
                y: outerRadius * 0.15
                implicitWidth: outerRadius * 0.03
                implicitHeight: outerRadius * 0.9
                antialiasing: true
                color: Qt.rgba(0.66, 0.3, 0, 1)
            }
        }
    
        Text {
            id: gaugename
            x: 112
            y: 234
            z: 0
            width: 102
            height: 27
            color: "#a9a9a9"
            text: qsTr("Motor RPM")
            horizontalAlignment: Text.AlignHCenter
            lineHeight: 0.6
            renderType: Text.NativeRendering
            font.pixelSize: 20
        }
    }
    
    Slider {
        id: controlslider
        x: 76
        y: 363
    }
    

    }

    ODБOïO 1 Reply Last reply
    0
    • E edorval

      I am a beginner in Qt Creator, and I am trying to control the angle of the needle in CircularGauge. How would I go about changing this so that a slider can control the value shown by the gauge? My code is below:

      import QtQuick 2.6
      import QtQuick.Controls 1.4
      import QtQuick.Controls.Styles 1.4
      import QtQuick.Extras 1.4
      import QtQuick.Extras.Private 1.0
      import QtQuick.Window 2.2

      Rectangle {
      x: 0
      y: 0
      z: -2147483646
      width: 350
      height: 350
      color: "#494d53"

      CircularGauge {
          id: circgage
          x: 13
          y: 17
          width: 325
          height: 317
          visible: true
          maximumValue: 80
          z: 2147483645
          style: CircularGaugeStyle {
              needle: Rectangle {
                  id: needlepointer
                  y: outerRadius * 0.15
                  implicitWidth: outerRadius * 0.03
                  implicitHeight: outerRadius * 0.9
                  antialiasing: true
                  color: Qt.rgba(0.66, 0.3, 0, 1)
              }
          }
      
          Text {
              id: gaugename
              x: 112
              y: 234
              z: 0
              width: 102
              height: 27
              color: "#a9a9a9"
              text: qsTr("Motor RPM")
              horizontalAlignment: Text.AlignHCenter
              lineHeight: 0.6
              renderType: Text.NativeRendering
              font.pixelSize: 20
          }
      }
      
      Slider {
          id: controlslider
          x: 76
          y: 363
      }
      

      }

      ODБOïO Offline
      ODБOïO Offline
      ODБOï
      wrote on last edited by ODБOï
      #2

      @edorval hi
      Welcome to Qt world
      Qt Creator is the IDE (integrated development environment)

      @edorval said in Changing the needle angle in CircularGauge:

      slider can control the value shown by the gauge

      The CircularGauge has value property. You only need to change it, no need to change angle mannualy
      (but you can create your own gauge and do that if you want )

      In QML for every property there is a associated on<PropertyName>Changed signal so

      Slider {
          id: controlslider
          x: 76
          y: 363
      onValueChanged :{ circgage.value = value}
      }
      

      why you put z property to -2147483646?

      E 1 Reply Last reply
      2
      • ODБOïO ODБOï

        @edorval hi
        Welcome to Qt world
        Qt Creator is the IDE (integrated development environment)

        @edorval said in Changing the needle angle in CircularGauge:

        slider can control the value shown by the gauge

        The CircularGauge has value property. You only need to change it, no need to change angle mannualy
        (but you can create your own gauge and do that if you want )

        In QML for every property there is a associated on<PropertyName>Changed signal so

        Slider {
            id: controlslider
            x: 76
            y: 363
        onValueChanged :{ circgage.value = value}
        }
        

        why you put z property to -2147483646?

        E Offline
        E Offline
        edorval
        wrote on last edited by
        #3

        @LeLev The main reason that I am doing this is so that I can read the sensors and adjust the value shown on the gauge accordingly. I am trying to use the slider to control it for a preliminary demonstration. When I will be using the gauges to their full effects, they will be displaying values outputted by sensors.

        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